Hook up data

src/lib/moderation.ts

@@ -1,3 +1,4 @@
+import React from 'react'
 import {
   ModerationCause,
   ProfileModeration,
@@ -6,6 +7,9 @@ import {
   LabelGroupDefinition,
 } from '@atproto/api'
 
+import {sanitizeDisplayName} from '#/lib/strings/display-names'
+import {sanitizeHandle} from '#/lib/strings/handles'
+
 export function getProfileModerationCauses(
   moderation: ProfileModeration,
 ): ModerationCause[] {
@@ -91,3 +95,23 @@ export function getLabelGroupsFromLabels(labels: string[]) {
 
   return Array.from(groups)
 }
+
+export function getConfigurableLabelGroups() {
+  return Object.values(LABEL_GROUPS).filter(group => group.configurable)
+}
+
+export function useConfigurableLabelGroups() {
+  return React.useMemo(() => getConfigurableLabelGroups(), [])
+}
+
+export function getModerationServiceTitle({
+  displayName,
+  handle,
+}: {
+  displayName?: string
+  handle: string
+}) {
+  return displayName
+    ? sanitizeDisplayName(displayName)
+    : sanitizeHandle(handle, '@')
+}