diff --git a/src/assets/svgs/swagger.svg b/src/assets/svgs/swagger.svg
new file mode 100644
index 0000000..b82236f
--- /dev/null
+++ b/src/assets/svgs/swagger.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/Apps/AppsDevMode.tsx b/src/components/Apps/AppsDevMode.tsx
index 0514ce3..f3079f7 100644
--- a/src/components/Apps/AppsDevMode.tsx
+++ b/src/components/Apps/AppsDevMode.tsx
@@ -332,7 +332,7 @@ export const AppsDevMode = ({ mode, setMode, show , myName, goToHome, setDesktop
isSelected={tab?.tabId === selectedTab?.tabId}
app={tab}
ref={iframeRefs.current[tab.tabId]}
- isDevMode={true}
+ isDevMode={tab?.service ? false : true}
/>
);
})}
diff --git a/src/components/Apps/AppsDevModeHome.tsx b/src/components/Apps/AppsDevModeHome.tsx
index db1bab2..d9def9b 100644
--- a/src/components/Apps/AppsDevModeHome.tsx
+++ b/src/components/Apps/AppsDevModeHome.tsx
@@ -7,7 +7,7 @@ import {
AppsContainer,
AppsParent,
} from "./Apps-styles";
-import {Buffer} from 'buffer'
+import { Buffer } from "buffer";
import {
Avatar,
@@ -29,249 +29,239 @@ import { Spacer } from "../../common/Spacer";
import { useModal } from "../../common/useModal";
import { createEndpoint, isUsingLocal } from "../../background";
import { Label } from "../Group/AddGroup";
+import ShortUniqueId from "short-unique-id";
+import swaggerSVG from '../../assets/svgs/swagger.svg'
+const uid = new ShortUniqueId({ length: 8 });
export const AppsDevModeHome = ({
setMode,
myApp,
myWebsite,
availableQapps,
- myName
+ myName,
}) => {
+ const [domain, setDomain] = useState("127.0.0.1");
+ const [port, setPort] = useState("");
+ const [selectedPreviewFile, setSelectedPreviewFile] = useState(null);
- const [domain, setDomain] = useState("127.0.0.1");
- const [port, setPort] = useState("");
- const [selectedPreviewFile, setSelectedPreviewFile] = useState(null);
+ const { isShow, onCancel, onOk, show, message } = useModal();
+ const {
+ openSnackGlobal,
+ setOpenSnackGlobal,
+ infoSnackCustom,
+ setInfoSnackCustom,
+ } = useContext(MyContext);
- const { isShow, onCancel, onOk, show, message } = useModal();
- const {
- openSnackGlobal,
- setOpenSnackGlobal,
- infoSnackCustom,
- setInfoSnackCustom,
- } = useContext(MyContext);
+ const handleSelectFile = async (existingFilePath) => {
+ const filePath = existingFilePath || (await window.electron.selectFile());
+ if (filePath) {
+ const content = await window.electron.readFile(filePath);
+ return { buffer: content, filePath };
+ } else {
+ console.log("No file selected.");
+ }
+ };
+ const handleSelectDirectry = async (existingDirectoryPath) => {
+ const { buffer, directoryPath } =
+ await window.electron.selectAndZipDirectory(existingDirectoryPath);
+ if (buffer) {
+ return { buffer, directoryPath };
+ } else {
+ console.log("No file selected.");
+ }
+ };
- const handleSelectFile = async (existingFilePath) => {
- const filePath = existingFilePath || await window.electron.selectFile();
- if (filePath) {
-
- const content = await window.electron.readFile(filePath);
- return {buffer: content, filePath}
- } else {
- console.log('No file selected.');
- }
- };
- const handleSelectDirectry = async (existingDirectoryPath) => {
- const {buffer, directoryPath} = await window.electron.selectAndZipDirectory(existingDirectoryPath);
- if (buffer) {
-
-
- return {buffer, directoryPath}
- } else {
- console.log('No file selected.');
- }
- };
+ const addDevModeApp = async () => {
+ try {
+ const usingLocal = await isUsingLocal();
+ if (!usingLocal) {
+ setOpenSnackGlobal(true);
- const addDevModeApp = async () => {
- try {
- const usingLocal = await isUsingLocal();
- if (!usingLocal) {
- setOpenSnackGlobal(true);
-
- setInfoSnackCustom({
- type: "error",
- message:
- "Please use your local node for dev mode! Logout and use Local node.",
- });
- return;
- }
- const {portVal, domainVal} = await show({
- message: "",
- publishFee: "",
+ setInfoSnackCustom({
+ type: "error",
+ message:
+ "Please use your local node for dev mode! Logout and use Local node.",
});
- const framework = domainVal + ":" + portVal;
- const response = await fetch(
- `${getBaseApiReact()}/developer/proxy/start`,
- {
- method: "POST",
- headers: {
- "Content-Type": "text/plain",
- },
- body: framework,
- }
- );
- const responseData = await response.text();
- executeEvent("appsDevModeAddTab", {
- data: {
- url: "http://127.0.0.1:" + responseData,
+ return;
+ }
+ const { portVal, domainVal } = await show({
+ message: "",
+ publishFee: "",
+ });
+ const framework = domainVal + ":" + portVal;
+ const response = await fetch(
+ `${getBaseApiReact()}/developer/proxy/start`,
+ {
+ method: "POST",
+ headers: {
+ "Content-Type": "text/plain",
},
+ body: framework,
+ }
+ );
+ const responseData = await response.text();
+ executeEvent("appsDevModeAddTab", {
+ data: {
+ url: "http://127.0.0.1:" + responseData,
+ },
+ });
+ } catch (error) {}
+ };
+
+ const addPreviewApp = async (isRefresh, existingFilePath, tabId) => {
+ try {
+ const usingLocal = await isUsingLocal();
+ if (!usingLocal) {
+ setOpenSnackGlobal(true);
+
+ setInfoSnackCustom({
+ type: "error",
+ message:
+ "Please use your local node for dev mode! Logout and use Local node.",
});
- } catch (error) {}
- };
+ return;
+ }
+ if (!myName) {
+ setOpenSnackGlobal(true);
- const addPreviewApp = async (isRefresh, existingFilePath, tabId) => {
- try {
- const usingLocal = await isUsingLocal();
- if (!usingLocal) {
- setOpenSnackGlobal(true);
+ setInfoSnackCustom({
+ type: "error",
+ message: "You need a name to use preview",
+ });
+ return;
+ }
- setInfoSnackCustom({
- type: "error",
- message:
- "Please use your local node for dev mode! Logout and use Local node.",
- });
- return;
- }
- if (!myName) {
- setOpenSnackGlobal(true);
+ const { buffer, filePath } = await handleSelectFile(existingFilePath);
- setInfoSnackCustom({
- type: "error",
- message:
- "You need a name to use preview",
- });
- return;
- }
+ if (!buffer) {
+ setOpenSnackGlobal(true);
-
- const {buffer, filePath} = await handleSelectFile(existingFilePath)
-
- if (!buffer) {
- setOpenSnackGlobal(true);
+ setInfoSnackCustom({
+ type: "error",
+ message: "Please select a file",
+ });
+ return;
+ }
+ const postBody = Buffer.from(buffer).toString("base64");
- setInfoSnackCustom({
- type: "error",
- message:
- "Please select a file",
- });
- return;
- }
- const postBody = Buffer.from(buffer).toString('base64')
-
- const endpoint = await createEndpoint(`/arbitrary/APP/${myName}/zip?preview=true`)
- const response = await fetch(
- endpoint
- ,
- {
- method: "POST",
- headers: {
- "Content-Type": "text/plain",
- },
- body: postBody,
- }
- );
- if(!response?.ok) throw new Error('Invalid zip')
- const previewPath = await response.text();
- if(tabId){
+ const endpoint = await createEndpoint(
+ `/arbitrary/APP/${myName}/zip?preview=true`
+ );
+ const response = await fetch(endpoint, {
+ method: "POST",
+ headers: {
+ "Content-Type": "text/plain",
+ },
+ body: postBody,
+ });
+ if (!response?.ok) throw new Error("Invalid zip");
+ const previewPath = await response.text();
+ if (tabId) {
executeEvent("appsDevModeUpdateTab", {
data: {
- url: "http://127.0.0.1:12391" + previewPath,
+ url: "http://127.0.0.1:12391" + previewPath,
isPreview: true,
filePath,
- refreshFunc: (tabId)=> {
- addPreviewApp(true, filePath, tabId)
+ refreshFunc: (tabId) => {
+ addPreviewApp(true, filePath, tabId);
},
- tabId
+ tabId,
},
});
- return
+ return;
}
- executeEvent("appsDevModeAddTab", {
- data: {
- url: "http://127.0.0.1:12391" + previewPath,
- isPreview: true,
- filePath,
- refreshFunc: (tabId)=> {
- addPreviewApp(true, filePath, tabId)
- }
+ executeEvent("appsDevModeAddTab", {
+ data: {
+ url: "http://127.0.0.1:12391" + previewPath,
+ isPreview: true,
+ filePath,
+ refreshFunc: (tabId) => {
+ addPreviewApp(true, filePath, tabId);
},
+ },
+ });
+ } catch (error) {
+ console.error(error);
+ }
+ };
+
+ const addPreviewAppWithDirectory = async (isRefresh, existingDir, tabId) => {
+ try {
+ const usingLocal = await isUsingLocal();
+ if (!usingLocal) {
+ setOpenSnackGlobal(true);
+
+ setInfoSnackCustom({
+ type: "error",
+ message:
+ "Please use your local node for dev mode! Logout and use Local node.",
});
- } catch (error) {
- console.error(error)
+ return;
}
- };
+ if (!myName) {
+ setOpenSnackGlobal(true);
- const addPreviewAppWithDirectory = async (isRefresh, existingDir, tabId) => {
- try {
- const usingLocal = await isUsingLocal();
- if (!usingLocal) {
- setOpenSnackGlobal(true);
+ setInfoSnackCustom({
+ type: "error",
+ message: "You need a name to use preview",
+ });
+ return;
+ }
- setInfoSnackCustom({
- type: "error",
- message:
- "Please use your local node for dev mode! Logout and use Local node.",
- });
- return;
- }
- if (!myName) {
- setOpenSnackGlobal(true);
+ const { buffer, directoryPath } = await handleSelectDirectry(existingDir);
- setInfoSnackCustom({
- type: "error",
- message:
- "You need a name to use preview",
- });
- return;
- }
+ if (!buffer) {
+ setOpenSnackGlobal(true);
-
- const {buffer, directoryPath} = await handleSelectDirectry(existingDir)
-
- if (!buffer) {
- setOpenSnackGlobal(true);
+ setInfoSnackCustom({
+ type: "error",
+ message: "Please select a file",
+ });
+ return;
+ }
+ const postBody = Buffer.from(buffer).toString("base64");
- setInfoSnackCustom({
- type: "error",
- message:
- "Please select a file",
- });
- return;
- }
- const postBody = Buffer.from(buffer).toString('base64')
-
- const endpoint = await createEndpoint(`/arbitrary/APP/${myName}/zip?preview=true`)
- const response = await fetch(
- endpoint
- ,
- {
- method: "POST",
- headers: {
- "Content-Type": "text/plain",
- },
- body: postBody,
- }
- );
- if(!response?.ok) throw new Error('Invalid zip')
- const previewPath = await response.text();
- if(tabId){
+ const endpoint = await createEndpoint(
+ `/arbitrary/APP/${myName}/zip?preview=true`
+ );
+ const response = await fetch(endpoint, {
+ method: "POST",
+ headers: {
+ "Content-Type": "text/plain",
+ },
+ body: postBody,
+ });
+ if (!response?.ok) throw new Error("Invalid zip");
+ const previewPath = await response.text();
+ if (tabId) {
executeEvent("appsDevModeUpdateTab", {
data: {
- url: "http://127.0.0.1:12391" + previewPath,
+ url: "http://127.0.0.1:12391" + previewPath,
isPreview: true,
directoryPath,
- refreshFunc: (tabId)=> {
- addPreviewAppWithDirectory(true, directoryPath, tabId)
+ refreshFunc: (tabId) => {
+ addPreviewAppWithDirectory(true, directoryPath, tabId);
},
- tabId
+ tabId,
},
});
- return
+ return;
}
- executeEvent("appsDevModeAddTab", {
- data: {
- url: "http://127.0.0.1:12391" + previewPath,
- isPreview: true,
- directoryPath,
- refreshFunc: (tabId)=> {
- addPreviewAppWithDirectory(true, directoryPath, tabId)
- }
+ executeEvent("appsDevModeAddTab", {
+ data: {
+ url: "http://127.0.0.1:12391" + previewPath,
+ isPreview: true,
+ directoryPath,
+ refreshFunc: (tabId) => {
+ addPreviewAppWithDirectory(true, directoryPath, tabId);
},
- });
- } catch (error) {
- console.error(error)
- }
- };
-
+ },
+ });
+ } catch (error) {
+ console.error(error);
+ }
+ };
+
return (
<>
Directory
+ {
+ executeEvent("appsDevModeAddTab", {
+ data: {
+ service: "APP",
+ name: "Q-Sandbox",
+ tabId: uid.rnd(),
+ },
+ });
+ }}
+ >
+
+
+
+
+
+
+ Q-Sandbox
+
+
+ {
+ executeEvent("appsDevModeAddTab", {
+ data: {
+ url: "http://127.0.0.1:12391",
+ isPreview: false,
+ customIcon: swaggerSVG
+ },
+ });
+ }}
+ >
+
+
+
+
+
+
+ API
+
+
{isShow && (
-
-
+
)}
>
);
diff --git a/src/components/Apps/AppsDevModeTabComponent.tsx b/src/components/Apps/AppsDevModeTabComponent.tsx
index eee87e2..46372a5 100644
--- a/src/components/Apps/AppsDevModeTabComponent.tsx
+++ b/src/components/Apps/AppsDevModeTabComponent.tsx
@@ -1,59 +1,67 @@
-import React from 'react'
-import { TabParent } from './Apps-styles'
+import React from "react";
+import { TabParent } from "./Apps-styles";
import NavCloseTab from "../../assets/svgs/NavCloseTab.svg";
-import { getBaseApiReact } from '../../App';
-import { Avatar, ButtonBase } from '@mui/material';
+import { getBaseApiReact } from "../../App";
+import { Avatar, ButtonBase } from "@mui/material";
import LogoSelected from "../../assets/svgs/LogoSelected.svg";
-import { executeEvent } from '../../utils/events';
+import { executeEvent } from "../../utils/events";
-export const AppsDevModeTabComponent = ({isSelected, app}) => {
+export const AppsDevModeTabComponent = ({ isSelected, app }) => {
return (
- {
- if(isSelected){
- executeEvent('removeTabDevMode', {
- data: app
- })
- return
- }
- executeEvent('setSelectedTabDevMode', {
+ {
+ if (isSelected) {
+ executeEvent("removeTabDevMode", {
data: app,
- isDevMode: true
- })
- }}>
-
+ });
+ return;
+ }
+ executeEvent("setSelectedTabDevMode", {
+ data: app,
+ isDevMode: true,
+ });
+ }}
+ >
+
{isSelected && (
-
-
-
- ) }
-
-
-
-
+
+ )}
+
+
+
+
- )
-}
-
+ );
+};