Convert generated config objects to TS (#959)

* Move config.js to cached assets

* Typed config imports

* Fix lint error

* Fix .gitignore for html books

TODO: move as much as possible from static into gen-assets

* Resolve CR feedback and lint/build errors

* Fix missing config during initial conversion run

* Convert firebase config to TS

* Convert contents config to TS

Author: FyreByrd

.gitignore

@@ -17,10 +17,8 @@ static/illustrations
 static/icons
 static/manifest*.json
 static/assets
+static/collections
 static/contents
 src/lib/data/catalog.js
-src/lib/data/firebase-config.js
-src/lib/data/config.js
-src/lib/data/contents.js
 src/gen-assets
 vite.config.js.timestamp*

.prettierignore

@@ -7,7 +7,7 @@ node_modules
 .env.*
 !.env.example
 /data
-src/lib/data/config.js
+src/gen-assets
 src/lib/data/catalog.js
 src/lib/data/firebase-config.js
 static

config/index.d.ts

@@ -62,8 +62,8 @@ export type BookConfig = {
     file: string;
     hashedFileName?: string; // currently just for HTML books
     audio: BookCollectionAudioConfig[];
-    features: any;
-    quizFeatures?: Record<string, string | boolean | number>;
+    features: FeatureConfig;
+    quizFeatures?: FeatureConfig;
     footer?: HTML;
     style?: StyleConfig;
     styles?: {
@@ -157,13 +157,17 @@ export type MenuItemConfig = {
         file: string;
     }[];
 };
+
+export type FeatureValue = string | boolean | number;
+export type FeatureConfig = Record<string, FeatureValue>;
+
 export type AppConfig = {
     name?: string;
     package?: string;
     version?: string;
-    programVersion?: string;
-    programType?: string;
-    mainFeatures?: any;
+    programVersion: string;
+    programType: string;
+    mainFeatures: FeatureConfig;
     audio?: AudioConfig;
     fonts?: {
         name?: string;
@@ -379,3 +383,50 @@ export type Quiz = {
     }[];
     passScore?: number; //\pm
 };
+
+export type LangContainer = { [lang: string]: string };
+
+export type LinkMeta = {
+    // intended to pass between functions so that there is one object passed
+    linkType?: string;
+    linkTarget?: string;
+    linkLocation?: string;
+};
+
+export type ContentItem = {
+    id: number;
+    heading?: boolean;
+    features?: any;
+    title: LangContainer;
+    subtitle?: LangContainer;
+    audioFilename?: LangContainer;
+    imageFilename?: string;
+    itemType?: string;
+    contentItemContainer: boolean;
+    linkType?: string;
+    linkTarget?: string;
+    linkLocation?: string;
+    layoutMode?: string;
+    layoutCollection?: string[];
+    children?: ContentItem[];
+};
+
+export type ContentScreen = {
+    id: number;
+    title?: {
+        [lang: string]: string;
+    };
+    items?: {
+        id: number;
+    }[];
+};
+
+export type ContentsData = {
+    title?: {
+        [lang: string]: string;
+    };
+    features?: any;
+    items?: ContentItem[];
+    nestedItems?: boolean;
+    screens?: ContentScreen[];
+};

convert/convertConfig.ts

@@ -1,4 +1,4 @@
-import { existsSync, readdirSync, readFileSync, type PathLike } from 'fs';
+import { existsSync, mkdirSync, readdirSync, readFileSync, type PathLike } from 'fs';
 import path, { basename, extname, join } from 'path';
 import type {
     AppConfig,
@@ -219,6 +219,10 @@ function isDictionaryConfig(data: ScriptureConfig | DictionaryConfig): data is D
 }
 
 function convertConfig(dataDir: string, verbose: number) {
+    const genAssets = path.join('src/gen-assets');
+    if (!existsSync(genAssets)) {
+        mkdirSync(genAssets, { recursive: true });
+    }
     const dom = new jsdom.JSDOM(readFileSync(path.join(dataDir, 'appdef.xml')).toString(), {
         contentType: 'text/xml'
     });
@@ -1613,7 +1617,7 @@ export interface ConfigTaskOutput extends TaskOutput {
 
 /**
  * Converts appdef.xml into a config object which is passed to other conversion functions
- * and is also written to src/config.js.
+ * and is also written to src/gen-assets/config.ts.
  */
 export class ConvertConfig extends Task {
     public triggerFiles: string[] = ['appdef.xml'];
@@ -1624,8 +1628,14 @@ export class ConvertConfig extends Task {
             data,
             files: [
                 {
-                    path: 'src/lib/data/config.js',
-                    content: `export default ${JSON.stringify(data, null, 2)};`
+                    path: 'src/gen-assets/config.ts',
+                    content: [
+                        `import type { AppConfig, DictionaryConfig, ScriptureConfig } from '$config';`,
+                        `export const config = ${JSON.stringify(data, null, 2)} as Readonly<AppConfig>;`,
+                        `export const dictionaryConfig = config as Readonly<DictionaryConfig>;`,
+                        `export const scriptureConfig = config as Readonly<ScriptureConfig>;`,
+                        `export default config;\n`
+                    ].join('\n')
                 }
             ]
         };

convert/convertContents.ts

@@ -1,60 +1,11 @@
 import { existsSync, readFileSync } from 'fs';
 import path from 'path';
-import { ScriptureConfig } from '$config';
+import { ContentItem, ContentsData, LangContainer, LinkMeta, ScriptureConfig } from '$config';
 import jsdom from 'jsdom';
 import { ConfigTaskOutput, parseLangAttribute } from './convertConfig';
 import { createHashedFile, createOutputDir, deleteOutputDir, joinUrlPath } from './fileUtils';
 import { Task, TaskOutput } from './Task';
 
-export type LangContainer = { [lang: string]: string };
-
-export type LinkMeta = {
-    // intended to pass between functions so that there is one object passed
-    linkType?: string;
-    linkTarget?: string;
-    linkLocation?: string;
-};
-
-type ContentItem = {
-    id: number;
-    heading?: boolean;
-    features?: any;
-    title: LangContainer;
-    subtitle?: LangContainer;
-    audioFilename?: LangContainer;
-    imageFilename?: string;
-    itemType?: string;
-    contentItemContainer: boolean;
-    linkType?: string;
-    linkTarget?: string;
-    linkLocation?: string;
-    layoutMode?: string;
-    layoutCollection?: string[];
-    children?: ContentItem[];
-};
-
-type ContentScreen = {
-    id: number;
-    title?: {
-        [lang: string]: string;
-    };
-    items?: {
-        id: number;
-    }[];
-};
-
-export type ContentsData = {
-    title?: {
-        [lang: string]: string;
-    };
-    features?: any;
-    items?: ContentItem[];
-    nestedItems?: boolean;
-    screens?: ContentScreen[];
-};
-
-const data: ContentsData = {};
-
 export interface ContentsTaskOutput extends TaskOutput {
     taskName: 'ConvertContents';
 }
@@ -367,6 +318,8 @@ export function convertContents(
         deleteOutputDir(destDir);
     }
 
+    const data: ContentsData = {};
+
     const contentsFile = path.join(dataDir, 'contents.xml');
     if (!existsSync(contentsFile)) {
         return data;
@@ -602,8 +555,12 @@ export class ConvertContents extends Task {
             data,
             files: [
                 {
-                    path: 'src/lib/data/contents.js',
-                    content: `export default ${JSON.stringify(data, null, 2)}`
+                    path: 'src/gen-assets/contents.ts',
+                    content: [
+                        `import type { ContentsData } from '$config';`,
+                        `export const contents = ${JSON.stringify(data, null, 2)} as Readonly<ContentsData>;`,
+                        `export default contents;\n`
+                    ].join('\n')
                 }
             ]
         };

convert/convertFirebase.ts

@@ -11,16 +11,17 @@ export interface FirebaseTaskOutput extends TaskOutput {
 export function convertFirebase(dataDir: string, verbose: number) {
     const srcFile = path.join(dataDir, 'firebase-config.js');
     const srcExists = existsSync(srcFile);
-    const dstFile = path.join('src', 'lib', 'data', 'firebase-config.js');
+    const dstFile = path.join('src', 'gen-assets', 'firebase-config.ts');
     if (verbose) {
         console.log(`FirebaseConfig: path=${srcFile}, exists=${srcExists}`);
     }
+    const prefix = `import type { FirebaseOptions } from 'firebase/app';\nexport const firebaseConfig: Readonly<FirebaseOptions> | null`;
     if (srcExists) {
         let content = readFileSync(srcFile, 'utf-8');
-        content = content.replace('const firebaseConfig', 'export const firebaseConfig');
+        content = content.replace('const firebaseConfig', prefix);
         writeFileSync(dstFile, content, 'utf-8');
     } else {
-        const firebaseConfig = 'export const firebaseConfig = null;';
+        const firebaseConfig = `${prefix} = null`;
         writeFileSync(dstFile, firebaseConfig);
     }
 }

convert/index.ts

@@ -1,4 +1,4 @@
-import { writeFile } from 'fs';
+import { writeFile } from 'fs/promises';
 import path from 'path';
 import { watch } from 'chokidar';
 import { ConvertAbout } from './convertAbout';
@@ -87,14 +87,7 @@ async function fullConvert(printDetails: boolean): Promise<boolean> {
             // step may be async, in which case it should be awaited
             const out = await step.run(verbose, outputs, step.triggerFiles);
             outputs.set(step.constructor.name, out);
-            await Promise.all(
-                out.files.map(
-                    (f) =>
-                        new Promise((r) => {
-                            writeFile(f.path, f.content, r);
-                        })
-                )
-            );
+            await Promise.all(out.files.map((f) => writeFile(f.path, f.content)));
         } catch (e) {
             oldConsoleLog(lastStepOutput);
             oldConsoleLog(e);
@@ -157,11 +150,7 @@ if (process.argv.includes('--watch')) {
                                 outputs.set(step.constructor.name, out);
                                 // Write all files to disk
                                 /*await*/ // We don't need to await the file writes; next steps can continue running while writes occur
-                                Promise.all(
-                                    out.files.map((f) => {
-                                        new Promise((r) => writeFile(f.path, f.content, r));
-                                    })
-                                );
+                                Promise.all(out.files.map((f) => writeFile(f.path, f.content)));
                             } catch (e) {
                                 oldConsoleLog(lastStepOutput);
                                 oldConsoleLog(e);

convert/tests/dab/convertConfigDAB.test.ts

@@ -1,6 +1,6 @@
 import { readFileSync } from 'fs';
 import path from 'path';
-import type { DictionaryConfig, DictionaryWritingSystemConfig } from '$config';
+import type { DictionaryWritingSystemConfig } from '$config';
 import jsdom from 'jsdom';
 import { expect, test } from 'vitest';
 import { parseDictionaryWritingSystem, parseFeatures } from '../../convertConfig';

eslint.config.js

@@ -73,7 +73,6 @@ export default ts.config(
             '.env.*',
             '!env.example',
             'data',
-            'src/config.js',
             'static',
             'example_data',
             'test_data',

package.json

@@ -17,7 +17,7 @@
         "convert": "ts-node convert/index.ts",
         "convert:watch": "ts-node convert/index.ts --watch",
         "sandbox": "ts-node data-sandbox/index.ts",
-        "clean": "rimraf .svelte-kit build src/gen-assets src/lib/data/config.js src/lib/data/catalog.js src/lib/data/firebase-config.js src/lib/data/contents.js static/illustrations static/icons static/contents static/manifest*.json && echo 🔔 Reminder: The project cannot be built until the conversion scripts are run again.",
+        "clean": "rimraf .svelte-kit build src/gen-assets src/lib/data/catalog.js static/illustrations static/icons static/collections static/contents static/manifest*.json && echo 🔔 Reminder: The project cannot be built until the conversion scripts are run again.",
         "clean:data": "rimraf --glob data/*",
         "clean:all": "npm run clean && npm run clean:data",
         "test": "vitest",