Add ability to export a JSON file to send in an API request

stevebauman · Jan 1, 2024 · a048b2d · a048b2d
1 parent a7e7c66
commit a048b2d
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 3 deletions.
diff --git a/composables/useProjectStoreFactory.js b/composables/useProjectStoreFactory.js
@@ -1,10 +1,10 @@
 import download from 'downloadjs';
 import { v4 as uuid } from 'uuid';
-import { cloneDeep, replace } from 'lodash';
 import { defineStore } from 'pinia';
 import useIndexedDb from './useIndexedDb';
 import { namespace } from './useProjectStores';
 import useTemplateStore from './useTemplateStore';
+import { cloneDeep, replace, omit } from 'lodash';
 
 export default function (id, initialValue = null) {
     const storage = useIndexedDb(
@@ -74,6 +74,22 @@ export default function (id, initialValue = null) {
                 download(JSON.stringify(state, null, 2), `${name}.json`);
             },
 
+            /**
+             * Export the project into a JSON file for an API request.
+             */
+            exportForApi() {
+                const state = this.clone();
+
+                const json = {
+                    settings: omit(state.settings, ['image']),
+                    editors: state.page.editors,
+                };
+
+                const name = state.tab.name || 'json';
+
+                download(JSON.stringify(json, null, 2), `${name}.json`);
+            },
+
             /**
              * Save the project as a template.
              */

diff --git a/pages/index.vue b/pages/index.vue
@@ -228,14 +228,19 @@ export default {
                 {
                     separator: true,
                 },
+                {
+                    name: 'export-json',
+                    title: 'Export JSON (API Request)',
+                    click: () => currentProject.value?.exportForApi(),
+                },
                 {
                     name: 'export-config',
-                    title: 'Export Configuration',
+                    title: 'Export JSON Configuration',
                     click: () => currentProject.value?.export(),
                 },
                 {
                     name: 'import-config',
-                    title: 'Import Configuration',
+                    title: 'Import JSON Configuration',
                     click: importNewProject,
                 },
                 {