From ef72bc315847d0de771cb5807ebf9e49e137b3c5 Mon Sep 17 00:00:00 2001 From: talksik Date: Tue, 15 Mar 2022 13:21:45 -0400 Subject: [PATCH] trying stuff with electron forge but moving away --- packages/desktop/electron/global.d.ts | 2 +- packages/desktop/src/App.tsx | 4 -- packages/desktop2/package.json | 8 ++- packages/desktop2/src/app.tsx | 16 ++++- .../desktop2/src/components/Logo/index.tsx | 38 ++++++++++- packages/desktop2/src/global.d.ts | 7 ++ packages/desktop2/src/index.ts | 15 +++-- packages/desktop2/src/pages/Home/index.tsx | 64 +++++++++++++++++++ packages/desktop2/src/pages/Login/index.tsx | 34 +++++++++- packages/desktop2/src/pages/Profile/index.tsx | 3 + packages/desktop2/src/preload.ts | 15 +++++ packages/desktop2/src/shared/constants.js | 6 ++ packages/desktop2/tsconfig.json | 2 +- yarn.lock | 2 +- 14 files changed, 194 insertions(+), 22 deletions(-) create mode 100644 packages/desktop2/src/global.d.ts create mode 100644 packages/desktop2/src/pages/Home/index.tsx create mode 100644 packages/desktop2/src/pages/Profile/index.tsx create mode 100644 packages/desktop2/src/preload.ts create mode 100644 packages/desktop2/src/shared/constants.js diff --git a/packages/desktop/electron/global.d.ts b/packages/desktop/electron/global.d.ts index 4c7a134..b1fda71 100644 --- a/packages/desktop/electron/global.d.ts +++ b/packages/desktop/electron/global.d.ts @@ -2,6 +2,6 @@ import { API } from "./preload"; export {}; declare global { interface Window { - API: typeof API; + electron: typeof API; } } diff --git a/packages/desktop/src/App.tsx b/packages/desktop/src/App.tsx index 9a84ae7..dc51451 100644 --- a/packages/desktop/src/App.tsx +++ b/packages/desktop/src/App.tsx @@ -2,12 +2,8 @@ import "./App.css"; import { HashRouter, Route, Routes } from "react-router-dom"; -import { Button } from "@mui/material"; import Home from "./pages/Home"; import Login from "./pages/Login"; -import Logo from "./components/Logo"; -import React from "react"; -import logo from "./logo.svg"; import testConnection from "@nirvana/core"; testConnection(); diff --git a/packages/desktop2/package.json b/packages/desktop2/package.json index 7867c72..05ae137 100644 --- a/packages/desktop2/package.json +++ b/packages/desktop2/package.json @@ -53,7 +53,10 @@ { "html": "./src/index.html", "js": "./src/renderer.ts", - "name": "main_window" + "name": "main_window", + "preload": { + "js": "./src/preload.ts" + } } ] } @@ -87,6 +90,7 @@ "dependencies": { "electron-squirrel-startup": "^1.0.0", "react": "^17.0.2", - "react-dom": "^17.0.2" + "react-dom": "^17.0.2", + "react-router-dom": "^6.2.2" } } diff --git a/packages/desktop2/src/app.tsx b/packages/desktop2/src/app.tsx index b581aff..c182ee6 100644 --- a/packages/desktop2/src/app.tsx +++ b/packages/desktop2/src/app.tsx @@ -1,13 +1,23 @@ import * as React from "react"; import * as ReactDOM from "react-dom"; +import { HashRouter, Route, Routes } from "react-router-dom"; + +import Home from "./pages/Home"; import Login from "./pages/Login"; function render() { ReactDOM.render( - <> - - , + +
+ + } /> + } /> + {/* + */} + +
+ , document.body ); } diff --git a/packages/desktop2/src/components/Logo/index.tsx b/packages/desktop2/src/components/Logo/index.tsx index fe4fb52..0f615a5 100644 --- a/packages/desktop2/src/components/Logo/index.tsx +++ b/packages/desktop2/src/components/Logo/index.tsx @@ -1,4 +1,40 @@ -export default function Logo({ className }: { className: string }) { +export enum LogoType { + primary = "primary", + small = "small", +} + +export default function Logo({ + className, + type, +}: { + className: string; + type?: LogoType; +}) { + if (type === LogoType.small) { + return ( + + + + + + ); + } return ( { const mainWindow = new BrowserWindow({ height: 600, width: 800, + webPreferences: { + preload: MAIN_WINDOW_WEBPACK_ENTRY, + }, // use a preload script }); // and load the index.html of the app. @@ -27,18 +30,18 @@ const createWindow = (): void => { // This method will be called when Electron has finished // initialization and is ready to create browser windows. // Some APIs can only be used after this event occurs. -app.on('ready', createWindow); +app.on("ready", createWindow); // Quit when all windows are closed, except on macOS. There, it's common // for applications and their menu bar to stay active until the user quits // explicitly with Cmd + Q. -app.on('window-all-closed', () => { - if (process.platform !== 'darwin') { +app.on("window-all-closed", () => { + if (process.platform !== "darwin") { app.quit(); } }); -app.on('activate', () => { +app.on("activate", () => { // On OS X it's common to re-create a window in the app when the // dock icon is clicked and there are no other windows open. if (BrowserWindow.getAllWindows().length === 0) { diff --git a/packages/desktop2/src/pages/Home/index.tsx b/packages/desktop2/src/pages/Home/index.tsx new file mode 100644 index 0000000..ed80486 --- /dev/null +++ b/packages/desktop2/src/pages/Home/index.tsx @@ -0,0 +1,64 @@ +import { + Add, + CardGiftcardRounded, + ContactsRounded, + LinkRounded, + PushPinRounded, +} from "@mui/icons-material"; +import Logo, { LogoType } from "../../components/Logo"; + +export default function Home() { + return ( +
+ {/* header */} +
+ + + + + + + cannot find + + +
+ + {/* actions navbar */} +
+ + + + + + + + + + + + + + +
+ + {/* pinned conversations */} +
+ + + + Pinned + + +
+
+ ); +} diff --git a/packages/desktop2/src/pages/Login/index.tsx b/packages/desktop2/src/pages/Login/index.tsx index 1ab37a1..66b8709 100644 --- a/packages/desktop2/src/pages/Login/index.tsx +++ b/packages/desktop2/src/pages/Login/index.tsx @@ -1,16 +1,44 @@ -import { Button } from "@mui/material"; +import { Button, CircularProgress } from "@mui/material"; +import { useEffect, useState } from "react"; + import Logo from "../../components/Logo"; +import { UserInfo } from "@nirvana/core/models"; import { channels } from "../../shared/constants"; +import { useNavigate } from "react-router-dom"; + +export default function Login() { + const navigate = useNavigate(); -export default function () { const logIn = () => { // send to main process - window.API.activateLogin(); + // window.API.send(channels.ACTIVATE_LOG_IN); }; + useEffect(() => { + // .API.receive(channels.AUTH_TOKEN, async (accessToken: string) => { + // console.log(accessToken); + // // get user info from access token + // const userInfo: UserInfo = await ( + // await fetch( + // `https://www.googleapis.com/oauth2/v1/userinfo?access_token=${accessToken}` + // ) + // ).json(); + // console.log("user data: "); + // console.log(userInfo); + // // if user is a user, then continue to next route + // navigate("/home"); + // // if user is not an existing user, then show create account page + // }); + // return () => { + // ipcRenderer.removeAllListeners(channels.AUTH_TOKEN); + // }; + }, []); + return (
+ + diff --git a/packages/desktop2/src/pages/Profile/index.tsx b/packages/desktop2/src/pages/Profile/index.tsx new file mode 100644 index 0000000..3f0ea80 --- /dev/null +++ b/packages/desktop2/src/pages/Profile/index.tsx @@ -0,0 +1,3 @@ +export default function Profile() { + return this is the profile page; +} diff --git a/packages/desktop2/src/preload.ts b/packages/desktop2/src/preload.ts new file mode 100644 index 0000000..c3a9328 --- /dev/null +++ b/packages/desktop2/src/preload.ts @@ -0,0 +1,15 @@ +import { contextBridge, ipcRenderer } from "electron"; + +const API = { + notificationApi: { + sendNotification() { + ipcRenderer.send("notify", "message"); + }, + }, + batteryApi: {}, + fileApi: {}, +}; + +contextBridge.exposeInMainWorld("electron", API); + +export default API; diff --git a/packages/desktop2/src/shared/constants.js b/packages/desktop2/src/shared/constants.js new file mode 100644 index 0000000..3f1b346 --- /dev/null +++ b/packages/desktop2/src/shared/constants.js @@ -0,0 +1,6 @@ +module.exports = { + channels: { + ACTIVATE_LOG_IN: "ACTIVATE_LOG_IN", + AUTH_TOKEN: "AUTH_TOKEN", + }, +}; diff --git a/packages/desktop2/tsconfig.json b/packages/desktop2/tsconfig.json index 3e41563..eb8c420 100644 --- a/packages/desktop2/tsconfig.json +++ b/packages/desktop2/tsconfig.json @@ -13,7 +13,7 @@ "paths": { "*": ["node_modules/*"] }, - "jsx": "react" + "jsx": "react-jsx" }, "include": ["src/**/*"] } diff --git a/yarn.lock b/yarn.lock index 43e3be6..a4063f7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -9647,7 +9647,7 @@ react-refresh@^0.11.0: resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046" integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A== -react-router-dom@6: +react-router-dom@6, react-router-dom@^6.2.2: version "6.2.2" resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-6.2.2.tgz#f1a2c88365593c76b9612ae80154a13fcb72e442" integrity sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ==