Add some info and attribution

frontend/src/components/SettingsModal.tsx

@@ -16,6 +16,7 @@ import { SettingsMqttSection } from './settings/SettingsMqttSection';
 import { SettingsDatabaseSection } from './settings/SettingsDatabaseSection';
 import { SettingsBotSection } from './settings/SettingsBotSection';
 import { SettingsStatisticsSection } from './settings/SettingsStatisticsSection';
+import { SettingsAboutSection } from './settings/SettingsAboutSection';
 
 interface SettingsModalBaseProps {
   open: boolean;
@@ -77,6 +78,7 @@ export function SettingsModal(props: SettingsModalProps) {
       database: false,
       bot: false,
       statistics: false,
+      about: false,
     };
   });
 
@@ -267,6 +269,13 @@ export function SettingsModal(props: SettingsModalProps) {
           )}
         </div>
       )}
+
+      {shouldRenderSection('about') && (
+        <div className={sectionWrapperClass}>
+          {renderSectionHeader('about')}
+          {isSectionVisible('about') && <SettingsAboutSection className={sectionContentClass} />}
+        </div>
+      )}
     </div>
   );
 }

frontend/src/components/settings/SettingsAboutSection.tsx

@@ -0,0 +1,108 @@
+import { Separator } from '../ui/separator';
+
+const GITHUB_URL = 'https://github.com/jkingsman/Remote-Terminal-for-MeshCore';
+
+export function SettingsAboutSection({ className }: { className?: string }) {
+  const version = __APP_VERSION__;
+  const commit = __COMMIT_HASH__;
+
+  return (
+    <div className={className}>
+      <div className="space-y-6">
+        {/* Version */}
+        <div className="text-center space-y-1">
+          <h3 className="text-lg font-semibold">RemoteTerm for MeshCore</h3>
+          <div className="text-sm text-muted-foreground">
+            v{version}
+            <span className="mx-1.5">·</span>
+            <span className="font-mono text-xs">{commit}</span>
+          </div>
+        </div>
+
+        <Separator />
+
+        {/* Author & License */}
+        <div className="text-sm text-center space-y-2">
+          <p>
+            Made with love and open source by{' '}
+            <a
+              href="https://jacksbrain.com"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-primary hover:underline"
+            >
+              Jack Kingsman
+            </a>
+          </p>
+          <p>
+            Licensed under the{' '}
+            <a
+              href={`${GITHUB_URL}/blob/main/LICENSE.md`}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-primary hover:underline"
+            >
+              MIT License
+            </a>
+          </p>
+        </div>
+
+        <Separator />
+
+        {/* Links */}
+        <div className="flex justify-center gap-4 text-sm">
+          <a
+            href={GITHUB_URL}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-primary hover:underline"
+          >
+            GitHub
+          </a>
+          <a
+            href={`${GITHUB_URL}/issues`}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-primary hover:underline"
+          >
+            Report a Bug
+          </a>
+          <a
+            href={`${GITHUB_URL}/blob/main/CHANGELOG.md`}
+            target="_blank"
+            rel="noopener noreferrer"
+            className="text-primary hover:underline"
+          >
+            Changelog
+          </a>
+        </div>
+
+        <Separator />
+
+        {/* Acknowledgements */}
+        <div className="text-sm text-center text-muted-foreground space-y-2">
+          <p>With great appreciation to those who have made the tools upon which this is built:</p>
+          <p>
+            <a
+              href="https://github.com/meshcore-dev/MeshCore"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-primary hover:underline"
+            >
+              MeshCore
+            </a>
+            <span className="mx-1.5">·</span>
+            <a
+              href="https://github.com/meshcore-dev/meshcore_py"
+              target="_blank"
+              rel="noopener noreferrer"
+              className="text-primary hover:underline"
+            >
+              meshcore_py
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

frontend/src/components/settings/settingsConstants.ts

@@ -5,7 +5,8 @@ export type SettingsSection =
   | 'mqtt'
   | 'database'
   | 'bot'
-  | 'statistics';
+  | 'statistics'
+  | 'about';
 
 export const SETTINGS_SECTION_ORDER: SettingsSection[] = [
   'radio',
@@ -15,6 +16,7 @@ export const SETTINGS_SECTION_ORDER: SettingsSection[] = [
   'database',
   'bot',
   'statistics',
+  'about',
 ];
 
 export const SETTINGS_SECTION_LABELS: Record<SettingsSection, string> = {
@@ -25,4 +27,5 @@ export const SETTINGS_SECTION_LABELS: Record<SettingsSection, string> = {
   database: '🗄️ Database & Interface',
   bot: '🤖 Bot',
   statistics: '📊 Statistics',
+  about: 'About',
 };

frontend/src/types/globals.d.ts

@@ -0,0 +1,2 @@
+declare const __APP_VERSION__: string;
+declare const __COMMIT_HASH__: string;