letro/letro-authentication-service
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Update the compound design tokens, replace the error icon with error-solid

Browse Source
This commit is contained in:
Quentin Gliech
2025-02-21 15:25:06 +01:00
parent d9b4fbe24d
commit 98f45666d7
15 changed files with 315 additions and 569 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/package-lock.json generated
View File

@@ -14,7 +14,7 @@
"@radix-ui/react-dialog": "^1.1.6",
"@tanstack/react-query": "^5.66.9",
"@tanstack/react-router": "^1.109.2",
"@vector-im/compound-design-tokens": "3.0.1",
"@vector-im/compound-design-tokens": "4.0.0",
"@vector-im/compound-web": "^7.6.3",
"@zxcvbn-ts/core": "^3.0.4",
"@zxcvbn-ts/language-common": "^3.0.4",
@@ -5924,10 +5924,10 @@
}
},
"node_modules/@vector-im/compound-design-tokens": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/@vector-im/compound-design-tokens/-/compound-design-tokens-3.0.1.tgz",
"integrity": "sha512-uwpMteMxfX1xRKM5xe6IcuHAGMWYFHAD/R0ANia6JYnP2Q2ytlqUDDFa/nqNqMLYdVytbZs3bJtOfuJxmUJfgg==",
"license": "Apache-2.0",
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/@vector-im/compound-design-tokens/-/compound-design-tokens-4.0.0.tgz",
"integrity": "sha512-hFfLSKrGc58rPRp9JH1mkgw3moFEgpL8RQzyDESHErq7P1lUmlIuwKFTVfK5SbdFM5GvHp7nQaFpVmxUQ3Xp+w==",
"license": "SEE LICENSE IN README.md",
"peerDependencies": {
"@types/react": "*",
"react": "^17 || ^18 || ^19.0.0"

2
frontend/package.json
View File

@@ -24,7 +24,7 @@
"@radix-ui/react-dialog": "^1.1.6",
"@tanstack/react-query": "^5.66.9",
"@tanstack/react-router": "^1.109.2",
"@vector-im/compound-design-tokens": "3.0.1",
"@vector-im/compound-design-tokens": "4.0.0",
"@vector-im/compound-web": "^7.6.3",
"@zxcvbn-ts/core": "^3.0.4",
"@zxcvbn-ts/language-common": "^3.0.4",

4
frontend/src/components/GenericError.tsx
View File

@@ -4,7 +4,7 @@
// SPDX-License-Identifier: AGPL-3.0-only
// Please see LICENSE in the repository root for full details.
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import { Button } from "@vector-im/compound-web";
import { useState } from "react";
import { Translation } from "react-i18next";
@@ -22,7 +22,7 @@ const GenericError: React.FC<{ error: unknown; dontSuspend?: boolean }> = ({
<div className="flex flex-col gap-6">
<PageHeading
invalid
Icon={IconError}
Icon={IconErrorSolid}
title={t("frontend.error.title", {
defaultValue: "Something went wrong",
})}

8
frontend/src/components/SessionDetail/SessionInfo.tsx
View File

@@ -5,7 +5,7 @@
import IconChat from "@vector-im/compound-design-tokens/assets/web/icons/chat";
import IconComputer from "@vector-im/compound-design-tokens/assets/web/icons/computer";
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import IconInfo from "@vector-im/compound-design-tokens/assets/web/icons/info";
import IconSend from "@vector-im/compound-design-tokens/assets/web/icons/send";
import IconUserProfile from "@vector-im/compound-design-tokens/assets/web/icons/user-profile";
@@ -68,7 +68,7 @@ export const ScopeSendMessages: React.FC = () => {
const ScopeSynapseAdmin: React.FC = () => {
const { t } = useTranslation();
return (
<VisualListItem Icon={IconError}>
<VisualListItem Icon={IconErrorSolid}>
{t("mas.scope.synapse_admin")}
</VisualListItem>
);
@@ -77,7 +77,9 @@ const ScopeSynapseAdmin: React.FC = () => {
const ScopeMasAdmin: React.FC = () => {
const { t } = useTranslation();
return (
<VisualListItem Icon={IconError}>{t("mas.scope.mas_admin")}</VisualListItem>
<VisualListItem Icon={IconErrorSolid}>
{t("mas.scope.mas_admin")}
</VisualListItem>
);
};

4
frontend/src/routes/emails.$id.in-use.tsx
View File

@@ -6,7 +6,7 @@
import { useSuspenseQuery } from "@tanstack/react-query";
import { createFileRoute, notFound, redirect } from "@tanstack/react-router";
import IconArrowLeft from "@vector-im/compound-design-tokens/assets/web/icons/arrow-left";
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import { useTranslation } from "react-i18next";
import { ButtonLink } from "../components/ButtonLink";
import Layout from "../components/Layout";
@@ -41,7 +41,7 @@ function EmailInUse(): React.ReactElement {
return (
<Layout>
<PageHeading
Icon={IconError}
Icon={IconErrorSolid}
invalid
title={t("frontend.email_in_use.heading", {
email: userEmailAuthentication.email,

6
frontend/src/routes/password.recovery.index.lazy.tsx
View File

@@ -11,7 +11,7 @@ import {
useNavigate,
useSearch,
} from "@tanstack/react-router";
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import IconLockSolid from "@vector-im/compound-design-tokens/assets/web/icons/lock-solid";
import { Alert, Button, Form } from "@vector-im/compound-web";
import type { FormEvent } from "react";
@@ -63,7 +63,7 @@ const EmailConsumed: React.FC = () => {
return (
<Layout>
<PageHeading
Icon={IconError}
Icon={IconErrorSolid}
title={t("frontend.password_reset.consumed.title")}
subtitle={t("frontend.password_reset.consumed.subtitle")}
invalid
@@ -117,7 +117,7 @@ const EmailExpired: React.FC<{
return (
<Layout>
<PageHeading
Icon={IconError}
Icon={IconErrorSolid}
title={t("frontend.password_reset.expired.title")}
subtitle={t("frontend.password_reset.expired.subtitle", {
email: userRecoveryTicket.email,

4
frontend/src/routes/reset-cross-signing.index.tsx
View File

@@ -11,7 +11,7 @@ import {
} from "@tanstack/react-query";
import { createFileRoute, notFound } from "@tanstack/react-router";
import IconCheck from "@vector-im/compound-design-tokens/assets/web/icons/check";
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import IconInfo from "@vector-im/compound-design-tokens/assets/web/icons/info";
import {
Button,
@@ -114,7 +114,7 @@ function ResetCrossSigning(): React.ReactNode {
return (
<>
<PageHeading
Icon={IconError}
Icon={IconErrorSolid}
title={t("frontend.reset_cross_signing.heading")}
invalid
/>

4
frontend/src/routes/reset-cross-signing.tsx
View File

@@ -8,7 +8,7 @@ import {
Outlet,
createFileRoute,
} from "@tanstack/react-router";
import IconError from "@vector-im/compound-design-tokens/assets/web/icons/error";
import IconErrorSolid from "@vector-im/compound-design-tokens/assets/web/icons/error-solid";
import { Button, Text } from "@vector-im/compound-web";
import * as v from "valibot";
@@ -37,7 +37,7 @@ function ResetCrossSigningError({
return (
<Layout>
<PageHeading
Icon={IconError}
Icon={IconErrorSolid}
title={t("frontend.reset_cross_signing.failure.heading")}
invalid
/>

828
templates/components/icon.html
View File

File diff suppressed because it is too large Load Diff

4
templates/components/scope.html
View File

@@ -18,9 +18,9 @@ Please see LICENSE in the repository root for full details.
<li>{{ icon.chat() }}<p>{{ _("mas.scope.view_messages") }}</p></li>
<li>{{ icon.send() }}<p>{{ _("mas.scope.send_messages") }}</p></li>
{% elif scope == "urn:synapse:admin:*" %}
<li>{{ icon.error() }}<p>{{ _("mas.scope.synapse_admin") }}</p></li>
<li>{{ icon.error_solid() }}<p>{{ _("mas.scope.synapse_admin") }}</p></li>
{% elif scope == "urn:mas:admin" %}
<li>{{ icon.error() }}<p>{{ _("mas.scope.mas_admin") }}</p></li>
<li>{{ icon.error_solid() }}<p>{{ _("mas.scope.mas_admin") }}</p></li>
{% elif scope is startingwith("urn:matrix:org.matrix.msc2967.client:device:") %}
{# We hide this scope #}
{% else %}

2
templates/pages/error.html
View File

@@ -15,7 +15,7 @@ Please see LICENSE in the repository root for full details.
<main class="flex flex-col gap-6">
<header class="page-heading">
<div class="icon invalid">
{{ icon.error() }}
{{ icon.error_solid() }}
</div>
<div class="header">

2
templates/pages/policy_violation.html
View File

@@ -11,7 +11,7 @@ Please see LICENSE in the repository root for full details.
{% block content %}
<header class="page-heading">
<div class="icon invalid">
{{ icon.error() }}
{{ icon.error_solid() }}
</div>
<div class="header">

2
templates/pages/recovery/consumed.html
View File

@@ -11,7 +11,7 @@ Please see LICENSE in the repository root for full details.
{% block content %}
<header class="page-heading">
<div class="icon invalid">
{{ icon.error() }}
{{ icon.error_solid() }}
</div>
<div class="header">

2
templates/pages/recovery/expired.html
View File

@@ -11,7 +11,7 @@ Please see LICENSE in the repository root for full details.
{% block content %}
<header class="page-heading">
<div class="icon invalid">
{{ icon.error() }}
{{ icon.error_solid() }}
</div>
<div class="header">

2
templates/pages/register/steps/email_in_use.html
View File

@@ -11,7 +11,7 @@ Please see LICENSE in the repository root for full details.
<main class="flex flex-col gap-6">
<header class="page-heading">
<div class="icon invalid">
{{ icon.error() }}
{{ icon.error_solid() }}
</div>
<div class="header">