feat: implement settings API for toggling forum and bug reporting features

nest-intra/src/pages/intranet/IntranetModeration.tsx

@@ -1,5 +1,6 @@
-import { useState, useMemo, useCallback } from 'react';
+import { useState, useMemo, useCallback, useEffect } from 'react';
 import { formatDateTime } from '../../utils/format';
+import { settingsApi } from '../../utils/api';
 import type { ForumThread, ForumReply } from '../../types';
 
 export default function IntranetModeration() {
@@ -9,6 +10,19 @@ export default function IntranetModeration() {
   const [search, setSearch] = useState('');
   const [activeTab, setActiveTab] = useState<'threads' | 'replies'>('threads');
   const [isEnabled, setIsEnabled] = useState(true);
+  const [toggling, setToggling] = useState(false);
+
+  useEffect(() => {
+    settingsApi.get().then((s) => setIsEnabled(s.forumEnabled)).catch(() => {});
+  }, []);
+
+  const handleToggle = useCallback((enabled: boolean) => {
+    setToggling(true);
+    settingsApi.update({ forumEnabled: enabled })
+      .then(() => setIsEnabled(enabled))
+      .catch(() => {})
+      .finally(() => setToggling(false));
+  }, []);
 
   const filteredThreads = useMemo(() => {
     if (!search.trim()) return threads;
@@ -53,7 +67,8 @@ export default function IntranetModeration() {
           <h1 style={{ fontFamily: 'var(--font-heading)', color: 'var(--color-red)', fontSize: '2rem', marginBottom: '0.5rem' }}>FUNCTIONALITY DISABLED</h1>
           <p style={{ color: 'var(--color-text-muted)', marginBottom: '1.5rem' }}>Forum Moderation feature is currently disabled</p>
           <button
-            onClick={() => setIsEnabled(true)}
+            onClick={() => handleToggle(true)}
+            disabled={toggling}
             style={{
               background: 'var(--color-green)',
               color: 'var(--color-bg)',
@@ -61,9 +76,10 @@ export default function IntranetModeration() {
               padding: '0.6rem 1.2rem',
               fontFamily: 'var(--font-mono)',
               fontSize: '0.85rem',
-              cursor: 'pointer',
+              cursor: toggling ? 'not-allowed' : 'pointer',
               textTransform: 'uppercase',
               letterSpacing: '0.08em',
+              opacity: toggling ? 0.6 : 1,
             }}
           >
             Re-enable
@@ -83,7 +99,8 @@ export default function IntranetModeration() {
             </p>
           </div>
           <button
-            onClick={() => setIsEnabled(false)}
+            onClick={() => handleToggle(false)}
+            disabled={toggling}
             style={{
               background: 'transparent',
               border: '1px solid var(--color-red)',
@@ -91,10 +108,11 @@ export default function IntranetModeration() {
               padding: '0.3rem 0.7rem',
               fontFamily: 'var(--font-mono)',
               fontSize: '0.65rem',
-              cursor: 'pointer',
+              cursor: toggling ? 'not-allowed' : 'pointer',
               textTransform: 'uppercase',
               letterSpacing: '0.08em',
               height: 'fit-content',
+              opacity: toggling ? 0.6 : 1,
             }}
             title="Disable this feature"
           >