From 5b042a77e2b4a9fa59c3ae533c7c264c67eb1404 Mon Sep 17 00:00:00 2001
From: DrMint <29893320+DrMint@users.noreply.github.com>
Date: Wed, 22 Feb 2023 06:21:20 +0100
Subject: [PATCH] Added missing embellishment to components

---
 src/components/AppLayout.tsx                   |  5 ++++-
 src/components/Chronicles/ChroniclePreview.tsx |  2 ++
 src/components/Chronicles/ChroniclesList.tsx   |  2 ++
 src/components/ColoredSvg.tsx                  |  7 +++++++
 src/components/Containers/Paginator.tsx        |  7 +++++++
 src/components/Containers/UpPressable.tsx      |  7 +++++++
 src/components/Contents/PreviewFolder.tsx      | 12 +++++++++++-
 src/components/Inputs/Link.tsx                 | 14 ++++++++++++++
 src/components/LightBox.tsx                    | 10 ++++++++++
 src/components/Panels/SearchPopup.tsx          |  5 +++++
 10 files changed, 69 insertions(+), 2 deletions(-)

diff --git a/src/components/AppLayout.tsx b/src/components/AppLayout.tsx
index 318ee8f..03772c0 100644
--- a/src/components/AppLayout.tsx
+++ b/src/components/AppLayout.tsx
@@ -230,7 +230,10 @@ export const AppLayout = ({
   );
 };
 
-// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+/*
+ *                                    ╭──────────────────────╮
+ * ───────────────────────────────────╯  PRIVATE COMPONENTS  ╰──────────────────────────────────────
+ */
 
 interface ContentPlaceholderProps {
   message: string;
diff --git a/src/components/Chronicles/ChroniclePreview.tsx b/src/components/Chronicles/ChroniclePreview.tsx
index aaea763..063ea22 100644
--- a/src/components/Chronicles/ChroniclePreview.tsx
+++ b/src/components/Chronicles/ChroniclePreview.tsx
@@ -20,6 +20,8 @@ interface Props {
   onClick?: MouseEventHandler<HTMLAnchorElement>;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const ChroniclePreview = ({
   date,
   url,
diff --git a/src/components/Chronicles/ChroniclesList.tsx b/src/components/Chronicles/ChroniclesList.tsx
index fbb6c47..10569a4 100644
--- a/src/components/Chronicles/ChroniclesList.tsx
+++ b/src/components/Chronicles/ChroniclesList.tsx
@@ -26,6 +26,8 @@ interface Props {
   title: string;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 const ChroniclesList = ({ chronicles, currentSlug, title }: Props): JSX.Element => {
   const setSubPanelOpened = useAtomSetter(atoms.layout.subPanelOpened);
   const { value: isOpen, toggle: toggleOpen } = useBoolean(
diff --git a/src/components/ColoredSvg.tsx b/src/components/ColoredSvg.tsx
index 14d2df7..87ed158 100644
--- a/src/components/ColoredSvg.tsx
+++ b/src/components/ColoredSvg.tsx
@@ -1,10 +1,17 @@
 import { cJoin } from "helpers/className";
 
+/*
+ *                                         ╭─────────────╮
+ * ────────────────────────────────────────╯  CONSTANTS  ╰──────────────────────────────────────────
+ */
+
 interface Props {
   src: string;
   className?: string;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const ColoredSvg = ({ src, className }: Props): JSX.Element => (
   <div
     className={cJoin(
diff --git a/src/components/Containers/Paginator.tsx b/src/components/Containers/Paginator.tsx
index bfbe274..88ebb93 100644
--- a/src/components/Containers/Paginator.tsx
+++ b/src/components/Containers/Paginator.tsx
@@ -8,6 +8,11 @@ import { useFormat } from "hooks/useFormat";
 import { useScrollTopOnChange } from "hooks/useScrollTopOnChange";
 import { Ids } from "types/ids";
 
+/*
+ *                                        ╭─────────────╮
+ * ───────────────────────────────────────╯  COMPONENT  ╰───────────────────────────────────────────
+ */
+
 interface Props {
   page: number;
   onPageChange: (newPage: number) => void;
@@ -15,6 +20,8 @@ interface Props {
   children: React.ReactNode;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const Paginator = ({
   page,
   onPageChange,
diff --git a/src/components/Containers/UpPressable.tsx b/src/components/Containers/UpPressable.tsx
index a9be0a9..7762369 100644
--- a/src/components/Containers/UpPressable.tsx
+++ b/src/components/Containers/UpPressable.tsx
@@ -2,6 +2,11 @@ import { MouseEventHandler, useState } from "react";
 import { Link } from "components/Inputs/Link";
 import { cIf, cJoin } from "helpers/className";
 
+/*
+ *                                        ╭─────────────╮
+ * ───────────────────────────────────────╯  COMPONENT  ╰───────────────────────────────────────────
+ */
+
 interface Props {
   children: React.ReactNode;
   href: string;
@@ -11,6 +16,8 @@ interface Props {
   onClick?: MouseEventHandler<HTMLAnchorElement>;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const UpPressable = ({
   children,
   href,
diff --git a/src/components/Contents/PreviewFolder.tsx b/src/components/Contents/PreviewFolder.tsx
index fe4f056..473e260 100644
--- a/src/components/Contents/PreviewFolder.tsx
+++ b/src/components/Contents/PreviewFolder.tsx
@@ -4,12 +4,19 @@ import { TranslatedProps } from "types/TranslatedProps";
 import { UpPressable } from "components/Containers/UpPressable";
 import { cIf, cJoin } from "helpers/className";
 
+/*
+ *                                        ╭─────────────╮
+ * ───────────────────────────────────────╯  COMPONENT  ╰───────────────────────────────────────────
+ */
+
 interface PreviewFolderProps {
   href: string;
   title?: string | null;
   disabled?: boolean;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const PreviewFolder = ({ href, title, disabled }: PreviewFolderProps): JSX.Element => (
   <UpPressable href={href} disabled={disabled}>
     <div
@@ -23,7 +30,10 @@ export const PreviewFolder = ({ href, title, disabled }: PreviewFolderProps): JS
   </UpPressable>
 );
 
-// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+/*
+ *                                    ╭──────────────────────╮
+ * ───────────────────────────────────╯  TRANSLATED VARIANT  ╰──────────────────────────────────────
+ */
 
 export const TranslatedPreviewFolder = ({
   translations,
diff --git a/src/components/Inputs/Link.tsx b/src/components/Inputs/Link.tsx
index 98825a8..eb1d1a4 100644
--- a/src/components/Inputs/Link.tsx
+++ b/src/components/Inputs/Link.tsx
@@ -4,6 +4,11 @@ import { ConditionalWrapper, Wrapper } from "helpers/component";
 import { isDefinedAndNotEmpty } from "helpers/asserts";
 import { cIf, cJoin } from "helpers/className";
 
+/*
+ *                                        ╭─────────────╮
+ * ───────────────────────────────────────╯  COMPONENT  ╰───────────────────────────────────────────
+ */
+
 interface Props {
   href: string | null | undefined;
   className?: string;
@@ -15,6 +20,8 @@ interface Props {
   linkStyled?: boolean;
 }
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 export const Link = ({
   href,
   children,
@@ -48,6 +55,11 @@ export const Link = ({
   </ConditionalWrapper>
 );
 
+/*
+ *                                    ╭──────────────────────╮
+ * ───────────────────────────────────╯  PRIVATE COMPONENTS  ╰──────────────────────────────────────
+ */
+
 interface LinkWrapperProps {
   href: string;
   className?: string;
@@ -77,6 +89,8 @@ const LinkWrapper = ({
   </NextLink>
 );
 
+// ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─
+
 interface DisabledWrapperProps {
   className?: string;
 }
diff --git a/src/components/LightBox.tsx b/src/components/LightBox.tsx
index a393490..f726a47 100644
--- a/src/components/LightBox.tsx
+++ b/src/components/LightBox.tsx
@@ -12,6 +12,11 @@ import { isDefined } from "helpers/asserts";
 import { useAtomGetter } from "helpers/atoms";
 import { atoms } from "contexts/atoms";
 
+/*
+ *                                        ╭─────────────╮
+ * ───────────────────────────────────────╯  COMPONENT  ╰───────────────────────────────────────────
+ */
+
 interface Props {
   onCloseRequest: () => void;
   isVisible: boolean;
@@ -119,6 +124,11 @@ export const LightBox = ({
   );
 };
 
+/*
+ *                                    ╭──────────────────────╮
+ * ───────────────────────────────────╯  PRIVATE COMPONENTS  ╰──────────────────────────────────────
+ */
+
 interface ControlButtonsProps {
   isPreviousImageAvailable: boolean;
   isNextImageAvailable: boolean;
diff --git a/src/components/Panels/SearchPopup.tsx b/src/components/Panels/SearchPopup.tsx
index 0ad0aec..9dbba08 100644
--- a/src/components/Panels/SearchPopup.tsx
+++ b/src/components/Panels/SearchPopup.tsx
@@ -481,6 +481,11 @@ export const SearchPopup = (): JSX.Element => {
   );
 };
 
+/*
+ *                                    ╭──────────────────────╮
+ * ───────────────────────────────────╯  PRIVATE COMPONENTS  ╰──────────────────────────────────────
+ */
+
 interface SearchResultSectionProps {
   title?: string | null;
   icon: MaterialSymbol;