Build application

.github/workflows/release-matrix.yml

@@ -24,7 +24,9 @@ jobs:
           check-latest: true
 
       - name: Install Node modules
-        run: npm install
+        run: |
+          npm install
+          cd gui/react && npm install
 
       - name: Get name and version from package.json
         run: |

.gitignore

@@ -25,4 +25,5 @@ archive.json
 fonts
 .webpack/
 out/
-dist/
+dist/
+build/

gui/electron/src/index.ts

@@ -1,11 +1,15 @@
 import { app, BrowserWindow } from 'electron';
+import path from 'path/posix';
 import json from '../../../package.json';
 import registerMessageHandler from './messageHandler';
+import fs from "fs";
 
 if (require('electron-squirrel-startup')) {
   app.quit();
 }
 
+console.log(process.argv, process.env);
+
 const createWindow = (): void => {
   registerMessageHandler();
   // Create the browser window.
@@ -15,11 +19,17 @@ const createWindow = (): void => {
     title: json.name,
     webPreferences: {
       nodeIntegration: true,
-      preload: 'preload.js'
+      preload: path.join(__dirname, 'preload.js')
     },
   });
 
-  mainWindow.loadURL('http://localhost:3000');
+  const htmlFile = path.join(__dirname, '..', 'build', 'index.html');
+
+  if (fs.existsSync(htmlFile)) {
+    mainWindow.loadFile(htmlFile);
+  } else {
+    mainWindow.loadURL('http://localhost:3000');
+  }
 
   mainWindow.webContents.openDevTools();
 };

gui/react/src/App.tsx

@@ -1,16 +1,21 @@
 import React from 'react';
-import { Button } from '@mui/material';
+import { Button, TextField, Box } from '@mui/material';
 import { messageChannelContext } from './provider/MessageChannel';
 
 function App() {
   const channel = React.useContext(messageChannelContext);
 
+  const [data, setData] = React.useState<{username: string|undefined, password: string|undefined}>({ username: undefined, password: undefined });
   return (
-    <Button variant='contained' size='large' onClick={async () => {
+    <Box>
-      console.log(await channel?.auth({ username: 'thekonrat@gmail.com', password: 'Ol5@2OAf2qDp05kXqiW#' }));
+      <TextField variant='outlined'  value={data.username ?? ''} onChange={(e) => setData({ password: data.password, username: e.target.value })} />
-    }}>
+      <TextField variant='outlined'  value={data.password ?? ''} onChange={(e) => setData({ password: e.target.value, username: data.username })} />
-      Test auth
+      <Button variant='contained' size='large' onClick={async () => {
-    </Button>
+        console.log(await channel?.auth({ username: data.username ?? '', password: data.password ?? ''}));
+      }}>
+        Test auth
+      </Button>
+    </Box>
   );
 }
 

package.json

@@ -14,7 +14,7 @@
     "utility",
     "cli"
   ],
-  "author": "AniDL/Izu-co",
+  "author": "Izu-co",
   "homepage": "https://github.com/anidl/multi-downloader-nx",
   "repository": {
     "type": "git",
@@ -24,7 +24,7 @@
     "url": "https://github.com/anidl/multi-downloader-nx/issues"
   },
   "license": "MIT",
