(chore) Ban enums

eslint.config.mjs

@@ -70,6 +70,13 @@ export default [
       "@typescript-eslint/no-empty-object-type": 0,
       "@typescript-eslint/no-empty-interface": 0,
       "react/jsx-curly-brace-presence": ["warn", "never"],
+      "no-restricted-syntax": [
+        "error",
+        {
+          selector: "TSEnumDeclaration",
+          message: "Don't declare enums",
+        },
+      ],
       eqeqeq: ["warn", "smart"],
       "no-unreachable": ["warn"],
 

src/features/comment/CommentHeader.tsx

@@ -179,16 +179,16 @@ export default function CommentHeader({
   return <Header>{content}</Header>;
 }
 
-enum StubType {
-  None,
-  Deleted,
-  ModRemoved,
-}
+const StubType = {
+  None: 0,
+  Deleted: 1,
+  ModRemoved: 2,
+} as const;
 
 export function isStubComment(
   comment: Comment,
   canModerate: ModeratorRole | undefined,
-): StubType {
+): (typeof StubType)[keyof typeof StubType] {
   if (comment.deleted) return StubType.Deleted;
 
   if (comment.removed && !canModerate) return StubType.ModRemoved;

src/features/community/list/AlphabetJump.tsx

@@ -18,13 +18,15 @@ const alphabetUpperCase = Array.from({ length: 26 }, (_, i) =>
   String.fromCharCode(65 + i),
 );
 
-enum SpecialSection {
-  Home = 0,
-  Favorited = 1,
-  Moderated = 2,
-}
+const SpecialSection = {
+  Home: 0,
+  Favorited: 1,
+  Moderated: 2,
+} as const;
+
+type SpecialSectionType = (typeof SpecialSection)[keyof typeof SpecialSection];
 
-type JumpItem = SpecialSection | string;
+type JumpItem = SpecialSectionType | string;
 
 const SECTIONS = [
   <IonIcon icon={menuOutline} key={0} />,

src/features/moderation/ModeratableItem.tsx

@@ -1,5 +1,5 @@
 import ModeratableItemBanner, {
-  ItemModState,
+  ItemModStateType,
   useItemModState,
   getModStateBackgroundColor,
 } from "./banner/ModeratableItemBanner";
@@ -11,7 +11,7 @@ import { styled } from "@linaria/react";
 import { isPost } from "../../helpers/lemmy";
 
 const ModeratableItemContainer = styled.div<{
-  modState?: ItemModState;
+  modState?: ItemModStateType;
   highlighted?: boolean;
 }>`
   width: 100%;

src/features/moderation/banner/ModeratableItemBanner.tsx

@@ -9,8 +9,16 @@ import ReportBanner from "./ReportBanner";
 import { maxWidthCss } from "../../shared/AppContent";
 import { styled } from "@linaria/react";
 
+export const ItemModState = {
+  None: 0,
+  Flagged: 1,
+  RemovedByMod: 2,
+} as const;
+
+export type ItemModStateType = (typeof ItemModState)[keyof typeof ItemModState];
+
 export const Banner = styled.div<{
-  modState: ItemModState.Flagged | ItemModState.RemovedByMod;
+  modState: typeof ItemModState.Flagged | typeof ItemModState.RemovedByMod;
 }>`
   ${maxWidthCss}
 
@@ -31,7 +39,7 @@ export const Banner = styled.div<{
 `;
 
 interface RemovedByBannerProps {
-  modState: ItemModState;
+  modState: ItemModStateType;
   itemView: CommentView | PostView;
 }
 
@@ -49,13 +57,7 @@ export default function ModeratableItemBanner({
   }
 }
 
-export enum ItemModState {
-  None,
-  Flagged,
-  RemovedByMod,
-}
-
-export function useItemModState(item: Comment | Post): ItemModState {
+export function useItemModState(item: Comment | Post): ItemModStateType {
   const hasPostReports = useAppSelector(
     (state) => !!reportsByPostIdSelector(state)[item.id]?.length,
   );
@@ -75,7 +77,7 @@ export function useItemModState(item: Comment | Post): ItemModState {
 }
 
 export function getModStateBackgroundColor(
-  modState: ItemModState,
+  modState: ItemModStateType,
 ): string | undefined {
   switch (modState) {
     case ItemModState.Flagged:
@@ -88,7 +90,7 @@ export function getModStateBackgroundColor(
 }
 
 export function getModStateBannerBgColor(
-  modState: ItemModState,
+  modState: ItemModStateType,
 ): string | undefined {
   switch (modState) {
     case ItemModState.Flagged:
@@ -101,7 +103,7 @@ export function getModStateBannerBgColor(
 }
 
 export function getModStateBannerColor(
-  modState: ItemModState,
+  modState: ItemModStateType,
 ): string | undefined {
   switch (modState) {
     case ItemModState.Flagged: