Merge pull request #161 from bbonkr/dev

🚀 Update electron-builder

package.json

@@ -1,7 +1,7 @@
 {
  "name": "rename",
  "peoductName": "Rename",
- "version": "1.8.6",
+ "version": "1.9.0",
  "description": "Rename files.",
  "author": {
  "name": "Pon Cheol Ku",
@@ -25,7 +25,7 @@
  "build": "webpack",
  "build:dev": "cross-env NODE_ENV=development npm run build",
  "build:prod": "cross-env NODE_ENV=production npm run build",
- "electron": "electron ./dist/main.js",
+ "electron": "electron ./dist/main.js --trace-warnings",
  "dev:main": "webpack --config webpack.config.main.js --watch --mode=development",
  "dev:renderer": "webpack-dev-server --config webpack.config.renderer.dev.js --mode=development",
  "lint": "tsc --noEmit && eslint --ext .ts,.tsx ./src",
@@ -131,19 +131,17 @@
  {
  "target": "nsis",
  "arch": [
- "x64"
+ "x64",
+ "ia32"
  ]
  }
  ],
  "icon": "./resources/installer/appicon.ico",
- "artifactName": "${productName}-installer-${os}-${arch}-${version}.${ext}",
- "publish": [
- "github",
- "bintray"
- ]
+ "artifactName": "${productName}-installer-${os}-${arch}-${version}.${ext}"
  },
  "nsis": {
- "oneClick": true
+ "oneClick": true,
+ "perMachine": false
  },
  "linux": {
  "target": [

src/main/getMenus.ts

@@ -0,0 +1,133 @@
+import type { MenuItemConstructorOptions, MenuItem, Shell } from 'electron';
+
+const getMenus = (
+ appName: string,
+ shell: Shell,
+ isMac?: boolean,
+): (MenuItemConstructorOptions | MenuItem)[] => {
+ const githubRepositoryUrl = `https://github.com/bbonkr/renameapp`;
+
+ const menus: MenuItemConstructorOptions[] = [];
+
+ if (isMac) {
+ // menus.push({ role: 'appMenu' });
+ menus.push({
+ label: appName,
+ submenu: [
+ { role: 'about' },
+ { type: 'separator' },
+ { role: 'services' },
+ { type: 'separator' },
+ { role: 'hide' },
+ { role: 'hideOthers' },
+ { role: 'unhide' },
+ { type: 'separator' },
+ { role: 'quit' },
+ ],
+ });
+ }
+
+ // menus.push({ role: 'fileMenu' });
+ menus.push({
+ label: 'File',
+ submenu: [isMac ? { role: 'close' } : { role: 'quit' }],
+ });
+ // menus.push({ role: 'editMenu' });
+
+ const macEditMenu: MenuItemConstructorOptions[] = [
+ { role: 'pasteAndMatchStyle' },
+ { role: 'delete' },
+ { role: 'selectAll' },
+ { type: 'separator' },
+ {
+ label: 'Speech',
+ submenu: [{ role: 'startSpeaking' }, { role: 'stopSpeaking' }],
+ },
+ ];
+ const otherEditMenu: MenuItemConstructorOptions[] = [
+ { role: 'delete' },
+ { type: 'separator' },
+ { role: 'selectAll' },
+ ];
+ menus.push({
+ label: 'Edit',
+ submenu: [
+ { role: 'undo' },
+ { role: 'redo' },
+ { type: 'separator' },
+ { role: 'cut' },
+ { role: 'copy' },
+ { role: 'paste' },
+ ...(isMac ? macEditMenu : otherEditMenu),
+ ],
+ });
+
+ // menus.push({ role: 'viewMenu' });
+ menus.push({
+ label: 'View',
+ submenu: [
+ { role: 'reload' },
+ { role: 'forceReload' },
+ { role: 'toggleDevTools' },
+ { type: 'separator' },
+ { role: 'resetZoom' },
+ { role: 'zoomIn' },
+ { role: 'zoomOut' },
+ { type: 'separator' },
+ { role: 'togglefullscreen' },
+ ],
+ });
+ // menus.push({ role: 'windowMenu' });
+
+ const macWindowMenus: MenuItemConstructorOptions[] = [
+ { type: 'separator' },
+ { role: 'front' },
+ { type: 'separator' },
+ { role: 'window' },
+ ];
+
+ const otherWindowMenus: MenuItemConstructorOptions[] = [{ role: 'close' }];
+
+ menus.push({
+ label: 'Window',
+ submenu: [
+ { role: 'minimize' },
+ { role: 'zoom' },
+ ...(isMac ? macWindowMenus : otherWindowMenus),
+ ],
+ });
+
+ menus.push({
+ role: 'help',
+ submenu: [
+ {
+ label: 'About',
+ click: () => {
+ try {
+ shell.openExternal(`${githubRepositoryUrl}#readme`);
+ } catch (error) {}
+ },
+ },
+ {
+ label: 'GitHub Repository',
+ click: () => {
+ try {
+ shell.openExternal(`${githubRepositoryUrl}`);
+ } catch (error) {}
+ },
+ },
+ {
+ label: 'Bug report',
+ click: () => {
+ try {
+ shell.openExternal(`${githubRepositoryUrl}/issues`);
+ } catch (error) {}
+ },
+ },
+ ],
+ });
+
+ return menus;
+};
+
+export default getMenus;

src/main/main.ts

@@ -5,6 +5,7 @@ import electron, {
  Menu,
  nativeTheme,
  shell,
+ BrowserWindow,
 } from 'electron';
 import fs from 'fs';
 import path from 'path';
@@ -13,6 +14,7 @@ import { format, URL } from 'url';
 import { FileInfo } from '../lib/FileInfo';
 // import setupEvents from './setup-events';
 import { Channels } from '../models/channels';
+import getMenus from './getMenus';
 
 // const isProd = process.env.NODE_ENV === 'production';
 const isDev = process.env.NODE_ENV !== 'production';
@@ -167,8 +169,8 @@ const createMainWindow = () => {
  minWidth: 800,
  minHeight: 640,
  title: 'Rename App',
- frame: isMac,
- titleBarStyle: isMac ? 'default' : 'hidden',
+ // frame: isMac,
+ // titleBarStyle: isMac ? 'default' : 'hidden',
  // renderer console error
  // resolve: Uncaught ReferenceError: require is not defined
  webPreferences: {
@@ -177,6 +179,7 @@ const createMainWindow = () => {
  nodeIntegrationInWorker: true,
  preload: path.join(__dirname, 'preload.js'),
  },
+ // autoHideMenuBar: true,
  });
 
  // 개발자 도구를 엽니다.
@@ -189,11 +192,12 @@ const createMainWindow = () => {
  .loadURL('http://localhost:26498')
  .then(() => {
  console.info('[MAIN:DEV] Window Loaded.');
+
+ mainWindow?.webContents.openDevTools();
  })
  .catch(err => {
  console.error(err);
  });
- mainWindow.webContents.openDevTools();
  } else {
  // 앱의 index.html 파일을 로드합니다.
  const url = new URL(`file:///${path.join(__dirname, './index.html')}`);
@@ -274,19 +278,27 @@ app.whenReady().then(() => {
  }
  });
 
- app.on('activate', () => {
- // macOS에서는 dock 아이콘이 클릭되고 다른 윈도우가 열려있지 않았다면 앱에서 새로운 창을 다시 여는 것이 일반적입니다.
- if (!mainWindow) {
- createMainWindow();
- }
- });
+ try {
+ const template = getMenus(app.name, shell, isMac);
+ const menu = Menu.buildFromTemplate(template);
+ Menu.setApplicationMenu(menu);
+ } catch (error) {
+ console.error('[MAIN][app.whenReady] Menu does not configure', error);
+ }
+
+ // if (mainWindow && process.platform !== 'darwin') {
+ // // 메뉴 사용안함
+ // mainWindow.setMenu(null);
+ // Menu.setApplicationMenu(null);
+ // }
 
  createMainWindow();
+});
 