-  "main": "lib/gui/electron/src/index.js",
+  "main": "gui/electron/src/index.js",
   "dependencies": {
     "cheerio": "^1.0.0-rc.10",
     "electron-squirrel-startup": "^1.0.0",
@@ -69,7 +69,7 @@
   },
   "scripts": {
     "prestart": "npm run tsc",
-    "start": "electron-forge start",
+    "start": "cd lib && electron-forge start",
     "docs": "ts-node modules/build-docs.ts",
     "tsc": "ts-node tsc.ts",
     "prebuild-win64": "npm run tsc",

tsc.ts

@@ -1,68 +1,83 @@
-import { exec } from 'child_process';
+import { ChildProcess, exec } from 'child_process';
 import fs from 'fs';
 import path from 'path';
 import { removeSync, copyFileSync } from 'fs-extra';
 
 const ignore = [
-  '.git',
+  '*SEP\\.git*',
-  'lib',
+  '*SEPlib*',
-  'node_modules',
+  '*SEPnode_modules*',
-  '@types',
+  '*SEP@types*',
-  path.join('gui', 'react', 'node_modules'),
+  '*SEPout*',
-  path.join('bin', 'mkvtoolnix'),
+  '*SEPbinSEPmkvtoolnix*',
-  path.join('config', 'token.yml'),
+  '*SEPtoken.yml$',
-  path.join('config', 'updates.json'),
+  '*SEPupdates.json$',
-  path.join('config', 'cr_token.yml'),
+  '*SEPcr_token.yml$',
-  path.join('config', 'funi_token.yml'),
+  '*SEPfuni_token.yml$',
-  '.eslint',
+  '*SEP\\.eslint*',
-].map(a => path.join(__dirname, a));
+  '*SEP*\\.tsx?$',
+  'SEP*fonts',
+  'SEPreact*',
+].map(a => a.replace(/\*/g, '[^]*').replace(/SEP/g, path.sep === '\\' ? '\\\\' : '/')).map(a => new RegExp(a, 'i'));
 
 export { ignore };
 
 (async () => {
+
+  const waitForProcess = async (proc: ChildProcess) => {
+    return new Promise((resolve, reject) => {
+      proc.stdout?.on('data', console.log);
+      proc.stderr?.on('data', console.error);
+      proc.on('close', resolve);
+      proc.on('error', reject);
+    })
+  }
+
   process.stdout.write('Removing lib dir... ');
   removeSync('lib');
   process.stdout.write('✓\nRunning tsc... ');
   const tsc = exec('npx tsc');
-  tsc.stdout?.on('data', console.log);
-  tsc.stderr?.on('data', console.log);
 
-  tsc.on('close', () => {
+  await waitForProcess(tsc);
-    process.stdout.write('✓\nCopying files... ');
+
-    const files = readDir(__dirname);
+  process.stdout.write('✓\nBuilding react... ');
-    const filtered = files.filter(a => {
+  const react = exec('npm run build', {
-      if (a.stats.isFile()) {
+    cwd: path.join(__dirname, 'gui', 'react'),
-        return a.path.split('.').pop() !== 'ts';
-      } else {
-        return true;
-      }
-    });
-    filtered.forEach(item => {
-      const itemPath = path.join(__dirname, 'lib', item.path.replace(__dirname, ''));
-      if (item.stats.isDirectory()) {
-        if (!fs.existsSync(itemPath))
-          fs.mkdirSync(itemPath);
-      } else {
-        copyFileSync(item.path, itemPath);
-      }
-    });
-    process.stdout.write('✓\n');
   });
+
+  await waitForProcess(react);
+
+  copyDir(path.join(__dirname, 'gui', 'react', 'build'), path.join(__dirname, 'lib', 'gui', 'electron', 'build'));
+
+  process.stdout.write('✓\nCopying files... ');
+  const files = readDir(__dirname);
+  files.forEach(item => {
+    const itemPath = path.join(__dirname, 'lib', item.path.replace(__dirname, ''));
+    if (item.stats.isDirectory()) {
+      if (!fs.existsSync(itemPath))
+        fs.mkdirSync(itemPath);
+    } else {
+      copyFileSync(item.path, itemPath);
+    }
+  });
+  process.stdout.write('✓\n');
 })();
 
-const readDir = (dir: string) : {
+function readDir (dir: string): {
   path: string,
   stats: fs.Stats
-}[] => {
+}[] {
   const items: {
     path: string,
     stats: fs.Stats
   }[] = [];
   const content = fs.readdirSync(dir);
-  for (const item of content) {
+  itemLoop: for (const item of content) {
     const itemPath = path.join(dir, item);
-    if (ignore.some(a => itemPath.startsWith(a)))
+    for (const ignoreItem of ignore) {
-      continue;
+      if (ignoreItem.test(itemPath))
+        continue itemLoop;      
+    }
     const stats = fs.statSync(itemPath);
     items.push({
       path: itemPath,
@@ -73,4 +88,18 @@ const readDir = (dir: string) : {
     }
   }
   return items;
-};
+};
+
+async function copyDir(src: string, dest: string) {
+  await fs.promises.mkdir(dest, { recursive: true });
+  let entries = await fs.promises.readdir(src, { withFileTypes: true });
+
+  for (let entry of entries) {
+      let srcPath = path.join(src, entry.name);
+      let destPath = path.join(dest, entry.name);
+
+      entry.isDirectory() ?
+          await copyDir(srcPath, destPath) :
+          await fs.promises.copyFile(srcPath, destPath);
+  }
+}

tsconfig.json

@@ -14,6 +14,7 @@
   "exclude": [
     "./videos",
     "./tsc.ts",
-    "lib/**/*"
+    "lib/**/*",
+    "gui/react/**/*"
   ]
 }