union types

fakeyou/src/v2/api/category/ListTtsCategories.ts

@@ -19,9 +19,9 @@ export interface TtsCategory {
 
   is_mod_approved?: boolean,
 
-  category_created_at: Date,
-  category_updated_at: Date,
-  category_deleted_at?: Date,
+  created_at: Date,
+  updated_at: Date,
+  deleted_at?: Date,
 }
 
 export interface ListTtsCategoriesErrorResponse {

fakeyou/src/v2/view/_common/CategoryBreadcrumb.tsx

@@ -4,10 +4,12 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import { FrontendUrlConfig } from '../../../common/FrontendUrlConfig';
 import { TtsCategory } from '../../api/category/ListTtsCategories';
+import { TtsModelCategory } from '../../api/category/ListTtsCategoriesForModel';
 
 export interface Props {
   // This is a list of categories in order: [grandparent/root, parent, child/leaf]
-  categoryHierarchy: TtsCategory[]
+  // Note: The two possible types differ in their timestamp names.
+  categoryHierarchy: (TtsCategory|TtsModelCategory)[]
   // Whether we're rendering for a moderator
   isCategoryMod: boolean,
   // If we're showing this on a category edit page, this is false.
@@ -33,7 +35,15 @@ export function CategoryBreadcrumb(props: Props) {
           parentCount++;
         }
 
-        if (!!category.category_deleted_at) {
+        // We're handling a union type of JSON response payloads; each names its deleted timestamp differently.
+        let deleted = false;
+        if ('deleted_at' in category) {
+          deleted = !!category.deleted_at;
+        } else if ('category_deleted_at' in category) {
+          deleted = !!category.category_deleted_at;
+        }
+
+        if (deleted) {
             deletedWarning = (
             <>
                 <span className="tag is-rounded is-warning is-medium is-light">

fakeyou/src/v2/view/moderation/categories/ModerationTtsCategoryEditPage.tsx

@@ -323,6 +323,7 @@ function ModerationTtsCategoryEditPage(props: Props) {
   )
 }
 
+// FIXME: This has been implemented three times, slightly differently
 function recursiveBuildHierarchy(allCategories: TtsCategory[], currentToken: string): TtsCategory[] {
   let found = allCategories.find(category => category.category_token === currentToken);
   if (found === undefined) {

fakeyou/src/v2/view/moderation/categories/ModerationTtsCategoryListPage.tsx

@@ -7,6 +7,7 @@ import { GravatarFc } from '../../_common/GravatarFc';
 import { Link } from 'react-router-dom';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faBox, faLock } from '@fortawesome/free-solid-svg-icons';
+import { CategoryBreadcrumb } from '../../_common/CategoryBreadcrumb';
 
 interface Props {
   sessionWrapper: SessionWrapper,
@@ -164,6 +165,8 @@ function ModerationTtsCategoryListPage(props: Props) {
         </thead>
         <tbody>
           {ttsCategoriesSorted.map(category => {
+            const categoryHierarchy = recursiveBuildHierarchy(ttsCategories, category.category_token);
+
             let modOnlyIcon = category.can_only_mods_apply ? 
               <>&nbsp;<FontAwesomeIcon icon={faLock} title={"mod only"} /></> :
               <></>;
@@ -215,6 +218,7 @@ function ModerationTtsCategoryListPage(props: Props) {
             return (
               <tr key={category.category_token}>
                 <td>
+                  <CategoryBreadcrumb categoryHierarchy={categoryHierarchy} isCategoryMod={true} leafHasModels={false} />
                   {name}
                 </td>
                 <td>
@@ -259,4 +263,17 @@ function StringToTriState(state: string) : ListTtsCategoriesTriState | undefined
   }
 }
 
+// FIXME: This has been implemented three times, slightly differently
+function recursiveBuildHierarchy(allCategories: ModerationTtsCategory[], currentToken: string): ModerationTtsCategory[] {
+  let found = allCategories.find(category => category.category_token === currentToken);
+  if (found === undefined) {
+    return [];
+  }
+  if (found.maybe_super_category_token === undefined) {
+    return [found];
+  }
+  return [...recursiveBuildHierarchy(allCategories, found.maybe_super_category_token), found];
+}
+
+
 export { ModerationTtsCategoryListPage };

fakeyou/src/v2/view/tts/tts_model_view/TtsModelViewFc.tsx

@@ -449,13 +449,14 @@ function TtsModelViewFc(props: Props) {
   )
 }
 
+// FIXME: This has been implemented three times, slightly differently
 function recursiveBuildHierarchy(
   categoryByTokenMap: Map<string, TtsCategory>, 
   assignedCategoryByTokenMap: Map<string, TtsModelCategory>, 
   currentToken: string
-): TtsCategory[] {
+): (TtsCategory|TtsModelCategory)[] {
   // NB: Using both maps should catch assigned categories that aren't public/approved.
-  let found = assignedCategoryByTokenMap.get(currentToken);
+  let found : TtsCategory | TtsModelCategory | undefined = assignedCategoryByTokenMap.get(currentToken);
   if (found === undefined) {
     found = categoryByTokenMap.get(currentToken);
   }