@shellui/core 0.2.0 → 0.3.0-beta.1

package/src/features/legal/LegalDocumentView.tsx

@@ -0,0 +1,42 @@
+import { Link, useLocation } from 'react-router';
+import { useConfig } from '../config/useConfig';
+import { getLegalDocuments } from './legalDocuments';
+import { LegalDocumentContent } from './LegalDocumentContent';
+import urls from '../../constants/urls';
+
+export const LegalDocumentView = () => {
+  const { config } = useConfig();
+  const location = useLocation();
+  const legalDocuments = getLegalDocuments(config);
+  const selectedDocument = legalDocuments.find((item) => item.path === location.pathname);
+
+  if (!selectedDocument) {
+    return (
+      <main className="mx-auto w-full max-w-4xl p-6">
+        <h1
+          className="text-2xl font-semibold"
+          style={{ fontFamily: 'var(--heading-font-family, inherit)' }}
+        >
+          Legal documents
+        </h1>
+        <p className="mt-2 text-sm text-muted-foreground">
+          No legal document is configured for this page.
+        </p>
+      </main>
+    );
+  }
+
+  return (
+    <main className="mx-auto w-full max-w-4xl p-6">
+      <div className="mb-4">
+        <Link
+          to={urls.login}
+          className="text-sm text-primary hover:underline"
+        >
+          Back to login
+        </Link>
+      </div>
+      <LegalDocumentContent document={selectedDocument} />
+    </main>
+  );
+};

package/src/features/legal/LegalDocumentsIndexView.tsx

@@ -0,0 +1,51 @@
+import { Link } from 'react-router';
+import urls from '../../constants/urls';
+import { useConfig } from '../config/useConfig';
+import { getLegalDocuments } from './legalDocuments';
+
+export const LegalDocumentsIndexView = () => {
+  const { config } = useConfig();
+  const legalDocuments = getLegalDocuments(config);
+
+  return (
+    <main className="mx-auto w-full max-w-4xl p-6">
+      <div className="space-y-2">
+        <h1
+          className="text-2xl font-semibold tracking-tight"
+          style={{ fontFamily: 'var(--heading-font-family, inherit)' }}
+        >
+          Legal documents
+        </h1>
+        <p className="text-sm text-muted-foreground">Select a document to view its full content.</p>
+      </div>
+
+      {legalDocuments.length === 0 ? (
+        <p className="mt-6 text-sm text-muted-foreground">
+          No legal document is currently configured.
+        </p>
+      ) : (
+        <ul className="mt-6 space-y-2">
+          {legalDocuments.map((document) => (
+            <li key={document.path}>
+              <Link
+                to={document.path}
+                className="text-sm font-medium text-primary underline-offset-4 hover:underline"
+              >
+                {document.title}
+              </Link>
+            </li>
+          ))}
+        </ul>
+      )}
+
+      <div className="mt-8">
+        <Link
+          to={urls.login}
+          className="text-sm text-primary hover:underline"
+        >
+          Back to login
+        </Link>
+      </div>
+    </main>
+  );
+};

package/src/features/legal/LegalDocumentsLinks.tsx

@@ -0,0 +1,29 @@
+import { Link } from 'react-router';
+import { useConfig } from '../config/useConfig';
+import { getLegalDocuments } from './legalDocuments';
+
+export const LegalDocumentsLinks = () => {
+  const { config } = useConfig();
+  const legalDocuments = getLegalDocuments(config);
+
+  if (legalDocuments.length === 0) {
+    return null;
+  }
+
+  return (
+    <nav
+      aria-label="Legal links"
+      className="flex flex-wrap gap-x-4 gap-y-2 text-xs text-muted-foreground"
+    >
+      {legalDocuments.map((document) => (
+        <Link
+          key={document.path}
+          to={document.path}
+          className="hover:text-foreground hover:underline"
+        >
+          {document.title}
+        </Link>
+      ))}
+    </nav>
+  );
+};

package/src/features/legal/legalDocuments.ts

@@ -0,0 +1,62 @@
+import type { ShellUIConfig } from '../config/types';
+import urls from '../../constants/urls';
+
+export type LegalDocumentKey =
+  | 'privacyPolicy'
+  | 'termsOfService'
+  | 'legalNotice'
+  | 'dataProcessingAgreement';
+
+export type LegalDocumentDescriptor = {
+  key: LegalDocumentKey;
+  title: string;
+  path: string;
+  filename: string;
+  content: string;
+};
+
+type LegalDocumentDefinition = Omit<LegalDocumentDescriptor, 'content'>;
+
+const LEGAL_DOCUMENT_DEFINITIONS: LegalDocumentDefinition[] = [
+  {
+    key: 'privacyPolicy',
+    title: 'Privacy Policy',
+    path: urls.legalPrivacyPolicy,
+    filename: 'privacy-policy.md',
+  },
+  {
+    key: 'termsOfService',
+    title: 'Terms of Service',
+    path: urls.legalTermsOfService,
+    filename: 'terms-of-service.md',
+  },
+  {
+    key: 'legalNotice',
+    title: 'Legal Notice',
+    path: urls.legalNotice,
+    filename: 'legal-notice.md',
+  },
+  {
+    key: 'dataProcessingAgreement',
+    title: 'Data Processing Agreement',
+    path: urls.legalDataProcessingAgreement,
+    filename: 'data-processing-agreement.md',
+  },
+];
+
+export const getLegalDocuments = (config: ShellUIConfig): LegalDocumentDescriptor[] => {
+  const legalConfig = config.legalDocuments;
+  if (!legalConfig) return [];
+  const documents: LegalDocumentDescriptor[] = [];
+  for (const definition of LEGAL_DOCUMENT_DEFINITIONS) {
+    const content = legalConfig[definition.key];
+    if (typeof content !== 'string') continue;
+    const trimmedContent = content.trim();
+    if (!trimmedContent) continue;
+    documents.push({
+      ...definition,
+      content: trimmedContent,
+    });
+  }
+  return documents;
+};

package/src/features/settings/SettingsIcons.tsx

@@ -450,3 +450,23 @@ export const PackageIcon = () => (
     <path d="M12 22V12" />
   </svg>
 );
+
+export const FileTextIcon = () => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="16"
+    height="16"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    strokeWidth="2"
+    strokeLinecap="round"
+    strokeLinejoin="round"
+  >
+    <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
+    <path d="M14 2v6h6" />
+    <path d="M16 13H8" />
+    <path d="M16 17H8" />
+    <path d="M10 9H8" />
+  </svg>
+);