chore: change the coordinates

.circleci/config.yml

@@ -19,9 +19,20 @@ jobs:
       - run: yarn
       - run: yarn build-electron-linux
       - run: mkdir /tmp/artifacts
-      - run: mv -t /tmp/artifacts dist/*.snap dist/*.AppImage
+      - run: mv -t /tmp/artifacts dist/*.AppImage
       - store_artifacts:
           path: /tmp/artifacts
+  build_macos:
+      macos:
+        xcode: 14.2.0
+      steps:
+        - checkout
+        - run: yarn
+        - run: yarn build-electron-mac
+        - run: mkdir /tmp/artifacts
+        - run: mv dist/*.dmg /tmp/artifacts
+        - store_artifacts:
+            path: /tmp/artifacts
 
 workflows:
   build:
@@ -34,3 +45,6 @@ workflows:
       - build_linux:
           requires:
             - hold
+      - build_macos:
+          requires:
+            - hold

locales/en.json

@@ -29,9 +29,6 @@
       "COMMENT_FOR_TRANSLATOR_2": "the next string is used to change the text 'with' in the sentence 'with <package manager>'",
       "with": "with"
     },
-    "settings": {
-      "componentLoadTimes": "Component load times (some of them)"
-    },
     "footer": {
       "COMMENT_FOR_TRANSLATOR": "Keep all the strings here as lowercase. It kinda gives a good vibe to the text :D",
       "web": "front page",

package.json

@@ -29,15 +29,13 @@
     "i18next": "^23.4.4",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-i18next": "^13.1.2",
-    "to-boolean": "^1.0.0"
+    "react-i18next": "^13.1.2"
   },
   "devDependencies": {
     "@swc/cli": "^0.1.62",
     "@swc/core": "^1.3.70",
     "@types/react": "^18.2.14",
     "@types/react-dom": "^18.2.6",
-    "@types/to-boolean": "^1.0.0",
     "@typescript-eslint/eslint-plugin": "^5.61.0",
     "@typescript-eslint/parser": "^5.61.0",
     "@vitejs/plugin-react-swc": "^3.3.2",
@@ -51,6 +49,8 @@
     "vite": "^4.4.0"
   },
   "build": {
+    "appId": "dev.sern.gui",
+    "productName": "sern GUI",
     "files": [
       "./build/**/*",
       "./dist/index.js"
@@ -61,6 +61,32 @@
     "win": {
       "icon": "./icons/icon.ico",
       "publisherName": "sern"
+    },
+    "mac": {
+      "icon": "./icons/icon.icns",
+      "category": "public.app-category.developer-tools",
+      "target": [
+        "dmg",
+        "zip"
+      ]
+    },
+    "dmg": {
+      "background": "./icons/dmgbg.png",
+      "icon": "./icons/icon.icns",
+      "title": "sern GUI",
+      "contents": [
+        {
+          "x": 423,
+          "y": 203,
+          "type": "link",
+          "path": "/Applications"
+        },
+        {
+          "x": 117,
+          "y": 203,
+          "type": "file"
+        }
+      ]
     }
   }
 }

src/App.tsx

@@ -4,7 +4,6 @@ import './FunctionalityCard.js';
 import FunctionalityCard from './FunctionalityCard.js';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import LanguageSelector from './LanguageSelector';
