imrovements

.changeset/curly-comics-begin.md

@@ -0,0 +1,7 @@
+---
+'@pipelab/app': patch
+---
+
+feat(electron): support url preview
+feat(app): add dialog prompt
+feat(app): improve ui

.changeset/serious-rice-act.md

@@ -2,5 +2,5 @@
 '@pipelab/app': patch
 ---
 
-add live logs hooks support
-fix steam permission, general improvements & logged out detection
+fix(app): add live logs hooks support
+fix(plugin-steam): fix steam permission, general improvements & logged out detection

assets/electron/template/app/package.json

@@ -13,7 +13,6 @@
     "lint": "echo \"No linting configured\""
   },
   "devDependencies": {
-    "@pipelab/core": "1.2.3",
     "@electron-forge/cli": "7.4.0",
     "@electron-forge/maker-deb": "7.4.0",
     "@electron-forge/maker-dmg": "^7.4.0",
@@ -23,6 +22,7 @@
     "@electron-forge/plugin-auto-unpack-natives": "7.4.0",
     "@electron-forge/plugin-fuses": "7.4.0",
     "@electron/fuses": "1.8.0",
+    "@pipelab/core": "1.2.3",
     "electron": "32.1.2"
   },
   "keywords": [],
@@ -37,6 +37,7 @@
     "electron-serve": "^2.1.1",
     "electron-squirrel-startup": "1.0.1",
     "execa": "^9.4.0",
+    "mri": "1.2.0",
     "serve-handler": "^6.1.5",
     "ws": "^8.18.0"
   }

assets/electron/template/app/src/index.js

@@ -6,6 +6,7 @@ import serve from 'serve-handler'
 import { createServer } from 'http'
 import { WebSocketServer } from 'ws';
 import './custom-main.js'
+import mri from 'mri';
 
 // user
 import userFolder from './handlers/user/folder.js'
@@ -52,12 +53,22 @@ function assertUnreachable(x) {
   throw new Error("Didn't expect to get here");
 }
 
-<% if (config.enableInProcessGPU) { %>
-  app.commandLine.appendSwitch('in-process-gpu')
-  <% } %>
+console.log('process.argv', process.argv)
+const argv = process.argv
+const cliArgs = mri(argv, {
+  alias: {
+    u: 'url'
+  },
+});
+
+  //region commandLine Flags
+  <% if (config.enableInProcessGPU) { %>
+    app.commandLine.appendSwitch('in-process-gpu')
+    <% } %>
 <% if (config.enableDisableRendererBackgrounding) { %>
   app.commandLine.appendSwitch('disable-renderer-backgrounding')
   <% } %>
+//endregion
 
 /**
  * @param {BrowserWindow} mainWindow
@@ -197,11 +208,17 @@ const createWindow = async () => {
     }
   })
 
-  const port = await createAppServer(mainWindow)
+  const argUrl = cliArgs.url
+  if (argUrl) {
+    console.log('argUrl', argUrl)
+    await mainWindow.loadURL(argUrl)
+  } else {
+    const port = await createAppServer(mainWindow)
 
-  console.log('port', port)
+    console.log('port', port)
 
-  await mainWindow.loadURL(`http://localhost:${port}`)
+    await mainWindow.loadURL(`http://localhost:${port}`)
+  }
 }
 
 const registerHandlers = async () => {

components.d.ts

@@ -7,12 +7,14 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
+    Avatar: typeof import('primevue/avatar')['default']
     Button: typeof import('primevue/button')['default']
     Checkbox: typeof import('primevue/checkbox')['default']
     Chip: typeof import('primevue/chip')['default']
     Dialog: typeof import('primevue/dialog')['default']
     Divider: typeof import('primevue/divider')['default']
     Drawer: typeof import('primevue/drawer')['default']
+    Fieldset: typeof import('primevue/fieldset')['default']
     IconField: typeof import('primevue/iconfield')['default']
     Inplace: typeof import('primevue/inplace')['default']
     InputIcon: typeof import('primevue/inputicon')['default']

index.html

@@ -26,12 +26,6 @@
     href="https://fonts.gstatic.com"
     crossorigin
   >
-  <!-- <link href="https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],200..800&display=swap" rel="stylesheet"> -->
-  <!-- <link href="https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:wght@100&display=swap" rel="stylesheet"> -->
-  <link
-    href="https://api.fontshare.com/v2/css?f[]=geist@100,200,300,400,500,600,700,800,900&display=swap"
-    rel="stylesheet"
-  >
   <style>
     html,
     body,

src/constants.ts

@@ -1,3 +1,5 @@
+import { platform } from 'process'
+
 export const name = 'Pipelab'
 
 export const outFolderName = (binName: string, platform: NodeJS.Platform, arch: NodeJS.Architecture) => {
@@ -28,3 +30,13 @@ export const outFolderName = (binName: string, platform: NodeJS.Platform, arch:
 
   return `${binName}-${platformName}-${archName}`
 }
+
+export const getBinName = (name: string) => {
+  if (platform === 'win32') {
+    return `${name}.exe`
+  }
+  if (platform === 'darwin') {
+    return `${name}.app/Contents/MacOS/${name}`
+  }
+  return name
+}

src/main/api.ts

@@ -17,6 +17,11 @@ export type IpcDefinition = {
     { message: string; buttons?: { title: string; value: string }[] },
     EndEvent<{ answer: string }>
   ]
+  'dialog:prompt': [
+    // input
+    { message: string; buttons?: { title: string; value: string }[] },
+    EndEvent<{ answer: string }>
+  ]
   'log:message': [
     // input
     ILogObjMeta,

src/renderer/components/ScenarioListItem.vue

@@ -6,7 +6,7 @@
           <PluginIcon width="40px" :icon="icon"></PluginIcon>
         </div>
       </div>
-      <Button text v-if="!noDeleteBtn" severity="danger" @click.stop="onDelete" rounded>
+      <Button v-if="!noDeleteBtn" text severity="danger" rounded @click.stop="onDelete">
         <template #icon>
           <i class="mdi mdi-delete"></i>
         </template>