diff --git a/package-lock.json b/package-lock.json index 6cb53463..05610506 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@fastify/error": "^3.4.1", "@platformatic/ui-components": "^0.1.126", "autoprefixer": "^10.4.16", + "boring-name-generator": "^1.0.3", "electron-updater": "^6.1.1", "execa": "^8.0.1", "mkdirp": "^3.0.1", @@ -2522,6 +2523,26 @@ "integrity": "sha512-d0II/GO9uf9lfUHH2BQsjxzRJZBdsjgsBiW4BvhWk/3qoKwQFjIDVN19PfX8F2D/r9PCMTtLWjYVCFrpeYUzsw==", "optional": true }, + "node_modules/boring-name-generator": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/boring-name-generator/-/boring-name-generator-1.0.3.tgz", + "integrity": "sha512-1wEo1pNahY9js7Vkp1RQa/VWdWrXYJnVAmsHV3Pw/0YzspjABLw7dcekjukOMTIYWr8ir/aG0GX1eoEkYhpnUg==", + "dependencies": { + "commander": "^6.1.0", + "lodash": "^4.17.20" + }, + "bin": { + "boring-name-generator": "src/generator-bin.js" + } + }, + "node_modules/boring-name-generator/node_modules/commander": { + "version": "6.2.1", + "resolved": "https://registry.npmjs.org/commander/-/commander-6.2.1.tgz", + "integrity": "sha512-U7VdrJFnJgo4xjrHpTzu0yrHPGImdsmD95ZlgYSEajAn2JKzDhDTPG9kBTefmObL2w/ngeZnilk+OV9CG3d7UA==", + "engines": { + "node": ">= 6" + } + }, "node_modules/bplist-parser": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/bplist-parser/-/bplist-parser-0.2.0.tgz", @@ -6583,8 +6604,7 @@ "node_modules/lodash": { "version": "4.17.21", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", - "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==", - "dev": true + "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, "node_modules/lodash.escaperegexp": { "version": "4.1.2", diff --git a/package.json b/package.json index ac71b85a..f4b7908c 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "@fastify/error": "^3.4.1", "@platformatic/ui-components": "^0.1.126", "autoprefixer": "^10.4.16", + "boring-name-generator": "^1.0.3", "electron-updater": "^6.1.1", "execa": "^8.0.1", "mkdirp": "^3.0.1", diff --git a/src/main/index.mjs b/src/main/index.mjs index ccd029e7..f10da6cd 100644 --- a/src/main/index.mjs +++ b/src/main/index.mjs @@ -6,6 +6,7 @@ import icon from '../../resources/icon.png?asset' import setupMenu from './menu.mjs' import { getTemplates, getPlugins } from './client.mjs' import { prepareFolder, createApp } from './generate.mjs' +const generate = require('boring-name-generator') // eslint-disable-next-line no-unused-vars const isMac = process.platform === 'darwin' @@ -116,6 +117,11 @@ app.whenReady().then(() => { ipcMain.handle('quit-app', () => { app.quit() }) + + ipcMain.handle('generate-name', async () => { + const val = await generate({ words: 1 }).dashed + return val + }) }) // Quit when all windows are closed, except on macOS. There, it's common diff --git a/src/preload/index.js b/src/preload/index.js index 961ad3e2..757dd347 100644 --- a/src/preload/index.js +++ b/src/preload/index.js @@ -20,7 +20,8 @@ if (process.contextIsolated) { prepareFolder: (folder, templates, appName) => (ipcRenderer.invoke('prepare-folder', folder, templates, appName)), onLog: callback => ipcRenderer.on('log', callback), createApp: (folder, project) => (ipcRenderer.invoke('create-app', folder, project)), - quitApp: () => (ipcRenderer.invoke('quit-app')) + quitApp: () => (ipcRenderer.invoke('quit-app')), + getServiceName: () => (ipcRenderer.invoke('generate-name')) }) } catch (error) { console.error(error) diff --git a/src/renderer/src/components/steps/ConfigureApplication.jsx b/src/renderer/src/components/steps/ConfigureApplication.jsx index 774af44a..9ffef234 100644 --- a/src/renderer/src/components/steps/ConfigureApplication.jsx +++ b/src/renderer/src/components/steps/ConfigureApplication.jsx @@ -242,6 +242,7 @@ const ConfigureApplication = React.forwardRef(({ onNext, onBack }, ref) => { bordered={false} backgroundColor={WHITE} classes={`${commonStyles.buttonPadding} cy-action-next`} + data-posthog='configure_application_done' /> diff --git a/src/renderer/src/components/steps/CreateApplication.jsx b/src/renderer/src/components/steps/CreateApplication.jsx index 5e08688b..561bee82 100644 --- a/src/renderer/src/components/steps/CreateApplication.jsx +++ b/src/renderer/src/components/steps/CreateApplication.jsx @@ -13,9 +13,8 @@ import Title from '~/components/ui/Title' const CreateApplication = React.forwardRef(({ onNext }, ref) => { const globalState = useStackablesStore() const { addFormData, addService, formData } = globalState - const [inputOnServiceField, setInputOnServiceField] = useState(false) - const [form, setForm] = useState({ application: '', service: '', folder: '' }) - const [validations, setValidations] = useState({ applicationValid: false, serviceValid: false, folderValid: false, formErrors: { application: '', service: '', folder: '' } }) + const [form, setForm] = useState({ application: '', folder: '' }) + const [validations, setValidations] = useState({ applicationValid: false, folderValid: false, formErrors: { application: '', folder: '' } }) const [validForm, setValidForm] = useState(false) const [callAddService, setCallAddService] = useState(true) const mockUse = import.meta.env.RENDERER_VITE_USE_MOCKS === 'true' @@ -23,61 +22,28 @@ const CreateApplication = React.forwardRef(({ onNext }, ref) => { useEffect(() => { if (formData?.createApplication) { validateField('application', formData.createApplication.application, setForm(form => ({ ...form, application: formData.createApplication.application }))) - validateField('service', formData.createApplication.service, setForm(form => ({ ...form, service: formData.createApplication.service }))) validateField('folder', formData.createApplication.path, setForm(form => ({ ...form, folder: formData.createApplication.path }))) setValidForm(true) setCallAddService(false) } }, [formData]) - function handleSubmit (event) { + async function handleSubmit (event) { event.preventDefault() addFormData({ createApplication: { application: form.application, - service: form.service, path: form.folder } }) if (callAddService) { - addService() + const serviceName = await window.api.getServiceName() + addService(serviceName) } onNext() } function handleChangeApplication (event) { - if (inputOnServiceField) { - handleChange(event) - } else { - handleChangeBoth(event) - } - } - - function handleChangeBoth (event) { - const value = event.target.value - validateBothField(value, setForm(form => ({ ...form, application: value, service: value }))) - } - - function validateBothField (fieldValue, callback = () => {}) { - let applicationValid = validations.applicationValid - const formErrors = { ...validations.formErrors } - applicationValid = fieldValue.length > 0 && /^[\w-]+$/g.test(fieldValue) - formErrors.application = fieldValue.length > 0 ? (applicationValid ? '' : 'The field is not valid, make sure you are using regular characters') : '' - formErrors.service = fieldValue.length > 0 ? (applicationValid ? '' : 'The field is not valid, make sure you are using regular characters') : '' - const nextValidation = { ...validations, formErrors } - nextValidation.applicationValid = applicationValid - nextValidation.serviceValid = applicationValid - setValidations(nextValidation) - validateForm(nextValidation, callback()) - } - - function handleChangeService (event) { - if (event.target.value !== '' && inputOnServiceField === false) { - setInputOnServiceField(true) - } - if (event.target.value === '' && inputOnServiceField === true) { - setInputOnServiceField(false) - } handleChange(event) } @@ -137,17 +103,6 @@ const CreateApplication = React.forwardRef(({ onNext }, ref) => { backgroundTransparent /> - - -