diff --git a/packages/desktop/src/index.ts b/packages/desktop/src/index.ts index b4edc2f..754c6c4 100644 --- a/packages/desktop/src/index.ts +++ b/packages/desktop/src/index.ts @@ -7,13 +7,13 @@ import { globalShortcut, ipcMain, screen, -} from "electron"; -import Channels, { DEFAULT_APP_PRESET } from "./electron/constants"; +} from 'electron'; +import Channels, { DEFAULT_APP_PRESET } from './electron/constants'; -import { DimensionChangeRequest } from "./electron/constants"; -import { handleGoogleLogin } from "./electron/handleLogin"; -import path from "path"; -import store from "./electron/store"; +import { DimensionChangeRequest } from './electron/constants'; +import { handleGoogleLogin } from './electron/handleLogin'; +import path from 'path'; +import store from './electron/store'; // This allows TypeScript to pick up the magic constant that's auto-generated by Forge's Webpack // plugin that tells the Electron app where to look for the Webpack-bundled app code (depending on @@ -22,7 +22,7 @@ declare const MAIN_WINDOW_WEBPACK_ENTRY: string; declare const MAIN_WINDOW_PRELOAD_WEBPACK_ENTRY: string; // Handle creating/removing shortcuts on Windows when installing/uninstalling. -if (require("electron-squirrel-startup")) { +if (require('electron-squirrel-startup')) { // eslint-disable-line global-require app.quit(); } @@ -41,7 +41,7 @@ const createWindow = (): void => { preload: MAIN_WINDOW_PRELOAD_WEBPACK_ENTRY, sandbox: true, }, - icon: "./assets/1024x1024.icns", + icon: './assets/1024x1024.icns', // transparent: true, @@ -60,7 +60,7 @@ const createWindow = (): void => { browserWindow.loadURL(MAIN_WINDOW_WEBPACK_ENTRY); // Open the DevTools. - browserWindow.webContents.openDevTools({ mode: "detach" }); + browserWindow.webContents.openDevTools({ mode: 'detach' }); display = screen.getPrimaryDisplay(); }; @@ -74,15 +74,15 @@ app .then(() => { // activate login ipcMain.on(Channels.ACTIVATE_LOG_IN, async (event, arg) => { - console.log("initiating log in"); + console.log('initiating log in'); await handleGoogleLogin(); }); // access storage/cookies - ipcMain.on("electron-store-set", async (event, key, val) => { + ipcMain.on('electron-store-set', async (event, key, val) => { store.set(key, val); }); - ipcMain.handle("electron-store-get", async (event, val) => { + ipcMain.handle('electron-store-get', async (event, val) => { const result = await store.get(val); return result; }); @@ -90,7 +90,7 @@ app // dynamically changing the window bounds ipcMain.on(Channels.RESIZE_WINDOW, (event, req: DimensionChangeRequest) => { if (req.setAlwaysOnTop) { - browserWindow.setAlwaysOnTop(true, "floating"); + browserWindow.setAlwaysOnTop(true, 'floating'); } else { browserWindow.setAlwaysOnTop(false); } @@ -100,26 +100,21 @@ app browserWindow.setSize( currentDimensions[0] + req.dimensions.width, currentDimensions[1] + req.dimensions.height, - false + false, ); } else { - browserWindow.setSize( - req.dimensions.width, - req.dimensions.height, - false - ); + browserWindow.setSize(req.dimensions.width, req.dimensions.height, false); } if (req.setPosition) { - if (req.setPosition === "center") { + if (req.setPosition === 'center') { browserWindow.center(); } - if (req.setPosition === "topRight") { - browserWindow.setPosition( - display.bounds.width - req.dimensions.width, - 0 - ); + if (req.setPosition === 'topRight') { + browserWindow.setPosition(display.bounds.width - req.dimensions.width, 0); + + console.log(display.bounds); } } }); @@ -130,7 +125,7 @@ app // }); // on blur, show overlay, and tell app to trigger overlay mode - browserWindow.on("blur", () => { + browserWindow.on('blur', () => { browserWindow.webContents.send(Channels.ON_WINDOW_BLUR); }); }); @@ -138,13 +133,13 @@ app // 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) { @@ -158,17 +153,17 @@ app.on("activate", () => { // open deep links from nirvana web app if (process.defaultApp) { if (process.argv.length >= 2) { - app.setAsDefaultProtocolClient("nirvana-desktop", process.execPath, [ + app.setAsDefaultProtocolClient('nirvana-desktop', process.execPath, [ path.resolve(process.argv[1]), ]); } } else { - app.setAsDefaultProtocolClient("nirvana-desktop"); + app.setAsDefaultProtocolClient('nirvana-desktop'); } // Handle the protocol. In this case, we choose to show an Error Box. -app.on("open-url", (event, url) => { - console.log("welcome back, you arrived from: ", url); +app.on('open-url', (event, url) => { + console.log('welcome back, you arrived from: ', url); browserWindow.focus(); }); diff --git a/packages/desktop/src/providers/ElectronProvider.tsx b/packages/desktop/src/providers/ElectronProvider.tsx index 478dbea..28f0514 100644 --- a/packages/desktop/src/providers/ElectronProvider.tsx +++ b/packages/desktop/src/providers/ElectronProvider.tsx @@ -27,12 +27,14 @@ export function ElectronProvider({ children }: { children: React.ReactNode }) { if (desktopMode === 'mainApp') { stayOnTop = false; finalDimensions = DEFAULT_APP_PRESET; + finalPosition = 'center'; } else if (desktopMode === 'overlayOnly') { stayOnTop = true; finalDimensions = { - height: 668, - width: 360, + height: 273, + width: 350, }; + finalPosition = 'topRight'; } // send the final dimensions to main process @@ -54,7 +56,7 @@ export function ElectronProvider({ children }: { children: React.ReactNode }) { 'window blurring now, should be always on top and then ill tell main process to change dimensions', ); // TODO: testing mode... uncomment both instructions below - // setDesktopMode("overlayOnly"); + setDesktopMode('overlayOnly'); // todo: make sure that if I am toggle broadcasted into a line, then don't deselect selected line // the overlay should be showing selected line if I am broadcasting toggled into it as well as of course all other toggle tuned ones diff --git a/packages/desktop/src/styles/index.css b/packages/desktop/src/styles/index.css index 0da3247..ab899c0 100644 --- a/packages/desktop/src/styles/index.css +++ b/packages/desktop/src/styles/index.css @@ -22,7 +22,7 @@ button { @apply transition-all rounded; } -#titlebar { +.titlebar { -webkit-user-select: none; -webkit-app-region: drag; diff --git a/packages/desktop/src/tree/protected/terminal/line/LineDetails.tsx b/packages/desktop/src/tree/protected/terminal/line/LineDetails.tsx index c314885..7e953f1 100644 --- a/packages/desktop/src/tree/protected/terminal/line/LineDetails.tsx +++ b/packages/desktop/src/tree/protected/terminal/line/LineDetails.tsx @@ -90,7 +90,7 @@ export default function LineDetails() {
{/* line details */}
{profilePictures && } diff --git a/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx b/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx index 019d4a2..6cdd9e3 100644 --- a/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx +++ b/packages/desktop/src/tree/protected/terminal/panels/SidePanel.tsx @@ -9,6 +9,7 @@ import LineRow from '../line/LineRow'; import useTerminalProvider from '../../../../providers/TerminalProvider'; import useAuth from '../../../../providers/AuthProvider'; import useSockets from '../../../../providers/SocketProvider'; +import useElectron from '../../../../providers/ElectronProvider'; export default function SidePanel() { // using merely for loading state...better to add to realtimeroom context? @@ -21,9 +22,17 @@ export default function SidePanel() { const { handleFlowState } = useSockets(); + const { handleOpenMainApp, desktopMode } = useElectron(); + // todo: sort const allChannels = useMemo(() => { - const channels = Object.values(roomsMap); + let channels = Object.values(roomsMap); + + if (desktopMode === 'overlayOnly') { + channels = channels.filter((currentChannel) => + currentChannel.tunedInMemberIds?.includes(user._id.toString()), + ); + } channels.sort((channelA, channelB) => { if ( @@ -46,7 +55,7 @@ export default function SidePanel() { }); return channels; - }, [roomsMap]); + }, [roomsMap, desktopMode, user]); const [searchQuery, setSearchQuery] = useState(''); @@ -61,19 +70,18 @@ export default function SidePanel() { > {/* user control panel */}
- - Channels + {desktopMode === 'mainApp' && ( + Channels + )} - -
- - {/* tuned in header + general controls */} -
- -
- - - -

Tuned In

- -

{`${allChannels?.length || 0}/3`}

- + + +
- -
+ +
+ +
+ + + +

Tuned In

+ +

{`${ + allChannels?.length || 0 + }/3`}

+ +
+ +
+ + )} {!(allChannels.length > 0) && (