Implement label handling

src/lib/moderation/useModerationCauseDescription.ts

@@ -1,21 +1,31 @@
-import {ModerationCause, LABELS} from '@atproto/api'
+import {ModerationCause} from '@atproto/api'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
-import {useLabelStrings} from './useLabelStrings'
+import {useGlobalLabelStrings} from './useGlobalLabelStrings'
+import {useLabelDefinitions} from '#/state/queries/preferences'
+import {getDefinition, getLabelStrings} from './useLabelInfo'
+
+import {TriangleExclamation_Stroke2_Corner2_Rounded as TriangleExclamation} from '#/components/icons/TriangleExclamation'
+import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo'
+import {EyeSlash_Stroke2_Corner0_Rounded as EyeSlash} from '#/components/icons/EyeSlash'
+import {CircleBanSign_Stroke2_Corner0_Rounded as CircleBanSign} from '#/components/icons/CircleBanSign'
 
 export interface ModerationCauseDescription {
+  icon: any
   name: string
   description: string
+  source?: string
 }
 
 export function useModerationCauseDescription(
   cause: ModerationCause | undefined,
-  context: 'account' | 'content',
 ): ModerationCauseDescription {
-  const {_} = useLingui()
-  const labelStrings = useLabelStrings()
+  const {_, i18n} = useLingui()
+  const globalLabelStrings = useGlobalLabelStrings()
+  const {labelDefs, labelers} = useLabelDefinitions()
   if (!cause) {
     return {
+      icon: TriangleExclamation,
       name: _(msg`Content Warning`),
       description: _(
         msg`Moderator has chosen to set a general warning on the content.`,
@@ -25,6 +35,7 @@ export function useModerationCauseDescription(
   if (cause.type === 'blocking') {
     if (cause.source.type === 'list') {
       return {
+        icon: CircleBanSign,
         name: _(msg`User Blocked by "${cause.source.list.name}"`),
         description: _(
           msg`You have blocked this user. You cannot view their content.`,
@@ -32,6 +43,7 @@ export function useModerationCauseDescription(
       }
     } else {
       return {
+        icon: CircleBanSign,
         name: _(msg`User Blocked`),
         description: _(
           msg`You have blocked this user. You cannot view their content.`,
@@ -41,6 +53,7 @@ export function useModerationCauseDescription(
   }
   if (cause.type === 'blocked-by') {
     return {
+      icon: CircleBanSign,
       name: _(msg`User Blocking You`),
       description: _(
         msg`This user has blocked you. You cannot view their content.`,
@@ -49,6 +62,7 @@ export function useModerationCauseDescription(
   }
   if (cause.type === 'block-other') {
     return {
+      icon: CircleBanSign,
       name: _(msg`Content Not Available`),
       description: _(
         msg`This content is not available because one of the users involved has blocked the other.`,
@@ -58,11 +72,13 @@ export function useModerationCauseDescription(
   if (cause.type === 'muted') {
     if (cause.source.type === 'list') {
       return {
+        icon: EyeSlash,
         name: _(msg`Muted by "${cause.source.list.name}"`),
         description: _(msg`You have muted this user`),
       }
     } else {
       return {
+        icon: EyeSlash,
         name: _(msg`Muted User`),
         description: _(msg`You have muted this user`),
       }
@@ -71,30 +87,30 @@ export function useModerationCauseDescription(
   // @ts-ignore Temporary extension to the moderation system -prf
   if (cause.type === 'hidden') {
     return {
+      icon: EyeSlash,
       name: _(msg`Post Hidden by You`),
       description: _(msg`You have hidden this post`),
     }
   }
   if (cause.type === 'label') {
-    if (cause.labelDef.identifier in labelStrings) {
-      const strings =
-        labelStrings[cause.labelDef.identifier as keyof typeof LABELS]
-      return {
-        name:
-          context === 'account' ? strings.account.name : strings.content.name,
-        description:
-          context === 'account'
-            ? strings.account.description
-            : strings.content.description,
-      }
-    }
+    const def = getDefinition(labelDefs, cause.label)
+    const strings = getLabelStrings(i18n.locale, globalLabelStrings, def)
+    const labeler = labelers.find(l => l.creator.did === cause.label.src)
     return {
-      name: cause.labelDef.identifier,
-      description: _(msg`Labeled ${cause.labelDef.identifier}`),
+      icon:
+        def.identifier === '!no-unauthenticated'
+          ? EyeSlash
+          : def.severity === 'alert'
+          ? TriangleExclamation
+          : CircleInfo,
+      name: strings.name,
+      description: strings.description,
+      source: labeler?.creator.displayName || labeler?.creator.handle,
     }
   }
   // should never happen
   return {
+    icon: CircleInfo,
     name: '',
     description: ``,
   }