diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 1dc7153..6ee98ca 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -13,7 +13,6 @@ module.exports = { parserOptions: { ecmaVersion: 'latest', sourceType: 'module', - project: true, tsconfigRootDir: __dirname, }, plugins: ['react-refresh'], diff --git a/README.md b/README.md index cb7977e..44e6801 100644 --- a/README.md +++ b/README.md @@ -19,4 +19,6 @@ electron/index.ts # CI builds? -Builds will be set up using a jetbrains teamcity instance when migration to new server is done. ETA still not known. Packaged binaries are built on my host computer for now. If you're skeptical, build the app for yourself. +CI builds are a WIP. We have working Linux and Windows CircleCI workflows in place, but build artifacts are still not implemented. +The project is in a very early stage and currently I build binaries on my host computer. +I know this is annoying, but you should build yourself the app (which you can do by following the last question) \ No newline at end of file diff --git a/electron/index.ts b/electron/index.ts index df6dc96..d2bcb38 100644 --- a/electron/index.ts +++ b/electron/index.ts @@ -1,8 +1,10 @@ import path from 'node:path' import { app, BrowserWindow, dialog, ipcMain } from 'electron'; import isDev from 'electron-is-dev'; -import colorette from 'colorette'; -import { exec } from 'node:child_process'; +import * as colorette from 'colorette'; +import * as fs from 'node:fs' +import * as os from 'node:os' +import { exec, spawn } from 'node:child_process'; function createWindow() { const mainWindow = new BrowserWindow({ @@ -46,10 +48,11 @@ function createWindow() { }); ipcMain.on('submitForm', async (event, data) => { + const fileName = createRandomFileName('txt') // Process the submitted data here - console.log(`${colorette.green('✓')} Received sern init submit form data:`); - console.log(data) - console.log(`${colorette.cyan('🛈')} Current OS: ${currentOS}`); + writeLineToLogAndConsole(`${colorette.green('✓')} Received sern init submit form data:`, fileName); + writeLineToLogAndConsole(JSON.stringify(data), fileName) + writeLineToLogAndConsole(`${colorette.cyan('🛈')} Current OS: ${currentOS}`, fileName); let packageManagerCommand: string switch (data.chosenPackageManager) { @@ -83,22 +86,28 @@ function createWindow() { break; } - console.log(`${colorette.cyan('🛈')} About to execute command: ${commandToRun}`); + writeLineToLogAndConsole(`${colorette.cyan('🛈')} About to execute command: ${commandToRun}`, fileName); const cmd = exec(commandToRun) cmd.stdout!.on('data', (data) => { - console.log(`${colorette.cyan('🛈')} ${data}`); + writeLineToLogAndConsole(`${colorette.cyan('🛈')} ${data}`, fileName); }); cmd.stderr!.on('data', (data) => { - console.error(`${colorette.red('×')} stderr: ${data}`); + writeLineToLogAndConsole(`${colorette.red('×')} stderr: ${data}`, fileName); }); cmd.on('close', (code) => { - console.log(`${colorette.cyan('🛈')} Command exited with status code ${code}. Now notifying frontend...`); - event.reply('submitForm') + writeLineToLogAndConsole(`${colorette.cyan('🛈')} Command exited with status code ${code}. Now notifying frontend...`, fileName); + event.reply('submitForm', { exitCode: code, logFileName: fileName }) }); }); + + ipcMain.on('openTxtFile', (event, args) => { + console.log('heya', args) + openTempTextFile(args) + event.reply('openTxtFile') + }) } app.whenReady().then(createWindow); @@ -149,4 +158,39 @@ const asciiart = ` .:-=-:. .:=*#################*=-. :=+#########+=: ` -console.log(asciiart) \ No newline at end of file +console.log(asciiart) + +// from now on will be functions that are used in the above code + +function createRandomFileName(extension: string) { + return `sern-gui-${randomstring(8)}.${extension}` +} + +function writeLineToLogAndConsole(text: string, logfilename: string) { + console.log(text) + fs.appendFileSync(`${os.tmpdir()}/${logfilename}`, `\n${text}`, { encoding: 'utf-8' }) +} + +function openTempTextFile(filename: string) { + const completeFilename = `${os.tmpdir()}/${filename}` + switch (currentOS) { + case 'macOS': + return spawn('open', [completeFilename]) + case 'windows': + return spawn('notepad', [completeFilename]) + case 'linux': + return spawn('xdg-open', [completeFilename]) + } +} + +function randomstring(length: number) { + let result = ''; + const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'; + const charactersLength = characters.length; + let counter = 0; + while (counter < length) { + result += characters.charAt(Math.floor(Math.random() * charactersLength)); + counter += 1; + } + return result; +} \ No newline at end of file diff --git a/src/Footer.tsx b/src/Footer.tsx index eff717e..3659a51 100644 --- a/src/Footer.tsx +++ b/src/Footer.tsx @@ -8,34 +8,33 @@ import './Footer.css' export default function Footer() { return ( -
- - - - - front page - - - - • - - - - - github - - - - • - - - - - discord - - - +
+ + + + + front page + + -
+ • + + + + + github + + + + • + + + + + discord + + + +
); } diff --git a/src/InitModal.tsx b/src/InitModal.tsx index cafca14..24721c2 100644 --- a/src/InitModal.tsx +++ b/src/InitModal.tsx @@ -12,6 +12,10 @@ import Checkbox from '@mui/material/Checkbox'; import FormGroup from '@mui/material/FormGroup'; import FormControlLabel from '@mui/material/FormControlLabel'; import type { IpcRendererEvent } from 'electron' +import Snackbar from '@mui/material/Snackbar'; +import Alert from '@mui/material/Alert'; +import IconButton from '@mui/material/IconButton'; +import CloseIcon from '@mui/icons-material/Close'; import './InitModal.css'; const { ipcRenderer } = window.require('electron'); @@ -29,9 +33,14 @@ const { ipcRenderer } = window.require('electron'); }; */ export default function InitModal() { + const [loadingBecauseItsSettingUp, setLoadingBecauseItsSettingUp] = React.useState(false); + const [open, setOpen] = React.useState(false); const handleOpen = () => setOpen(true); - const handleClose = () => setOpen(false); + const handleClose = () => { + if (loadingBecauseItsSettingUp) return; + setOpen(false) + } const [chosenTemplate, setChosenTemplate] = React.useState(''); const handleTemplateChange = (event: SelectChangeEvent) => { @@ -53,7 +62,7 @@ export default function InitModal() { fetch('https://raw.githubusercontent.com/sern-handler/create-bot/main/metadata/templateChoices.json') .then((res) => res.json()) .then((data) => { - setTemplates(data); + setTemplates(data as TemplateList[]); }) .catch((err) => { console.log(err.message); @@ -88,6 +97,38 @@ export default function InitModal() { setSelectedPath(selectedPath); }; + const [logFileName, setLogFileName] = React.useState('') + + const handleOpenLogFile = () => { + ipcRenderer.send('openTxtFile', logFileName); + + ipcRenderer.on('openTxtFile', (_event, _args) => { + ipcRenderer.removeAllListeners('openTxtFile'); + }); + } + + const [successSnackbarOpen, setSuccessSnackbarOpen] = React.useState(false) + const handleSuccessSnackbarClose = () => setSuccessSnackbarOpen(false); + + const [errorSnackbarOpen, setErrorSnackbarOpen] = React.useState(false) + const handleErrorSnackbarClose = () => setErrorSnackbarOpen(false); + + const snackbarAction = ( + + + + + + + ); + const [loading, setLoading] = React.useState(false); const isFormValid = () => { @@ -108,13 +149,21 @@ export default function InitModal() { }; setLoading(true); + setLoadingBecauseItsSettingUp(true) ipcRenderer.send('submitForm', data); - ipcRenderer.on('submitForm', () => { + ipcRenderer.on('submitForm', (_event, args) => { setLoading(false); + setLoadingBecauseItsSettingUp(false); handleClose(); - ipcRenderer.removeAllListeners('submitForm'); // Remove the listener to avoid memory leaks + setLogFileName(args.logFileName) + if (args.exitCode === 0) { + setSuccessSnackbarOpen(true) + } else { + setErrorSnackbarOpen(true) + } + ipcRenderer.removeAllListeners('submitForm'); }); } @@ -210,20 +259,6 @@ export default function InitModal() { {selectedPath ? `Selected directory: ${selectedPath}` : ''} -
- - Do not close the modal while it's loading. - -
); } diff --git a/src/main.tsx b/src/main.tsx index 07b580c..e33f481 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,5 +1,5 @@ -import React from 'react'; -import ReactDOM from 'react-dom/client'; +import * as React from 'react'; +import * as ReactDOM from 'react-dom/client'; import './main.css'; import App from './App'; diff --git a/tsconfig.json b/tsconfig.json index 2bb371e..10cbc98 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -8,8 +8,7 @@ "outDir": "./dist", /* Bundler mode */ - "moduleResolution": "bundler", - "allowImportingTsExtensions": true, + "moduleResolution": "node", "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, @@ -21,6 +20,6 @@ "noUnusedParameters": true, "noFallthroughCasesInSwitch": true }, - "include": ["src"], + "include": ["src", "src/vite-env.d.ts"], "references": [{ "path": "./tsconfig.node.json" }] }