From b21a5fefca71d7a2afa4407c6bbc8e146e49d089 Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Fri, 31 Dec 2021 05:53:08 -0500
Subject: [PATCH] add warning to model view

---
 .../view/tts/tts_model_view/TtsModelViewFc.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/fakeyou/src/v2/view/tts/tts_model_view/TtsModelViewFc.tsx b/fakeyou/src/v2/view/tts/tts_model_view/TtsModelViewFc.tsx
index 730e4f8e4a..4bf7f33fea 100644
--- a/fakeyou/src/v2/view/tts/tts_model_view/TtsModelViewFc.tsx
+++ b/fakeyou/src/v2/view/tts/tts_model_view/TtsModelViewFc.tsx
@@ -14,6 +14,8 @@ import { GravatarFc } from '../../_common/GravatarFc';
 import { GetTtsModelUseCount } from '../../../api/tts/GetTtsModelUseCount';
 import { BackLink } from '../../_common/BackLink';
 import { ListTtsCategoriesForModel, ListTtsCategoriesForModelIsError, ListTtsCategoriesForModelIsOk, TtsModelCategory } from '../../../api/category/ListTtsCategoriesForModel';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faExclamationCircle } from '@fortawesome/free-solid-svg-icons';
 
 interface Props {
   sessionWrapper: SessionWrapper,
@@ -264,9 +266,23 @@ function TtsModelViewFc(props: Props) {
           <div className="content">
             <ul>
             {assignedCategories.map(category => {
+              let notApprovedWarning = null;
+
+              if (!category.is_mod_approved) {
+                notApprovedWarning = (
+                  <>
+                    <span className="tag is-rounded is-warning is-medium is-light">
+                      Not Mod Approved
+                      &nbsp;
+                      <FontAwesomeIcon icon={faExclamationCircle} />
+                    </span>
+                  </>
+                )
+              }
+
               return (
                 <>
-                  <li>{category.name}</li>
+                  <li>{category.name} {notApprovedWarning}</li>
                 </>
               );
             })}