Changed enum naming convention

src/components/AppLayout.tsx

@@ -242,7 +242,7 @@ export function AppLayout(props: Immutable<Props>): JSX.Element {
 
         {/* Content panel */}
         <div
-          id={AnchorIds.CONTENT_PANEL}
+          id={AnchorIds.ContentPanel}
           className={`texture-paper-dots overflow-y-scroll bg-light [grid-area:content]`}
         >
           {contentPanel ? (

src/components/Markdown/Markdawn.tsx

@@ -314,27 +314,27 @@ export function preprocessMarkDawn(text: string): string {
     }
 
     if (line.startsWith("# ")) {
-      return markdawnHeadersParser(headerLevels.h1, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H1, line, visitedSlugs);
     }
 
     if (line.startsWith("## ")) {
-      return markdawnHeadersParser(headerLevels.h2, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H2, line, visitedSlugs);
     }
 
     if (line.startsWith("### ")) {
-      return markdawnHeadersParser(headerLevels.h3, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H3, line, visitedSlugs);
     }
 
     if (line.startsWith("#### ")) {
-      return markdawnHeadersParser(headerLevels.h4, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H4, line, visitedSlugs);
     }
 
     if (line.startsWith("##### ")) {
-      return markdawnHeadersParser(headerLevels.h5, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H5, line, visitedSlugs);
     }
 
     if (line.startsWith("###### ")) {
-      return markdawnHeadersParser(headerLevels.h6, line, visitedSlugs);
+      return markdawnHeadersParser(HeaderLevels.H6, line, visitedSlugs);
     }
 
     return line;
@@ -342,17 +342,17 @@ export function preprocessMarkDawn(text: string): string {
   return result.join("\n");
 }
 
-enum headerLevels {
-  h1 = 1,
-  h2 = 2,
-  h3 = 3,
-  h4 = 4,
-  h5 = 5,
-  h6 = 6,
+enum HeaderLevels {
+  H1 = 1,
+  H2 = 2,
+  H3 = 3,
+  H4 = 4,
+  H5 = 5,
+  H6 = 6,
 }
 
 function markdawnHeadersParser(
-  headerLevel: headerLevels,
+  headerLevel: HeaderLevels,
   line: string,
   visitedSlugs: string[]
 ): string {
@@ -365,5 +365,5 @@ function markdawnHeadersParser(
     index += 1;
   }
   visitedSlugs.push(newSlug);
-  return `<${headerLevels[headerLevel]} id="${newSlug}">${lineText}</${headerLevels[headerLevel]}>`;
+  return `<${HeaderLevels[headerLevel]} id="${newSlug}">${lineText}</${HeaderLevels[headerLevel]}>`;
 }

src/components/PanelComponents/ReturnButton.tsx

@@ -15,9 +15,9 @@ interface Props {
 }
 
 export enum ReturnButtonType {
-  mobile = "mobile",
-  desktop = "desktop",
-  both = "both",
+  Mobile = "mobile",
+  Desktop = "desktop",
+  Both = "both",
 }
 
 export function ReturnButton(props: Immutable<Props>): JSX.Element {
@@ -26,9 +26,9 @@ export function ReturnButton(props: Immutable<Props>): JSX.Element {
   return (
     <div
       className={`${
-        props.displayOn === ReturnButtonType.mobile
+        props.displayOn === ReturnButtonType.Mobile
           ? "desktop:hidden"
-          : props.displayOn === ReturnButtonType.desktop
+          : props.displayOn === ReturnButtonType.Desktop
           ? "mobile:hidden"
           : ""
       } ${props.className}`}

src/components/Panels/ContentPanel.tsx

@@ -7,14 +7,14 @@ interface Props {
 }
 
 export enum ContentPanelWidthSizes {
-  default = "default",
-  large = "large",
+  Default = "default",
+  Large = "large",
 }
 
 export function ContentPanel(props: Immutable<Props>): JSX.Element {
-  const width = props.width ? props.width : ContentPanelWidthSizes.default;
+  const width = props.width ? props.width : ContentPanelWidthSizes.Default;
   const widthCSS =
-    width === ContentPanelWidthSizes.default ? "max-w-2xl" : "w-full";
+    width === ContentPanelWidthSizes.Default ? "max-w-2xl" : "w-full";
 
   return (
     <div className={`grid px-4 pt-10 pb-20 desktop:py-20 desktop:px-10`}>

src/components/PostPage.tsx

@@ -70,7 +70,7 @@ export function PostPage(props: Immutable<Props>): JSX.Element {
             href={returnHref}
             title={returnTitle}
             langui={langui}
-            displayOn={ReturnButtonType.desktop}
+            displayOn={ReturnButtonType.Desktop}
             horizontalLine
           />
         )}
@@ -126,7 +126,7 @@ export function PostPage(props: Immutable<Props>): JSX.Element {
           href={returnHref}
           title={returnTitle}
           langui={langui}
-          displayOn={ReturnButtonType.mobile}
+          displayOn={ReturnButtonType.Mobile}
           horizontalLine
         />
       )}

src/hooks/useScrollTopOnChange.ts

@@ -1,7 +1,7 @@
 import { DependencyList, useEffect } from "react";
 
 export enum AnchorIds {
-  CONTENT_PANEL = "contentPanel495922447721572",
+  ContentPanel = "contentPanel495922447721572",
 }
 
 // Scroll to top of element "id" when "deps" update.

src/pages/404.tsx

@@ -19,7 +19,7 @@ export default function FourOhFour(props: Immutable<Props>): JSX.Element {
         href="/"
         title="Home"
         langui={langui}
-        displayOn={ReturnButtonType.both}
+        displayOn={ReturnButtonType.Both}
       />
     </ContentPanel>
   );

src/pages/500.tsx

@@ -19,7 +19,7 @@ export default function FiveHundred(props: Immutable<Props>): JSX.Element {
         href="/"
         title="Home"
         langui={langui}
-        displayOn={ReturnButtonType.both}
+        displayOn={ReturnButtonType.Both}
       />
     </ContentPanel>
   );

src/pages/archives/videos/c/[uid].tsx

@@ -39,7 +39,7 @@ export default function Channel(props: Props): JSX.Element {
         href="/archives/videos/"
         title={langui.videos}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         className="mb-10"
       />
 
@@ -57,7 +57,7 @@ export default function Channel(props: Props): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <div className="mb-8">
         <h1 className="text-3xl">{channel?.title}</h1>
         <p>{channel?.subscribers.toLocaleString()} subscribers</p>

src/pages/archives/videos/index.tsx

@@ -57,7 +57,7 @@ export default function Videos(props: Props): JSX.Element {
         href="/archives/"
         title={"Archives"}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         className="mb-10"
       />
 
@@ -75,7 +75,7 @@ export default function Videos(props: Props): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <PageSelector
         maxPage={Math.floor(videos.length / itemPerPage)}
         page={page}

src/pages/archives/videos/v/[uid].tsx

@@ -42,7 +42,7 @@ export default function Video(props: Props): JSX.Element {
         href="/archives/videos/"
         title={langui.videos}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         className="mb-10"
       />
 
@@ -72,12 +72,12 @@ export default function Video(props: Props): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <ReturnButton
         href="/library/"
         title={langui.library}
         langui={langui}
-        displayOn={ReturnButtonType.mobile}
+        displayOn={ReturnButtonType.Mobile}
         className="mb-10"
       />
 

src/pages/contents/[slug]/index.tsx

@@ -47,7 +47,7 @@ export default function Content(props: Immutable<Props>): JSX.Element {
     languageExtractor: (item) => item.language?.data?.attributes?.code,
   });
 
-  useScrollTopOnChange(AnchorIds.CONTENT_PANEL, [selectedTranslation]);
+  useScrollTopOnChange(AnchorIds.ContentPanel, [selectedTranslation]);
 
   const previousContent = content.group?.data?.attributes?.contents
     ? getPreviousContent(
@@ -66,7 +66,7 @@ export default function Content(props: Immutable<Props>): JSX.Element {
         href={`/contents`}
         title={langui.contents}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         horizontalLine
       />
 
@@ -205,7 +205,7 @@ export default function Content(props: Immutable<Props>): JSX.Element {
         href={`/contents`}
         title={langui.contents}
         langui={langui}
-        displayOn={ReturnButtonType.mobile}
+        displayOn={ReturnButtonType.Mobile}
         className="mb-10"
       />
 

src/pages/contents/index.tsx

@@ -116,7 +116,7 @@ export default function Contents(props: Immutable<Props>): JSX.Element {
     </SubPanel>
   );
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       {[...groups].map(([name, items]) => (
         <Fragment key={name}>
           {items.length > 0 && (

src/pages/dev/checkup/contents.tsx

@@ -21,7 +21,7 @@ export default function CheckupContents(props: Immutable<Props>): JSX.Element {
   const testReport = testingContent(contents);
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       {<h2 className="text-2xl">{testReport.title}</h2>}
 
       <div className="my-4 grid grid-cols-[2em,3em,2fr,1fr,0.5fr,0.5fr,2fr] items-center gap-2">

src/pages/dev/checkup/libraryitems.tsx

@@ -26,7 +26,7 @@ export default function CheckupLibraryItems(
   const testReport = testingLibraryItem(libraryItems);
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       {<h2 className="text-2xl">{testReport.title}</h2>}
 
       <div className="my-4 grid grid-cols-[2em,3em,2fr,1fr,0.5fr,0.5fr,2fr] items-center gap-2">

src/pages/dev/editor.tsx

@@ -40,7 +40,7 @@ export default function Editor(props: Immutable<Props>): JSX.Element {
   }
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <Popup setState={setConverterOpened} state={converterOpened}>
         <div className="text-center">
           <h2 className="mt-4">Convert HTML to markdown</h2>

src/pages/library/[slug]/index.tsx

@@ -58,7 +58,7 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
   const { item, langui, currencies } = props;
   const appLayout = useAppLayout();
 
-  useScrollTopOnChange(AnchorIds.CONTENT_PANEL, [item]);
+  useScrollTopOnChange(AnchorIds.ContentPanel, [item]);
 
   const isVariantSet =
     item?.metadata?.[0]?.__typename === "ComponentMetadataGroup" &&
@@ -85,7 +85,7 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
         href="/library/"
         title={langui.library}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         horizontalLine
       />
 
@@ -114,14 +114,14 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <LightBox />
 
       <ReturnButton
         href="/library/"
         title={langui.library}
         langui={langui}
-        displayOn={ReturnButtonType.mobile}
+        displayOn={ReturnButtonType.Mobile}
         className="mb-10"
       />
       <div className="grid place-items-center gap-12">
@@ -438,7 +438,10 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
           <div id="contents" className="grid w-full place-items-center gap-8">
             <h2 className="-mb-6 text-2xl">{langui.contents}</h2>
             {displayOpenScans && (
-              <Button href={`/library/${item.slug}/scans`} text={langui.view_scans}/>
+              <Button
+                href={`/library/${item.slug}/scans`}
+                text={langui.view_scans}
+              />
             )}
             <div className="grid w-full gap-4">
               {item.contents.data.map((content) => (

src/pages/library/[slug]/scans.tsx

@@ -45,7 +45,7 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
         href={`/library/${item?.slug}`}
         title={langui.item}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         horizontalLine
       />
 
@@ -69,14 +69,14 @@ export default function LibrarySlug(props: Immutable<Props>): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <LightBox />
 
       <ReturnButton
         href={`/library/${item?.slug}`}
         title={langui.item}
         langui={langui}
-        displayOn={ReturnButtonType.mobile}
+        displayOn={ReturnButtonType.Mobile}
         className="mb-10"
       />
 

src/pages/library/index.tsx

@@ -155,7 +155,7 @@ export default function Library(props: Immutable<Props>): JSX.Element {
     </SubPanel>
   );
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       {[...groups].map(([name, items]) => (
         <Fragment key={name}>
           {items.length > 0 && (

src/pages/news/index.tsx

@@ -42,7 +42,7 @@ export default function News(props: Immutable<Props>): JSX.Element {
   );
 
   const contentPanel = (
-    <ContentPanel width={ContentPanelWidthSizes.large}>
+    <ContentPanel width={ContentPanelWidthSizes.Large}>
       <div
         className="grid grid-cols-1 items-end gap-8
         desktop:grid-cols-[repeat(auto-fill,_minmax(20rem,1fr))]"

src/pages/wiki/chronology.tsx

@@ -65,7 +65,7 @@ export default function Chronology(props: Props): JSX.Element {
         href="/wiki"
         title={langui.wiki}
         langui={langui}
-        displayOn={ReturnButtonType.desktop}
+        displayOn={ReturnButtonType.Desktop}
         horizontalLine
       />
 
@@ -96,7 +96,7 @@ export default function Chronology(props: Props): JSX.Element {
         href="/wiki"
         title={langui.wiki}
         langui={langui}
-        displayOn={ReturnButtonType.mobile}
+        displayOn={ReturnButtonType.Mobile}
         className="mb-10"
       />