Merge pull request #59 from ssciwr/json-pregens

Use JSON in pregen

package.json

@@ -25,6 +25,7 @@
     "postcss": "^8.4.47",
     "postcss-load-config": "^5.0.2",
     "rollup": "^4.21.2",
+    "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-css-only": "^4.5.2",
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-svelte": "^7.2.2",

rollup.config.js

@@ -1,7 +1,7 @@
+import copy from 'rollup-plugin-copy';
 import svelte from 'rollup-plugin-svelte';
 import resolve from '@rollup/plugin-node-resolve';
 import commonjs from '@rollup/plugin-commonjs';
-import replace from '@rollup/plugin-replace';
 import terser from '@rollup/plugin-terser';
 import postcss from 'rollup-plugin-postcss';
 import { sveltePreprocess } from 'svelte-preprocess';
@@ -15,6 +15,14 @@ export default {
     inlineDynamicImports: true
   },
   plugins: [
+    copy({
+      targets: [
+        {
+          src: 'public/pregen/*',
+          dest: 'bundle/pregen'
+        }
+      ]
+    }),
     svelte({
       emitCss: false,
       preprocess: sveltePreprocess({

src/components/logic/DetailControls.svelte

@@ -53,8 +53,6 @@
   }
 
   $: displayedButtons = calculate($systemidStore);
-
-  console.log(displayedButtons);
 </script>
 
 {#if displayedButtons.length > 0}

src/generate.js

@@ -2,13 +2,6 @@ import { writeFile } from 'fs/promises';
 import { accessInstance } from './lib/easydbData.js';
 import { Command, Flags } from '@oclif/core';
 
-// This "trick" is super-unfortunate, but Svelte Preprocessing is fully regex-based
-// and any attempts to pass stringified data that contains backslashes will result in
-// a particularly bad instance of Regex hell. We therefore resort to doing this in
-// the serialization and ondoing it in the deserialization as part of the injected code.
-function escape(str) {
-  return str.replaceAll("\\\"", "__ESCAPED_QUOTES__").replaceAll("\\", "__BACKSLASH__");
-}
 
 function useMask(name, include_mask, exclude_mask) {
   if (include_mask) {
@@ -56,15 +49,10 @@ export class PrefetchCommand extends Command {
 
     data.masks = filterMasks(data.masks, flags.include_mask, flags.exclude_mask);
 
-    // Inject the data into the Svelte component as a constant
-    const content =
-      `export const pregen_instance = '${instance}';\n` +
-      `export const pregen_masks = JSON.parse('${escape(JSON.stringify(data.masks))}'.replaceAll("__ESCAPED_QUOTES__", "\\\\\\"").replaceAll("__BACKSLASH__", "\\\\"));\n` +
-      `export const pregen_l10n = JSON.parse('${escape(JSON.stringify(data.l10n))}'.replaceAll("__ESCAPED_QUOTES__", "\\\\\\"").replaceAll("__BACKSLASH__", "\\\\"));\n` +
-      `export const pregen_schemas = JSON.parse('${escape(JSON.stringify(data.schemas))}'.replaceAll("__ESCAPED_QUOTES__", "\\\\\\"").replaceAll("__BACKSLASH__", "\\\\"));\n`;
+    await writeFile('src/lib/easydbPregen.js', `export const pregen_instance = "${instance}";`);
 
     try {
-      await writeFile('src/lib/easydbPregen.js', content);
+      await writeFile('public/pregen/data.json', JSON.stringify(data));
       console.log('Successfully regenerated the EasyDB data.');
     } catch (error) {
       console.error('Error writing the EasyDB data:', error);

src/lib/easydbPregen.js

@@ -1,4 +1 @@
-export const pregen_instance = null;
-export const pregen_masks = null;
-export const pregen_l10n = null;
-export const pregen_schemas = null;
+export const pregen_instance = null;

src/lib/stores.js

@@ -1,6 +1,6 @@
 import { derived, get, writable } from "svelte/store";
 import { accessInstance } from "./easydbData";
-import { pregen_instance, pregen_l10n, pregen_masks, pregen_schemas } from "./easydbPregen";
+import { pregen_instance } from "./easydbPregen";
 
 // A derived store that resolves a promise
 function derivedPromise(store) {
@@ -13,12 +13,8 @@ function derivedPromise(store) {
 
 // Our pregenerated defaults wrapped in a Promise
 async function pregenDefaults() {
-  return {
-    instance: pregen_instance,
-    masks: pregen_masks,
-    schemas: pregen_schemas,
-    l10n: pregen_l10n,
-  };
+  const response = await fetch(`/pregen/data.json`);
+  return response.json();
 }
 
 // This manages the global state of the current app language

vite.config.ts

@@ -3,6 +3,5 @@ import { svelte } from '@sveltejs/vite-plugin-svelte'
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [svelte()],
-  base: '/svelte-easydb-detail-view/'
+  plugins: [svelte()]
 })