feat(settings): add open source license notices

.gitignore

@@ -30,6 +30,8 @@ dist-electron/
 .electron-runtime/
 .showcase/
 apps/mobile/.showcase/
+apps/mobile/.generated/
+/.generated/
 artifacts/app-store/screenshots/
 .github/pr-assets/
 native/**/target/

apps/mobile/metro.config.js

@@ -1,12 +1,20 @@
 const fs = require("node:fs");
 const path = require("node:path");
+const { pathToFileURL } = require("node:url");
 const { getDefaultConfig } = require("expo/metro-config");
 const { withUniwindConfig } = require("uniwind/metro");
 const extraThemes = require("./generated-uniwind-theme-names.json");
 
 /** @type {import("expo/metro-config").MetroConfig} */
 const config = getDefaultConfig(__dirname);
 const workspaceRoot = path.resolve(__dirname, "../..");
+const generatedLicenseModuleRoot = path.join(__dirname, ".generated", "third-party-licenses");
+const licenseGeneratorSource = path.join(
+  workspaceRoot,
+  "scripts",
+  "lib",
+  "third-party-licenses.ts",
+);
 const escapedWorkspaceRoot = workspaceRoot.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 const mobileShikiRoot = path.dirname(require.resolve("shiki/package.json", { paths: [__dirname] }));
 const resolveShikiDependencyRoot = (packageName) => {
@@ -37,6 +45,7 @@ config.resolver = {
   ],
   extraNodeModules: {
     ...config.resolver?.extraNodeModules,
+    "@t3tools/mobile-third-party-licenses": generatedLicenseModuleRoot,
     shiki: mobileShikiRoot,
     "@shikijs/core": resolveShikiDependencyRoot("@shikijs/core"),
     "@shikijs/engine-javascript": resolveShikiDependencyRoot("@shikijs/engine-javascript"),
@@ -48,8 +57,46 @@ config.resolver = {
   },
 };
 
-module.exports = withUniwindConfig(config, {
-  cssEntryFile: "./global.css",
-  extraThemes,
-  polyfills: { rem: 14 },
-});
+async function writeFileIfChanged(filePath, contents) {
+  try {
+    if ((await fs.promises.readFile(filePath, "utf8")) === contents) return;
+  } catch (error) {
+    if (error?.code !== "ENOENT") throw error;
+  }
+  await fs.promises.writeFile(filePath, contents, "utf8");
+}
+
+async function generateMobileThirdPartyLicenses() {
+  await fs.promises.mkdir(generatedLicenseModuleRoot, { recursive: true });
+  const generatorVersion = (await fs.promises.stat(licenseGeneratorSource)).mtimeMs;
+  const { generateThirdPartyLicenseManifest } = await import(
+    `${pathToFileURL(licenseGeneratorSource).href}?version=${String(generatorVersion)}`
+  );
+  const manifest = await generateThirdPartyLicenseManifest({
+    configFile: path.join(workspaceRoot, "third-party-licenses.config.json"),
+    packageManifests: [{ bundle: "mobile", path: path.join(__dirname, "package.json") }],
+    allowMissingGeneratedNotices:
+      process.env.NODE_ENV !== "production" &&
+      process.env.EAS_BUILD !== "true" &&
+      process.env.T3CODE_LICENSES_STRICT !== "1",
+  });
+
+  await Promise.all([
+    writeFileIfChanged(
+      path.join(generatedLicenseModuleRoot, "index.js"),
+      `module.exports = ${JSON.stringify(manifest)};\n`,
+    ),
+    writeFileIfChanged(
+      path.join(generatedLicenseModuleRoot, "package.json"),
+      '{"main":"index.js"}\n',
+    ),
+  ]);
+}
+
+module.exports = generateMobileThirdPartyLicenses().then(() =>
+  withUniwindConfig(config, {
+    cssEntryFile: "./global.css",
+    extraThemes,
+    polyfills: { rem: 14 },
+  }),
+);

apps/mobile/modules/t3-markdown-text/scripts/sync-pierre-file-icons.mjs

@@ -79,11 +79,7 @@ const colors = {
 
 const customIcons = {
   agents: "t3-file-icon-agents",
-  claude: "t3-file-icon-claude",
-  package: "t3-file-icon-package-json",
   pnpm: "t3-file-icon-pnpm",
-  readme: "t3-file-icon-readme",
-  tsconfig: "t3-file-icon-tsconfig",
   video: "t3-file-icon-video",
 };
 

apps/mobile/modules/t3-markdown-text/src/markdownFileIcons.generated.ts

@@ -30,13 +30,11 @@ export const MARKDOWN_FILE_ICON_SOURCES = {
   nextjs: require("../assets/file-icons/pierre_nextjs.png"),
   npm: require("../assets/file-icons/pierre_npm.png"),
   oxc: require("../assets/file-icons/pierre_oxc.png"),
-  package: require("../assets/file-icons/pierre_package.png"),
   pnpm: require("../assets/file-icons/pierre_pnpm.png"),
   postcss: require("../assets/file-icons/pierre_postcss.png"),
   prettier: require("../assets/file-icons/pierre_prettier.png"),
   python: require("../assets/file-icons/pierre_python.png"),
   react: require("../assets/file-icons/pierre_react.png"),
-  readme: require("../assets/file-icons/pierre_readme.png"),
   ruby: require("../assets/file-icons/pierre_ruby.png"),
   rust: require("../assets/file-icons/pierre_rust.png"),
   sass: require("../assets/file-icons/pierre_sass.png"),
@@ -49,7 +47,6 @@ export const MARKDOWN_FILE_ICON_SOURCES = {
   tailwind: require("../assets/file-icons/pierre_tailwind.png"),
   terraform: require("../assets/file-icons/pierre_terraform.png"),
   text: require("../assets/file-icons/pierre_text.png"),
-  tsconfig: require("../assets/file-icons/pierre_tsconfig.png"),
   typescript: require("../assets/file-icons/pierre_typescript.png"),
   video: require("../assets/file-icons/pierre_video.png"),
   vite: require("../assets/file-icons/pierre_vite.png"),

apps/mobile/modules/t3-markdown-text/src/markdownLinks.ts

@@ -116,7 +116,7 @@ const FILE_ICON_BY_NAME: Readonly<Record<string, MarkdownFileIcon>> = {
   "next.config.mjs": "nextjs",
   "next.config.mts": "nextjs",
   "next.config.ts": "nextjs",
-  "package.json": "package",
+  "package.json": "npm",
   "pnpm-lock.yaml": "pnpm",
   "pnpm-workspace.yaml": "pnpm",
   "postcss.config.js": "postcss",
@@ -127,7 +127,7 @@ const FILE_ICON_BY_NAME: Readonly<Record<string, MarkdownFileIcon>> = {
   "prettier.config.cjs": "prettier",
   "prettier.config.mjs": "prettier",
   rakefile: "ruby",
-  "readme.md": "readme",
+  "readme.md": "markdown",
   "stylelint.config.js": "stylelint",
   "stylelint.config.cjs": "stylelint",
   "stylelint.config.mjs": "stylelint",
@@ -139,7 +139,7 @@ const FILE_ICON_BY_NAME: Readonly<Record<string, MarkdownFileIcon>> = {
   "tailwind.config.cjs": "tailwind",
   "tailwind.config.mjs": "tailwind",
   "tailwind.config.ts": "tailwind",
-  "tsconfig.json": "tsconfig",
+  "tsconfig.json": "typescript",
   "vite.config.js": "vite",
   "vite.config.mjs": "vite",
   "vite.config.mts": "vite",
@@ -253,7 +253,7 @@ export function resolveMarkdownFileIcon(value: string): MarkdownFileIcon {
   const exactIcon = FILE_ICON_BY_NAME[basename];
   if (exactIcon) return exactIcon;
   if (basename.startsWith("tsconfig.") && basename.endsWith(".json")) {
-    return "tsconfig";
+    return "typescript";
   }
   const segments = basename.split(".");
   for (let index = 1; index < segments.length; index += 1) {

apps/mobile/src/Stack.tsx

@@ -55,6 +55,10 @@ import { SettingsClientStorageRouteScreen } from "./features/settings/SettingsCl
 import { SettingsAuthRouteScreen } from "./features/settings/SettingsAuthRouteScreen";
 import { SettingsEnvironmentsRouteScreen } from "./features/settings/SettingsEnvironmentsRouteScreen";
 import { SettingsLegalRouteScreen } from "./features/settings/SettingsLegalRouteScreen";
+import {
+  SettingsOpenSourceLicenseRouteScreen,
+  SettingsOpenSourceLicensesRouteScreen,
+} from "./features/settings/SettingsOpenSourceLicensesRouteScreen";
 import { SettingsProjectGroupingRouteScreen } from "./features/settings/SettingsProjectGroupingRouteScreen";
 import { UsageLimitAccountScreen } from "./features/usage/UsageLimitsPooled";
 import { UsageRouteScreen } from "./features/usage/UsageRouteScreen";
@@ -197,6 +201,20 @@ const SettingsContentStack = createNativeStackNavigator({
       screen: UsageLimitAccountScreen,
       options: { title: "Account" },
     }),
+    SettingsOpenSourceLicenses: createNativeStackScreen({
+      screen: SettingsOpenSourceLicensesRouteScreen,
+      linking: "open-source-licenses",
+      options: {
+        title: "Open source licenses",
+      },
+    }),
+    SettingsOpenSourceLicense: createNativeStackScreen({
+      screen: SettingsOpenSourceLicenseRouteScreen,
+      linking: "open-source-licenses/:entryKey",
+      options: {
+        title: "License notice",
+      },
+    }),
     SettingsUsage: createNativeStackScreen({
       screen: UsageRouteScreen,
       linking: "usage",