mirror of
https://github.com/revoltchat/revite.git
synced 2024-12-25 23:22:06 -05:00
Remove buttons on Account page.
This commit is contained in:
parent
b648a7b9ac
commit
0aa18d22e9
2 changed files with 38 additions and 26 deletions
|
@ -1,9 +1,10 @@
|
|||
import { ChevronRight } from "@styled-icons/boxicons-regular";
|
||||
import { ChevronRight, LinkExternal } from "@styled-icons/boxicons-regular";
|
||||
import styled, { css } from "styled-components";
|
||||
|
||||
import { Children } from "../../../types/Preact";
|
||||
|
||||
interface BaseProps {
|
||||
readonly disabled?: boolean;
|
||||
readonly largeDescription?: boolean;
|
||||
}
|
||||
|
||||
|
@ -13,6 +14,7 @@ const CategoryBase = styled.div<BaseProps>`
|
|||
border-radius: 6px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
color: var(--foreground);
|
||||
background: var(--secondary-header);
|
||||
|
||||
gap: 12px;
|
||||
|
@ -58,6 +60,15 @@ const CategoryBase = styled.div<BaseProps>`
|
|||
cursor: pointer;
|
||||
}
|
||||
`}
|
||||
|
||||
${(props) =>
|
||||
props.disabled &&
|
||||
css`
|
||||
.content,
|
||||
.action {
|
||||
color: var(--tertiary-foreground);
|
||||
}
|
||||
`}
|
||||
`;
|
||||
|
||||
interface Props extends BaseProps {
|
||||
|
@ -66,7 +77,7 @@ interface Props extends BaseProps {
|
|||
description?: Children;
|
||||
|
||||
onClick?: () => void;
|
||||
action?: "chevron" | Children;
|
||||
action?: "chevron" | "external" | Children;
|
||||
}
|
||||
|
||||
export default function CategoryButton({
|
||||
|
@ -74,11 +85,15 @@ export default function CategoryButton({
|
|||
children,
|
||||
description,
|
||||
largeDescription,
|
||||
disabled,
|
||||
onClick,
|
||||
action,
|
||||
}: Props) {
|
||||
return (
|
||||
<CategoryBase onClick={onClick} largeDescription={largeDescription}>
|
||||
<CategoryBase
|
||||
onClick={onClick}
|
||||
disabled={disabled}
|
||||
largeDescription={largeDescription}>
|
||||
{icon}
|
||||
<div class="content">
|
||||
{children}
|
||||
|
@ -86,7 +101,11 @@ export default function CategoryButton({
|
|||
</div>
|
||||
<div class="action">
|
||||
{typeof action === "string" ? (
|
||||
action === "chevron" ? (
|
||||
<ChevronRight size={24} />
|
||||
) : (
|
||||
<LinkExternal size={24} />
|
||||
)
|
||||
) : (
|
||||
action
|
||||
)}
|
||||
|
|
|
@ -170,11 +170,8 @@ export const Account = observer(() => {
|
|||
.
|
||||
</>
|
||||
}
|
||||
action={
|
||||
<Button accent compact disabled>
|
||||
<Text id="app.settings.pages.account.2fa.add_auth" />
|
||||
</Button>
|
||||
}>
|
||||
disabled
|
||||
action="chevron">
|
||||
Currently not available
|
||||
</CategoryButton>
|
||||
<h3>
|
||||
|
@ -188,25 +185,21 @@ export const Account = observer(() => {
|
|||
description={
|
||||
"Disable your account. You won't be able to access it unless you log back in."
|
||||
}
|
||||
action={
|
||||
<Button accent compact disabled>
|
||||
<Text id="general.unavailable" />
|
||||
</Button>
|
||||
}>
|
||||
disabled
|
||||
action={<Text id="general.unavailable" />}>
|
||||
<Text id="app.settings.pages.account.manage.disable" />
|
||||
</CategoryButton>
|
||||
<a href="mailto:contact@revolt.chat?subject=Delete%20my%20account">
|
||||
<CategoryButton
|
||||
icon={<Trash size={24} color="var(--error)" />}
|
||||
description={"Delete your account, including all of your data."}
|
||||
action={
|
||||
<a href="mailto:contact@revolt.chat?subject=Delete%20my%20account">
|
||||
<Button error compact>
|
||||
<Text id="app.settings.pages.account.manage.delete" />
|
||||
</Button>
|
||||
</a>
|
||||
}>
|
||||
description={
|
||||
"Delete your account, including all of your data."
|
||||
}
|
||||
onClick={() => {}}
|
||||
action="external">
|
||||
<Text id="app.settings.pages.account.manage.delete" />
|
||||
</CategoryButton>
|
||||
</a>
|
||||
<Tip>
|
||||
<span>
|
||||
<Text id="app.settings.tips.account.a" />
|
||||
|
|
Loading…
Reference in a new issue