resolved merge conflicts

Co-authored-by: Daniel Garan <[email protected]>
Co-authored-by: Kevin Can <[email protected]>
Co-authored-by: Anthony Herrera <[email protected]>
Co-authored-by: Rob Sinzieri <[email protected]>
Co-authored-by: Roderick de Leon <[email protected]>

Author: anthonyHerr

src-electron/electron-main.ts

@@ -18,10 +18,9 @@ function createWindow() {
     height: 600,
     useContentSize: true,
     webPreferences: {
-      // JAIME: i tried adding these two below to make window.require('fs') work
-      // nodeIntegration: true,
-      // contextIsolation: false,
+      nodeIntegration: false,
       contextIsolation: true,
+      allowRunningInsecureContent: false,
       // More info: https://v2.quasar.dev/quasar-cli-webpack/developing-electron-apps/electron-preload-script
       preload: path.resolve(__dirname, process.env.QUASAR_ELECTRON_PRELOAD),
     },
@@ -105,6 +104,15 @@ ipcMain.handle("exportProject", async (event, options) => {
   return { filePath };
 });
 
+ipcMain.handle("exportComponent", async (event, options) => {
+  const { dialog } = require("electron");
+  const { filePath } = await dialog.showSaveDialog(options);
+  if (filePath === "") {
+    throw new Error("No file path selected");
+  }
+  return { filePath };
+});
+
 ipcMain.handle('writeFile', async (event, filePath, content) => { //possibly merge this with 'writeJSON' handle
   // console.log('writeFile filePath:', filePath, '\n content:', content);
   console.log("writeFile filePath:", filePath);

src/components/composables/useExportComponent.js

@@ -1,5 +1,6 @@
 import { openHtmlElementMap } from "src/store/state/htmlElementMap";
 import { useStore } from "src/store/main";
+import { writeFile, checkFileExists, mkdirSync, pathJoin } from '../nav-buttons/ExportMenu.vue'
 export function useExportComponent() {
   // OVERVUE 8.0: export active component
   /**
@@ -32,7 +33,7 @@ export function useExportComponent() {
    */
 
   const createComponentCode = (componentLocation, componentName, children) => {
-    fs.writeFileSync(
+    writeFile(
       componentLocation + ".vue",
       // writeComments(componentName) +
       writeTemplate(componentName, children) +

src/components/nav-buttons/ExportMenu.vue

@@ -43,6 +43,7 @@ import {
 } from "../../../types";
 import { useExportComponent } from "../composables/useExportComponent";
 import { createBoilerOptions, createBoilerComposition } from "../right-sidebar/createBoilerFuncs"
+import { createBoilerOptions, createBoilerComposition } from "../right-sidebar/createBoilerFuncs"
 // import * as fs from "fs"
 // import { fs } from "electron";
 // import { path } from 'path';
@@ -85,7 +86,7 @@ const showExportProjectDialog = () => {
   .catch((err: Error) => console.log(err));
 };
 
-const writeFile = async(filePath: any, content: any) => {
+export const writeFile = async(filePath: any, content: any) => {
   if (!filePath) {
     console.error('filePath is undefined');
     return;
@@ -94,18 +95,18 @@ const writeFile = async(filePath: any, content: any) => {
     .catch((error:any) => console.error(error));
 }
 
-async function checkFileExists(path:string) {
+export async function checkFileExists(path:string) {
   const fileExistBool = await ipcRenderer.invoke('check-file-exists', path);
   return fileExistBool.status;
 };
 
-const mkdirSync = async (...args:string[]) => {
+export const mkdirSync = async (...args:string[]) => {
   await ipcRenderer.invoke('mkdirSync', [...args ])
-    .then((response: any) => console.log('mkdirSync response is', response))
+
     .catch((error:any) => console.error(error));
 }
 
-const pathJoin = (...args:string[]) => {
+export const pathJoin = (...args:string[]) => {
   if (args.some(arg => arg === undefined)) { //undefined handler for if any args are undefined
     console.error('arguments are undefined)');
     return;
@@ -252,9 +253,10 @@ const createComponentCode = async(
       await writeFile(
       componentLocation + ".vue",
       await writeTemplate(componentName, children, routes.value) +
-        await writeStyle(componentName)
+      await writeStyle(componentName)
     );
     console.log('finished write createComponent code')
+    // fs.writeFileSync()      console.log('about to write createComponent code for not App')
   } else {
       if (store.composition === false) {
         // fs.writeFileSync(
@@ -1005,7 +1007,7 @@ const createTSDeclaration = async(location: string) => {
 };
 
 const createStore = async(location: string) => {
-  let str = `import { createStore } from 'vuex';\n`;
+  let str = `import { createStore } from 'pinia';\n`;
   str += `\nconst store = createStore({`;
   str += `\n\tstate () {`;
   str += `\n\t\treturn {`;
@@ -1086,6 +1088,7 @@ const createPackage = async(location: string) => {
   str += `\n\t"dependencies": {`;
   str += `\n\t\t"vue": "^3.4.21",`;
   str += `\n\t\t"vue-router": "^4.0.12",`;
+  str += `\n\t\t"pinia": "^2.1.7"`;
   str += `\n\t\t"vuex": "^4.0.2"`;
   str += `,\n\t\t"element-plus": "^2.2.16"`;
 

src/components/right-sidebar/CodeSnippet.vue

@@ -1,4 +1,4 @@
-<!-- 
+<!--
   LOCATION IN APP:
   [right sidebar] COMPONENT DETAILS > Code Preview
 
@@ -9,7 +9,7 @@
 
 <template>
   <div class="codesnippet-container">
-    <div class="top-p-container">  
+    <div class="top-p-container">
       <div class="top-p" v-if="activeComponent !== ''">
         {{ `${activeRoute} / ${activeComponent}.vue` }}
       </div>
@@ -45,8 +45,8 @@ import {
   onMounted,
   onBeforeUnmount,
   nextTick,
-  Ref, 
-  defineEmits 
+  Ref,
+  defineEmits
 } from "vue";
 import { PrismEditor } from "vue-prism-editor";
 import { highlight, languages } from "prismjs/components/prism-core";
@@ -219,7 +219,7 @@ const writeTemplateTag = (componentName: string, activeComponent: string) => {
       </div> \n\t  </VDialog>`,
     ],
     VDrawer: [
-      `<VDrawer transition="slide-right" bg-transition="fade">      
+      `<VDrawer transition="slide-right" bg-transition="fade">
         <template #toggle="{ bind, on }">
         <button v-bind="bind" v-on="on">
           Toggle Drawer