Merge pull request #13 from oslabs-beta/rachExportCSSWrapUp

rachelk585 · web-flow · commit 29c124a0ded3 · 2023-05-01T10:26:24.000-07:00
CSS Storage &amp; Export Button Finished
diff --git a/app/src/components/main/DemoRender.tsx b/app/src/components/main/DemoRender.tsx
@@ -28,6 +28,10 @@ const DemoRender = (): JSX.Element => {
   const html = `
     <html>
       <head>
+      <link
+      rel="stylesheet"
+      href="./fake.css"
+    />
       </head>
       <body>
         <div id="app">
diff --git a/app/src/components/main/fake.css b/app/src/components/main/fake.css
@@ -0,0 +1,13 @@
+.test {
+  color: red !important
+}
+.MuiBox-root {
+  color: red
+}
+css-0 {
+  color: red
+}
+
+#rend1 {
+  color: red !important
+}
diff --git a/app/src/components/right/ExportButton.tsx b/app/src/components/right/ExportButton.tsx
@@ -15,10 +15,8 @@ export default function ExportButton() {
   const state = useSelector((store: RootState) => store.appState);
 
   const genOptions: string[] = [
-    'Export components',
-    'Export components with application files'
+    'Export components'
   ];
-  let genOption = 0;
 
   // Closes out the open modal
   const closeModal = () => setModal('');
@@ -29,7 +27,7 @@ export default function ExportButton() {
         {genOptions.map((option: string, i: number) => (
           <ListItem
             key={i}
-            onClick={() => chooseGenOptions(i)}
+            onClick={() => chooseGenOptions()}
             style={{
               border: '1px solid #3f51b5',
               marginBottom: '2%',
@@ -39,32 +37,19 @@ export default function ExportButton() {
             <ListItemText primary={option} style={{ textAlign: 'center' }} />
           </ListItem>
         ))}
-        <ListItem>
-          <input type="checkbox" id="tests" name="tests"></input>
-          <label for="tests">Include Tests</label>
-        </ListItem>
       </List>
     );
-    let testchecked = 0;
-    // helper function called by showGenerateAppModal
-    // this function will prompt the user to choose an app directory once they've chosen their export option
-    const chooseGenOptions = (genOpt: number) => {
-      // set export option: 0 --> export only components, 1 --> export full project
-      genOption = genOpt;
-
-      //This is exclusive to the electron app
-      // window.api.chooseAppDir();
-      // testchecked = document.getElementById('tests').checked;
+
+    const chooseGenOptions = () => {
       zipFiles(state);
-     
       closeModal();
     };
 
     setModal(
       createModal({
         closeModal,
         children,
-        message: 'Choose export preference:',
+        message: 'Click to download in zip file:',
         primBtnLabel: null,
         primBtnAction: null,
         secBtnAction: null,
@@ -100,17 +85,10 @@ export default function ExportButton() {
   );
 }
 
-//The below code is exclusive to the Electron App's export function
-
-// import React, { useState, useCallback, useEffect } from 'react';
-// import List from '@mui/material/List';
-// import ListItem from '@mui/material/ListItem';
-// import ListItemText from '@mui/material/ListItemText';
-// import GetAppIcon from '@mui/icons-material/GetApp';
-// import Button from '@mui/material/Button';
-// import exportProject from '../../utils/exportProject.util';
-// import createModal from './createModal';
-// import { useSelector } from 'react-redux';
+//The below code is exclusive to ReacType's Electron App
+//If you would like to deploy the app, please comment out the exportButton function above and uncomment the code below
+
+
 // export default function ExportButton() {
 //   const [modal, setModal] = useState(null);
 //   const state = useSelector(store => store.appState)
