RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-09 10:34:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

use auth logout

Browse Source
This commit is contained in:
SrGooglo 2025-03-06 03:51:47 +00:00
parent a25a82e333
commit ca0387eee3
2 changed files with 137 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/app/src/pages/auth/forms/selector/index.jsx
View File

@ -29,7 +29,7 @@ const MainSelector = (props) => {
)}
<antd.Button
onClick={() => app.controls.openLoginForm()}
onClick={() => app.auth.login()}
icon={<Icons.FiLogIn />}
type="primary"
>
@ -37,7 +37,7 @@ const MainSelector = (props) => {
</antd.Button>
<antd.Button
onClick={() => app.controls.openLoginForm()}
onClick={() => app.auth.login()}
icon={<Icons.FiLogIn />}
type="primary"
disabled

257
packages/app/src/pages/settings/index.jsx
View File

@ -9,9 +9,7 @@ import { createIconRender } from "@components/Icons"
import useUrlQueryActiveKey from "@hooks/useUrlQueryActiveKey"
import useUserRemoteConfig from "@hooks/useUserRemoteConfig"
import {
composedSettingsByGroups as settings
} from "@/settings"
import { composedSettingsByGroups as settings } from "@/settings"
import menuGroupsDecorators from "@config/settingsMenuGroupsDecorators"
@ -20,147 +18,160 @@ import SettingTab from "./components/SettingTab"
import "./index.less"
const extraMenuItems = [
{
key: "donate",
label: <div style={{
color: "#f72585"
}}>
{createIconRender("FiHeart")}
Support us
</div>,
},
{
key: "logout",
label: <div>
{createIconRender("MdOutlineLogout")}
Logout
</div>,
danger: true,
}
{
key: "donate",
label: (
<div
style={{
color: "#f72585",
}}
>
{createIconRender("FiHeart")}
Support us
</div>
),
},
{
key: "logout",
label: (
<div>
{createIconRender("MdOutlineLogout")}
Logout
</div>
),
danger: true,
},
]
const menuEvents = {
"donate": () => {
app.layout.modal.open("donate", DonativeSelector)
},
"logout": () => {
app.eventBus.emit("app.logout_request")
}
donate: () => {
app.layout.modal.open("donate", DonativeSelector)
},
logout: () => {
app.auth.logout()
},
}
const generateMenuItems = () => {
return settings.map((entry, index) => {
const children = entry.groupModule.map((item) => {
return {
key: item.id,
type: "item",
label: <div {...item.props} className="menu-item-content">
{createIconRender(item.icon ?? "Settings")}
{item.label}
</div>,
danger: item.danger,
disabled: item.disabled,
}
})
return settings.map((entry, index) => {
const children = entry.groupModule.map((item) => {
return {
key: item.id,
type: "item",
label: (
<div {...item.props} className="menu-item-content">
{createIconRender(item.icon ?? "Settings")}
{item.label}
</div>
),
danger: item.danger,
disabled: item.disabled,
}
})
if (index !== settings.length - 1) {
children.push({
type: "divider",
})
}
if (index !== settings.length - 1) {
children.push({
type: "divider",
})
}
return {
key: entry.group,
type: "group",
children: children,
label: entry.group === "bottom" ? null : <>
{
menuGroupsDecorators[entry.group]?.icon && createIconRender(menuGroupsDecorators[groupKey]?.icon ?? "Settings")
}
<Translation>
{
t => t(menuGroupsDecorators[entry.group]?.label ?? entry.group)
}
</Translation>
</>
}
})
return {
key: entry.group,
type: "group",
children: children,
label:
entry.group === "bottom" ? null : (
<>
{menuGroupsDecorators[entry.group]?.icon &&
createIconRender(
menuGroupsDecorators[groupKey]?.icon ??
"Settings",
)}
<Translation>
{(t) =>
t(
menuGroupsDecorators[entry.group]?.label ??
entry.group,
)
}
</Translation>
</>
),
}
})
}
export default () => {
const [config, setConfig, loading] = useUserRemoteConfig()
const [activeKey, setActiveKey] = useUrlQueryActiveKey({
defaultKey: "general",
queryKey: "tab"
})
const [config, setConfig, loading] = useUserRemoteConfig()
const [activeKey, setActiveKey] = useUrlQueryActiveKey({
defaultKey: "general",
queryKey: "tab",
})
const onChangeTab = (event) => {
if (typeof menuEvents[event.key] === "function") {
return menuEvents[event.key]()
}
const onChangeTab = (event) => {
if (typeof menuEvents[event.key] === "function") {
return menuEvents[event.key]()
}
app.cores.sfx.play("settings.navigation")
app.cores.sfx.play("settings.navigation")
setActiveKey(event.key)
}
setActiveKey(event.key)
}
const menuItems = React.useMemo(() => {
const items = generateMenuItems()
const menuItems = React.useMemo(() => {
const items = generateMenuItems()
extraMenuItems.forEach((item) => {
items[settings.length - 1].children.push(item)
})
extraMenuItems.forEach((item) => {
items[settings.length - 1].children.push(item)
})
return items
}, [])
return items
}, [])
function handleOnUpdate(key, value) {
setConfig({
...config,
[key]: value
})
}
function handleOnUpdate(key, value) {
setConfig({
...config,
[key]: value,
})
}
React.useEffect(() => {
if (app.layout.tools_bar) {
app.layout.tools_bar.toggleVisibility(false)
}
}, [activeKey])
React.useEffect(() => {
if (app.layout.tools_bar) {
app.layout.tools_bar.toggleVisibility(false)
}
}, [activeKey])
React.useEffect(() => {
return () => {
if (app.layout.tools_bar) {
app.layout.tools_bar.toggleVisibility(true)
}
}
}, [])
React.useEffect(() => {
return () => {
if (app.layout.tools_bar) {
app.layout.tools_bar.toggleVisibility(true)
}
}
}, [])
return <div className="settings_wrapper">
<div className="settings_menu">
<antd.Menu
mode="vertical"
items={menuItems}
onClick={onChangeTab}
selectedKeys={[activeKey]}
/>
</div>
return (
<div className="settings_wrapper">
<div className="settings_menu">
<antd.Menu
mode="vertical"
items={menuItems}
onClick={onChangeTab}
selectedKeys={[activeKey]}
/>
</div>
{
loading && <antd.Skeleton active />
}
{loading && <antd.Skeleton active />}
<PageTransition
className="settings_content"
key={activeKey}
>
{
!loading && <SettingTab
baseConfig={config}
onUpdate={handleOnUpdate}
activeKey={activeKey}
withGroups
/>
}
</PageTransition>
</div>
<PageTransition className="settings_content" key={activeKey}>
{!loading && (
<SettingTab
baseConfig={config}
onUpdate={handleOnUpdate}
activeKey={activeKey}
withGroups
/>
)}
</PageTransition>
</div>
)
}