- if (mainWindow && process.platform !== 'darwin') {
-  // 메뉴 사용안함
-  mainWindow.setMenu(null);
- Menu.setApplicationMenu(null);
+app.on('activate', () => {
+ // macOS에서는 dock 아이콘이 클릭되고 다른 윈도우가 열려있지 않았다면 앱에서 새로운 창을 다시 여는 것이 일반적입니다.
+ if (BrowserWindow.getAllWindows().length === 0) {
+ createMainWindow();
  }
 });
 

src/renderer/components/FileList/FileListTable.css

@@ -1,9 +1,7 @@
 .file-list-table-container {
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
+ flex: 1;
+ display: flex;
+ position: relative;
 }
 .file-list-table-container .no-files {
  min-height: 100%;

src/renderer/components/GoToTop/GoToTop.tsx

@@ -5,16 +5,22 @@ import './GoToTop.css';
 
 export const GoToTop = () => {
  const handleClickGoToTop = () => {
- const fileListTableContainerElement = window.document.querySelector<HTMLDivElement>(
- '.file-list-table-container',
- );
- if (fileListTableContainerElement) {
- fileListTableContainerElement.scrollTo({
- left: 0,
- top: 0,
- behavior: 'smooth',
- });
- }
+ // const containerElement = window.document.querySelector<HTMLDivElement>(
+ // '.content-wrapper ',
+ // );
+ // if (containerElement) {
+ // containerElement.scrollTo({
+ // left: 0,
+ // top: 0,
+ // behavior: 'smooth',
+ // });
+ // }
+
+ window.scrollTo({
+ left: 0,
+ top: 0,
+ behavior: 'smooth',
+ });
  };
  return (
  <div className={'app-button-go-to-top'}>

src/renderer/components/Header/Header.css

@@ -1,6 +1,6 @@
 #header.app-header {
  -webkit-app-region: drag;
- height: 24px;
+ height: 32px;
  padding: 2px 0.6rem;
  flex-direction: row !important;
  justify-content: space-between;

src/renderer/components/RenameApp/RenameApp.css

@@ -1,5 +1,5 @@
 .container-root {
- min-height: 100vh;
+ /* min-height: 100vh; */
 }
 
 .content-wrapper {
@@ -9,13 +9,25 @@
  align-items: stretch;
  row-gap: 0.8rem;
  flex: 1;
- min-height: 100vh;
+ /* min-height: 100vh; */
+ padding: 1.2rem 0.6rem;
+ position: relative;
+}
+.text-center {
+ text-align: center;
 }
-
 .content-container {
  margin: 0 0.3rem;
 }
 
+.content-header {
+ position: sticky;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 1000;
+}
+
 .form-control {
  min-width: 120px;
 }
@@ -32,7 +44,7 @@
 
 .file-input {
  padding: 1.8rem 1rem !important;
- margin: 0.3rem;
+ margin: 1.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
@@ -41,6 +53,10 @@
  border-style: solid;
  border-width: 0.4rem;
  border-color: transparent;
+
+ border-style: dashed;
+ border-color: #3e3e3e32;
+ border-width: 0.4rem;
 }
 
 .paper {