admin: phosphor icons replace hand-drawn svgs and text-character glyphs
Release / guard (push) Successful in 39s
Gates / frontend (push) Failing after 2m25s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / frontend (push) Failing after 1m59s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / test-aarch64 (push) Successful in 8m18s
CI / gates (push) Failing after 11m34s
Gates / test (push) Successful in 2m18s
Gates / test-aarch64 (push) Successful in 7m23s
Release / gates (push) Failing after 18m51s
Release / publish (push) Skipped
Gates / test (push) Successful in 2m36s
Release / guard (push) Successful in 39s
Gates / frontend (push) Failing after 2m25s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / frontend (push) Failing after 1m59s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / test-aarch64 (push) Successful in 8m18s
CI / gates (push) Failing after 11m34s
Gates / test (push) Successful in 2m18s
Gates / test-aarch64 (push) Successful in 7m23s
Release / gates (push) Failing after 18m51s
Release / publish (push) Skipped
Gates / test (push) Successful in 2m36s
health strip marks, menu ticks, chip crosses, the search magnifier, the checkbox check and the back arrows all come from @phosphor-icons/react now, pinned exactly and entered in the license ledger. changelog and version bump for 0.0.15, including the bundle budget raise to 900000 bytes.
This commit is contained in:
@@ -1,4 +1,5 @@
|
||||
import { useState } from "react";
|
||||
import { ArrowLeft } from "@phosphor-icons/react";
|
||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import { Link, useNavigate, useParams } from "@tanstack/react-router";
|
||||
import * as stylex from "@stylexjs/stylex";
|
||||
@@ -13,11 +14,17 @@ import { componentLabel, copyFor } from "./eventCopy";
|
||||
|
||||
const styles = stylex.create({
|
||||
back: {
|
||||
display: "inline-flex",
|
||||
alignItems: "center",
|
||||
gap: "0.25rem",
|
||||
fontSize: "0.875rem",
|
||||
lineHeight: "1.25rem",
|
||||
color: colors.primaryOnSurface,
|
||||
textDecorationLine: "none",
|
||||
},
|
||||
backIcon: {
|
||||
display: "inline-flex",
|
||||
},
|
||||
headingRow: {
|
||||
marginTop: "0.5rem",
|
||||
display: "flex",
|
||||
@@ -105,6 +112,17 @@ const styles = stylex.create({
|
||||
},
|
||||
});
|
||||
|
||||
function BackLink() {
|
||||
return (
|
||||
<Link to="/diagnostics" {...stylex.props(styles.back, shared.focusRing)}>
|
||||
<span aria-hidden="true" {...stylex.props(styles.backIcon)}>
|
||||
<ArrowLeft size={12} />
|
||||
</span>
|
||||
All diagnostics
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
export default function DiagnosticDetailPage() {
|
||||
const { id } = useParams({ from: "/shell/diagnostics/$id" });
|
||||
const eventId = Number(id);
|
||||
@@ -132,9 +150,7 @@ export default function DiagnosticDetailPage() {
|
||||
if (data === undefined) {
|
||||
return (
|
||||
<section>
|
||||
<Link to="/diagnostics" {...stylex.props(styles.back, shared.focusRing)}>
|
||||
← All diagnostics
|
||||
</Link>
|
||||
<BackLink />
|
||||
<InlineError error={error} onRetry={() => void refetch()} />
|
||||
</section>
|
||||
);
|
||||
@@ -146,9 +162,7 @@ export default function DiagnosticDetailPage() {
|
||||
|
||||
return (
|
||||
<section>
|
||||
<Link to="/diagnostics" {...stylex.props(styles.back, shared.focusRing)}>
|
||||
← All diagnostics
|
||||
</Link>
|
||||
<BackLink />
|
||||
<div {...stylex.props(styles.headingRow)}>
|
||||
<h1 {...stylex.props(styles.heading)}>{copy.title}</h1>
|
||||
<SeverityBadge severity={data.severity} />
|
||||
|
||||
Reference in New Issue
Block a user