🧹 Cleanup label related changes

bluesky-social · Mar 12, 2024 · c26ecbb · c26ecbb
1 parent 970d95a
commit c26ecbb
Show file tree

Hide file tree

Showing 4 changed files with 97 additions and 22 deletions.
diff --git a/app/actions/ModActionPanel/QuickAction.tsx b/app/actions/ModActionPanel/QuickAction.tsx
@@ -21,9 +21,9 @@ import {
   displayLabel,
   getLabelsForSubject,
   toLabelVal,
+  getLabelGroupInfo,
   unFlagSelfLabel,
   isSelfLabel,
-  LabelGroupInfo,
 } from '@/common/labels'
 import { FullScreenActionPanel } from '@/common/FullScreenActionPanel'
 import { PreviewCard } from '@/common/PreviewCard'
@@ -535,10 +535,11 @@ function Form(
                 <LabelList className="-ml-1">
                   {!currentLabels.length && <LabelListEmpty className="ml-1" />}
                   {currentLabels.map((label) => {
+                    const labelGroup = getLabelGroupInfo(unFlagSelfLabel(label))
                     return (
                       <LabelChip
                         key={label}
-                        style={{ color: LabelGroupInfo[label]?.color }}
+                        style={{ color: labelGroup.color }}
                       >
                         {displayLabel(label)}
                       </LabelChip>

diff --git a/components/common/labels/util.ts b/components/common/labels/util.ts
@@ -3,9 +3,22 @@ import {
   AppBskyActorDefs,
   ComAtprotoAdminDefs,
   ComAtprotoLabelDefs,
+  LabelDefinition,
+  LabelGroupDefinition,
   LABELS,
+  LABEL_GROUPS,
 } from '@atproto/api'
 
+type LabelGroupInfoRecord = {
+  color: string
+  labels: Array<string | LabelDefinition>
+}
+
+type GroupedLabelList = Record<
+  string,
+  LabelGroupInfoRecord & Omit<LabelGroupDefinition, 'labels'>
+>
+
 export function diffLabels(current: string[], next: string[]) {
   return {
     createLabelVals: next
@@ -40,35 +53,95 @@ export function toLabelVal(
   return val
 }
 
-export const ALL_LABELS = LABELS
+export const labelOptions = Object.keys(LABELS)
 
-export const LabelGroupInfo: Record<string, { color: string }> = {
-  [LABELS.sexual.identifier]: {
+export const LabelGroupInfo: Record<
+  string,
+  Partial<LabelGroupDefinition> & { color: string }
+> = {
+  [LABEL_GROUPS.system.id]: {
+    color: '#c45722',
+  },
+  [LABEL_GROUPS.sexual.id]: {
     color: '#d45722',
   },
-  [LABELS.gore.identifier]: {
+  [LABEL_GROUPS.violence.id]: {
     color: '#d42222',
   },
-  [LABELS.porn.identifier]: {
+  [LABEL_GROUPS.intolerance.id]: {
     color: '#d422bc',
   },
-  [LABELS.nudity.identifier]: {
+  [LABEL_GROUPS.legal.id]: {
     color: '#3502cc',
   },
-  [LABELS.doxxing.identifier]: {
+  [LABEL_GROUPS.rude.id]: {
     color: '#ccb802',
   },
+  [LABEL_GROUPS.curation.id]: {
+    color: '#ff0303',
+  },
+  [LABEL_GROUPS.misinfo.id]: {
+    color: '#530303',
+  },
+  uncategorized: {
+    strings: {
+      settings: {
+        en: {
+          name: 'Uncategorzied',
+          description: 'Labels that have not been categorized yet',
+        },
+      },
+    },
+    color: '',
+    labels: [],
+  },
 }
 
-const labelsRequiring = [
-  LABELS.gore.identifier,
-  LABELS.porn.identifier,
-  LABELS.nudity.identifier,
-  LABELS.sexual.identifier,
+const labelGroupsRequiringBlur = [
+  LABEL_GROUPS.violence.id,
+  LABEL_GROUPS.sexual.id,
 ]
 
+export const groupLabelList = (labels: string[]): GroupedLabelList => {
+  const groupedList: GroupedLabelList = {}
+
+  labels.forEach((label) => {
+    // SELF_FLAG is embedded in the label value so when grouping, we have to take it out of the value
+    const cleanedLabel = unFlagSelfLabel(label)
+    const group = LABELS[cleanedLabel]
+    const groupId = group?.groupId || 'uncategorized'
+
+    if (groupedList[groupId]) {
+      groupedList[groupId].labels.push(label)
+    } else {
+      groupedList[groupId] = {
+        ...(LabelGroupInfo[groupId] || LabelGroupInfo.uncategorized),
+        ...(LABEL_GROUPS[groupId] || {}),
+        labels: [label],
+      }
+    }
+  })
+
+  return groupedList
+}
+
+export const getLabelGroupInfo = (label: string): LabelGroupInfoRecord => {
+  const group = LABELS[label]
+  const groupId = group?.groupId || 'uncategorized'
+
+  return {
+    // TODO: We shouldn't have to do this, there's a weird type def somewhere that's causing this
+    labels: [],
+    ...LabelGroupInfo.uncategorized,
+    ...(LabelGroupInfo[groupId] || {}),
+    ...(group || {}),
+  }
+}
+
 export const doesLabelNeedBlur = (labels?: string[]): boolean =>
-  !!labels?.find((label) => labelsRequiring.includes(label))
+  !!labels?.find((label) =>
+    labelGroupsRequiringBlur.includes(LABELS[label]?.groupId),
+  )
 
 export const doesProfileNeedBlur = ({
   profile,

diff --git a/components/common/posts/PostsFeed.tsx b/components/common/posts/PostsFeed.tsx
@@ -26,6 +26,7 @@ import {
   doesLabelNeedBlur,
   toLabelVal,
   LabelGroupInfo,
+  getLabelGroupInfo,
 } from '../labels'
 import { CollectionId } from '@/reports/helpers/subject'
 import { ProfileAvatar } from '@/repositories/ProfileAvatar'
@@ -417,14 +418,15 @@ function PostLabels({
     <LabelList className={`pb-2 ${dense ? 'pl-10' : 'pl-14'}`}>
       {labels?.map((label, i) => {
         const { val, src } = label
+        const labelGroup = getLabelGroupInfo(val)
         return (
           <LabelChip
             className={`${i === 0 ? 'ml-0' : ''} text-[${
-              LabelGroupInfo[val]?.color
+              labelGroup.color
             }]`}
             // TODO: Ideally, we should just use inline class name but it only works when the class names are static
             // so trying to work around that with style prop for now
-            style={{ color: LabelGroupInfo[val]?.color }}
+            style={{ color: labelGroup.color }}
             // there may be multiple labels with the same val for the same cid, where the labeler is different
             // so we need to use the label src is in the key to guaranty uniqueness
             key={`${cid}_${val}_${src}`}

diff --git a/components/mod-event/EventItem.tsx b/components/mod-event/EventItem.tsx
@@ -3,7 +3,8 @@ import {
   LabelChip,
   LabelList,
   displayLabel,
-  LabelGroupInfo,
+  getLabelGroupInfo,
+  unFlagSelfLabel,
 } from '@/common/labels'
 import { ReasonBadge } from '@/reports/ReasonBadge'
 import { ComAtprotoAdminDefs, ComAtprotoModerationDefs } from '@atproto/api'
@@ -157,11 +158,9 @@ const EventLabels = ({
     <LabelList>
       <span className="text-gray-500 dark:text-gray-50">{header}</span>
       {labels.map((label) => {
+        const labelGroup = getLabelGroupInfo(unFlagSelfLabel(label))
         return (
-          <LabelChip
-            key={label}
-            style={{ color: LabelGroupInfo[label]?.color }}
-          >
+          <LabelChip key={label} style={{ color: labelGroup.color }}>
             {displayLabel(label)}
           </LabelChip>
         )