abner/for-legacy-web
1
0
Fork 1
mirror of https://github.com/stoatchat/for-legacy-web.git synced 2026-03-06 17:11:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(@ui): migrate category / overline and header

Browse Source
This commit is contained in:
Paul Makles
2022-05-30 14:42:09 +01:00
parent 673efc0586
commit 68b9d5ea79
35 changed files with 187 additions and 384 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/settings/ChannelSettings.tsx
View File

@@ -7,8 +7,6 @@ import { Text } from "preact-i18n";
import { useClient } from "../../context/revoltjs/RevoltClient";
import { getChannelName } from "../../context/revoltjs/util";
import Category from "../../components/ui/Category";
import { GenericSettings } from "./GenericSettings";
import Overview from "./channel/Overview";
import Permissions from "./channel/Permissions";

25
src/pages/settings/GenericSettings.tsx
View File

@@ -5,23 +5,15 @@ import { useHistory, useParams } from "react-router-dom";
import styles from "./Settings.module.scss";
import classNames from "classnames";
import { Text } from "preact-i18n";
import {
useCallback,
useContext,
useEffect,
useRef,
useState,
} from "preact/hooks";
import { useCallback, useEffect, useRef, useState } from "preact/hooks";
import { IconButton, LineDivider } from "@revoltchat/ui";
import { Category, Header, IconButton, LineDivider } from "@revoltchat/ui";
import { isTouchscreenDevice } from "../../lib/isTouchscreenDevice";
import { useApplicationState } from "../../mobx/State";
import ButtonItem from "../../components/navigation/items/ButtonItem";
import Category from "../../components/ui/Category";
import Header from "../../components/ui/Header";
import { Children } from "../../types/Preact";
interface Props {
@@ -98,7 +90,7 @@ export function GenericSettings({
/>
</Helmet>
{isTouchscreenDevice && (
<Header placement="primary" transparent>
<Header palette="primary" withTransparency>
{typeof page === "undefined" ? (
<>
{showExitButton && (
@@ -139,10 +131,9 @@ export function GenericSettings({
entry.hidden ? undefined : (
<>
{entry.category && (
<Category
variant="uniform"
text={entry.category}
/>
<Category>
{entry.category}
</Category>
)}
<ButtonItem
active={
@@ -155,7 +146,9 @@ export function GenericSettings({
compact>
{entry.icon} {entry.title}
</ButtonItem>
{entry.divider && <LineDivider />}
{entry.divider && (
<LineDivider compact />
)}
</>
),
)}

1
src/pages/settings/panes/Account.tsx
View File

@@ -220,7 +220,6 @@ export const Account = observer(() => {
description={
"Delete your account, including all of your data. (sends an email to contact@revolt.chat)"
}
hover
action="external">
<Text id="app.settings.pages.account.manage.delete" />
</CategoryButton>

14
src/pages/settings/panes/Audio.tsx
View File

@@ -2,14 +2,14 @@ import styles from "./Panes.module.scss";
import { Text } from "preact-i18n";
import { useEffect, useState } from "preact/hooks";
import { Button, ComboBox, Tip } from "@revoltchat/ui";
import { Button, Category, ComboBox, Tip } from "@revoltchat/ui";
import { stopPropagation } from "../../../lib/stopPropagation";
import { voiceState } from "../../../lib/vortex/VoiceState";
import opusSVG from "../assets/opus_logo.svg";
import { I18nError } from "../../../context/Locale";
import Overline from "../../../components/ui/Overline";
import opusSVG from "../assets/opus_logo.svg";
{
/*import OpusSVG from "../assets/opus_logo.svg";*/
@@ -169,11 +169,9 @@ export function Audio() {
</Button>
)}
{error && error.name === "NotAllowedError" && (
<Overline
error="AudioPermissionBlock"
type="error"
block
/>
<Category>
<I18nError error="AudioPermissionBlock" />
</Category>
)}
</div>
</div>

4
src/pages/settings/server/Members.tsx
View File

@@ -11,6 +11,7 @@ import { useEffect, useMemo, useState } from "preact/hooks";
import {
Button,
Category,
Checkbox,
IconButton,
InputBox,
@@ -19,7 +20,6 @@ import {
import UserIcon from "../../../components/common/user/UserIcon";
import { Username } from "../../../components/common/user/UserShort";
import Overline from "../../../components/ui/Overline";
interface InnerProps {
member: Member;
@@ -51,7 +51,7 @@ const Inner = observer(({ member }: InnerProps) => {
</div>
{open && (
<div className={styles.memberView}>
<Overline type="subtle">Roles</Overline>
<Category>Roles</Category>
{Object.keys(server_roles).map((key) => {
const role = server_roles[key];
return (

18
src/pages/settings/server/Roles.tsx
View File

@@ -13,13 +13,13 @@ import {
Checkbox,
ColourSwatches,
InputBox,
Category,
} from "@revoltchat/ui";
import { useIntermediate } from "../../../context/intermediate/Intermediate";
import { PermissionList } from "../../../components/settings/roles/PermissionList";
import { RoleOrDefault } from "../../../components/settings/roles/RoleSelection";
import Overline from "../../../components/ui/Overline";
interface Props {
server: Server;
@@ -136,9 +136,9 @@ export const Roles = observer(({ server }: Props) => {
{selected !== "default" && (
<>
<section>
<Overline type="subtle">
<Category>
<Text id="app.settings.permissions.role_name" />
</Overline>
</Category>
<p>
<InputBox
value={currentRoleValue.name}
@@ -153,9 +153,9 @@ export const Roles = observer(({ server }: Props) => {
</p>
</section>
<section>
<Overline type="subtle">
<Category>
<Text id="app.settings.permissions.role_colour" />
</Overline>
</Category>
<p>
<ColourSwatches
value={
@@ -169,9 +169,9 @@ export const Roles = observer(({ server }: Props) => {
</p>
</section>
<section>
<Overline type="subtle">
<Category>
<Text id="app.settings.permissions.role_options" />
</Overline>
</Category>
<p>
<Checkbox
value={
@@ -190,9 +190,9 @@ export const Roles = observer(({ server }: Props) => {
</p>
</section>
<section>
<Overline type="subtle">
<Category>
<Text id="app.settings.permissions.role_ranking" />
</Overline>
</Category>
<p>
<InputBox
type="number"