From cd668fc33acf23f2905bf061ef8edebb8e2f4298 Mon Sep 17 00:00:00 2001 From: emirsassan Date: Mon, 7 Jul 2025 09:21:33 +0300 Subject: [PATCH] refactor: replace Menu with new Popup component --- .../frontend/src/components/Navbar.tsx | 21 ++++---- .../launcher/cluster/ClusterCreation.tsx | 16 ++---- .../overlay/popups/AccountPopup.tsx | 45 +++++++++-------- .../overlay/popups/NotificationPopup.tsx | 49 +++++++++---------- .../frontend/src/hooks/useNotification.tsx | 7 +-- .../frontend/src/routes/app/cluster/index.tsx | 16 +++++- .../src/routes/app/settings/accounts.tsx | 7 ++- packages/web_common/src/components/Popup.tsx | 22 +++++++++ packages/web_common/src/components/index.ts | 1 + 9 files changed, 104 insertions(+), 80 deletions(-) create mode 100644 packages/web_common/src/components/Popup.tsx diff --git a/apps/onelauncher/frontend/src/components/Navbar.tsx b/apps/onelauncher/frontend/src/components/Navbar.tsx index 9009e5c4..c4ddb25e 100644 --- a/apps/onelauncher/frontend/src/components/Navbar.tsx +++ b/apps/onelauncher/frontend/src/components/Navbar.tsx @@ -1,8 +1,8 @@ import type { ToOptions } from '@tanstack/react-router'; -import { bindings } from '@/main'; import useNotifications from '@/hooks/useNotification'; +import { bindings } from '@/main'; import { useCommand } from '@onelauncher/common'; -import { Button, Menu } from '@onelauncher/common/components'; +import { Button, Menu, Popup } from '@onelauncher/common/components'; import { Link } from '@tanstack/react-router'; import { Bell01Icon, Cloud01Icon, TerminalBrowserIcon } from '@untitled-theme/icons-react'; import { MenuTrigger } from 'react-aria-components'; @@ -40,7 +40,7 @@ function Navbar() { {/* Notification Manager Button */}
- + - - + - - + +
- + - + - - + + ); diff --git a/apps/onelauncher/frontend/src/components/launcher/cluster/ClusterCreation.tsx b/apps/onelauncher/frontend/src/components/launcher/cluster/ClusterCreation.tsx index 2dc735f7..0e15f054 100644 --- a/apps/onelauncher/frontend/src/components/launcher/cluster/ClusterCreation.tsx +++ b/apps/onelauncher/frontend/src/components/launcher/cluster/ClusterCreation.tsx @@ -7,9 +7,8 @@ import Modal from '@/components/overlay/Modal'; import ScrollableContainer from '@/components/ScrollableContainer'; import { bindings } from '@/main'; import { LAUNCHER_IMPORT_TYPES, LOADERS, upperFirst } from '@/utils'; -import { useCommand } from '@onelauncher/common'; +import { useCommand, useCommandMut } from '@onelauncher/common'; import { Button, Dropdown, SelectList, TextField } from '@onelauncher/common/components'; -import { useQueryClient } from '@tanstack/react-query'; import { ArrowRightIcon, PlusIcon, SearchMdIcon, Server01Icon, TextInputIcon, User03Icon } from '@untitled-theme/icons-react'; import { useCallback, useEffect, useState } from 'react'; import { Checkbox } from 'react-aria-components'; @@ -34,29 +33,22 @@ export function NewClusterCreate() { clusterVersion: '', }); - const create = useCommand('createCluster', () => bindings.core.createCluster({ + const create = useCommandMut(() => bindings.core.createCluster({ icon: DefaultClusterBanner, mc_loader: formData.loader as GameLoader, mc_loader_version: null, mc_version: formData.clusterVersion, name: formData.clusterName, - }), { - enabled: false, - subscribed: false, - }); - - const queryClient = useQueryClient(); + })); function handleCreate() { if (!isLastInputStep) return; - create.refetch(); + create.mutate(); if (create.isError) console.error(create.error.message); - - queryClient.invalidateQueries({ queryKey: ['getClusters'], exact: true }); } const handleNext = useCallback(async () => { diff --git a/apps/onelauncher/frontend/src/components/overlay/popups/AccountPopup.tsx b/apps/onelauncher/frontend/src/components/overlay/popups/AccountPopup.tsx index 8caaafc3..e6aa0c71 100644 --- a/apps/onelauncher/frontend/src/components/overlay/popups/AccountPopup.tsx +++ b/apps/onelauncher/frontend/src/components/overlay/popups/AccountPopup.tsx @@ -2,58 +2,61 @@ import type { MinecraftCredentials } from '@/bindings.gen'; import PlayerHead from '@/components/content/PlayerHead'; import { bindings } from '@/main'; import { useCommand } from '@onelauncher/common'; -import { Button, Menu } from '@onelauncher/common/components'; +import { Button } from '@onelauncher/common/components'; +import { Link } from '@tanstack/react-router'; import { PlusIcon, Settings01Icon } from '@untitled-theme/icons-react'; -import { Separator } from 'react-aria-components'; import { twMerge } from 'tailwind-merge'; function AccountPopup() { const users = useCommand('getUsers', bindings.core.getUsers); const defaultUser = useCommand('getDefaultUser', () => bindings.core.getDefaultUser(false)); + const addAccount = useCommand('openMsaLogin', bindings.core.openMsaLogin, { + enabled: false, + subscribed: false, + }); + const setDefaultUser = (user: MinecraftCredentials) => { bindings.core.setDefaultUser(user.id); }; return ( - +
{defaultUser.data && ( - +
{}} + onClick={() => { }} user={defaultUser.data} /> - +
)} - {users.data?.filter(user => user.id === defaultUser.data?.id).map(user => ( - + {users.data?.filter(user => user.id !== defaultUser.data?.id).map(user => ( +
setDefaultUser(user)} user={user} /> - +
))} - {(users.data?.length ?? 0) > 0 && ( - - )} - - -
-
- + + +
- -
+ + ); } diff --git a/apps/onelauncher/frontend/src/components/overlay/popups/NotificationPopup.tsx b/apps/onelauncher/frontend/src/components/overlay/popups/NotificationPopup.tsx index fe9fa1bd..537ec3b2 100644 --- a/apps/onelauncher/frontend/src/components/overlay/popups/NotificationPopup.tsx +++ b/apps/onelauncher/frontend/src/components/overlay/popups/NotificationPopup.tsx @@ -1,7 +1,8 @@ import type { NotificationData } from '@/hooks/useNotification'; import useNotifications from '@/hooks/useNotification'; -import { Button, Menu } from '@onelauncher/common/components'; +import { Button, Menu, Popup } from '@onelauncher/common/components'; import { XIcon } from '@untitled-theme/icons-react'; +import { Popover } from 'react-aria-components'; interface NotificationItemProps { id: string; @@ -53,35 +54,29 @@ function NotificationPopup() { if (notificationEntries.length === 0) return ( - - -
-

No notifications

-
- - +
+

No notifications

+
); return ( - - -
-

Notifications

- {notificationEntries.length > 0 && ( - - )} -
- + +
+

Notifications

+ {notificationEntries.length > 0 && ( + + )} +
{notificationEntries.map(([id, data]) => ( - +
- +
))} - + ); } diff --git a/apps/onelauncher/frontend/src/hooks/useNotification.tsx b/apps/onelauncher/frontend/src/hooks/useNotification.tsx index e5bf12a0..02fe79f0 100644 --- a/apps/onelauncher/frontend/src/hooks/useNotification.tsx +++ b/apps/onelauncher/frontend/src/hooks/useNotification.tsx @@ -43,13 +43,8 @@ export function NotificationProvider({ children }: NotificationProviderProps) { })); }).then(u => u()); - const ctx = { - notifications, - setNotifications, - }; - return ( - + {children} ); diff --git a/apps/onelauncher/frontend/src/routes/app/cluster/index.tsx b/apps/onelauncher/frontend/src/routes/app/cluster/index.tsx index 9c9ed814..f0da5f9e 100644 --- a/apps/onelauncher/frontend/src/routes/app/cluster/index.tsx +++ b/apps/onelauncher/frontend/src/routes/app/cluster/index.tsx @@ -4,6 +4,7 @@ import DefaultInstancePhoto from '@/assets/images/default_instance_cover.jpg'; import LoaderIcon from '@/components/launcher/LoaderIcon'; import ScrollableContainer from '@/components/ScrollableContainer'; import SettingsRow from '@/components/SettingsRow'; +import useNotifications from '@/hooks/useNotification'; import { bindings } from '@/main'; import { useCommand } from '@onelauncher/common'; import { Button, Show, TextField } from '@onelauncher/common/components'; @@ -129,6 +130,8 @@ function Banner({ setNewName, setNewCover, }: BannerProps) { + const { set, list } = useNotifications(); + async function launchFilePicker() { const selected = await open({ multiple: false, @@ -153,8 +156,17 @@ function Banner({ const handleLaunch = () => { launch.refetch(); - if (launch.error) - console.error(launch.error.message); + // eslint-disable-next-line no-console -- debug + console.log(list); + + if (launch.isError) + set('launch_cluster', { + title: 'Failed to launch cluster', + message: launch.error.message, + }); + + // eslint-disable-next-line no-console -- debug + console.log(list); }; function updateName(name: string) { diff --git a/apps/onelauncher/frontend/src/routes/app/settings/accounts.tsx b/apps/onelauncher/frontend/src/routes/app/settings/accounts.tsx index 21056bd4..da500e3e 100644 --- a/apps/onelauncher/frontend/src/routes/app/settings/accounts.tsx +++ b/apps/onelauncher/frontend/src/routes/app/settings/accounts.tsx @@ -21,6 +21,11 @@ function RouteComponent() { const { data: usersData, isLoading: usersLoading } = useCommand('getUsers', bindings.core.getUsers); const { data: defaultUserData, isLoading: defaultUserLoading } = useCommand('getDefaultUser', () => bindings.core.getDefaultUser(false)); + const addAccount = useCommand('openMsaLogin', bindings.core.openMsaLogin, { + enabled: false, + subscribed: false, + }); + if (usersLoading || defaultUserLoading) return ( @@ -47,7 +52,7 @@ function RouteComponent() {
-