-import Settings from './Settings';
 
 const darkTheme = createTheme({
 	palette: {
@@ -19,7 +18,6 @@ function App() {
 	return (
 		<div className="App">
 			<ThemeProvider theme={darkTheme}>
-				<Settings />
 				<LanguageSelector />
 				<h1 className="titleHeader">~$ sern</h1>
 				<div className="functionalityCards">

src/ComponentLoadTimeWidget.tsx

@@ -1,7 +0,0 @@
-import './ComponentLoadTimeWidget.css'
-
-export default function ComponentLoadTimeWidget(props: { state: { show: boolean, ad: number, bd: number } }) {
-	return (
-		<p>hi from the widget</p>
-	)
-}

src/Settings.css

@@ -1,13 +0,0 @@
-.boxStyle {
-    /* background-color: 'background.paper'; set in sx property of Box tag */
-    transform: translate(-50%, -50%);
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    width: 74.6vw;
-    height: 74.6vh;
-    border: 2px solid #FFF;
-    box-shadow: 24px;
-    padding: 40px;
-    color: white;
-}

src/Settings.tsx

@@ -1,73 +0,0 @@
-import './Settings.css';
-import * as React from 'react';
-import Box from '@mui/material/Box';
-import Typography from '@mui/material/Typography';
-import Modal from '@mui/material/Modal';
-import SettingsIcon from '@mui/icons-material/Settings';
-import Checkbox from '@mui/material/Checkbox';
-import { useTranslation } from 'react-i18next';
-import FormControlLabel from '@mui/material/FormControlLabel';
-import FormGroup from '@mui/material/FormGroup';
-import { Profiler } from 'react';
-import ComponentLoadTimeWidget from './ComponentLoadTimeWidget';
-
-export default function Settings() {
-	const [CLTW, setCLTW] = React.useState({ show: false, ad: 0, bd: 0 })
-	const onRender = (_id: string, _phase: string, actualDuration: number, baseDuration: number, _startTime: EpochTimeStamp, _commitTime: EpochTimeStamp) => {
-		if (!!window.localStorage.getItem('componentLoadTimes')) {
-			setCLTW({
-				show: true,
-				ad: actualDuration,
-				bd: baseDuration
-			})
-		}
-	}
-
-	const { t } = useTranslation('translation', { keyPrefix: 'settings' });
-	const [state, setState] = React.useState({
-		componentLoadTimes: !!window.localStorage.getItem('componentLoadTimes')
-	});
-	const { componentLoadTimes } = state;
-
-	const [open, setOpen] = React.useState(false);
-	const handleModalOpen = () => setOpen(true);
-	const handleModalClose = () => setOpen(false);
-
-	const handleButtonChange = (event: React.ChangeEvent<HTMLInputElement>) => {
-		setState({ ...state, [event.target.name]: event.target.checked });
-		switch (event.target.name) {
-			case 'componentLoadTimes':
-				return window.localStorage.setItem('componentLoadTimes', event.target.checked.toString())
-		}
-		console.log(state)
-	}
-
-	return (
-		<div>
-			<SettingsIcon onClick={handleModalOpen} color={'primary'} />
-			<Profiler onRender={onRender} id={'settings-modal'}>
-				<ComponentLoadTimeWidget state={CLTW} />
-				<Modal
-					open={open}
-					onClose={handleModalClose}
-					aria-labelledby="settings-modal-title"
-					aria-describedby="settings-modal-description"
-				>
-					<Box className={'boxStyle'} sx={{ bgcolor: 'background.paper' }}>
-						<FormGroup>
-							<Typography variant="h5" gutterBottom>
-								Debugging
-							</Typography>
-							<FormControlLabel
-								control={
-									<Checkbox checked={componentLoadTimes} onChange={handleButtonChange} name="componentLoadTimes" />
-								}
-								label={t('componentLoadTimes')}
-							/>
-						</FormGroup>
-					</Box>
-				</Modal>
-			</Profiler>
-		</div>
-	)
-}

yarn.lock

@@ -915,11 +915,6 @@
   resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.0.tgz#591c1ce3a702c45ee15f47a42ade72c2fd78978a"
   integrity sha512-G8hZ6XJiHnuhQKR7ZmysCeJWE08o8T0AXtk5darsCaTVsYZhhgUrq53jizaR2FvsoeCwJhlmwTjkXBY5Pn/ZHw==
 
-"@types/to-boolean@^1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@types/to-boolean/-/to-boolean-1.0.0.tgz#bce7dd64d2d4dc644d39c69f4cdf62867e1bd5dd"
-  integrity sha512-rKY7I5UUlC3mUjGasRsZyg/ksLqUDQMahpn0QWXA3nxZehZF25rJpbvTB37Vjd61iW3j662L3Iu/WlRdGlDcJQ==
-
 "@types/verror@^1.10.3":
   version "1.10.6"
   resolved "https://registry.yarnpkg.com/@types/verror/-/verror-1.10.6.tgz#3e600c62d210c5826460858f84bcbb65805460bb"
@@ -3951,11 +3946,6 @@ tmp@^0.2.0:
   dependencies:
     rimraf "^3.0.0"
 
-to-boolean@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/to-boolean/-/to-boolean-1.0.0.tgz#840653cc95abde6ae7fa259e7d74868a91232e3f"
-  integrity sha512-6BregB7cU5D+BVONyLbjoOd3dZXWDNyz6GFu+WdTzd5YbLcgFdZFstwsSgEmELmjdWy9U5e38q2sYSlFhka/Lw==
-
 to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"