feat: refactor <TerminalAlerts /> component (#22004)

Quick easy and simple set of changes, with some added flavour. Removes
two use-cases of MUI-based components with our drop-in-place links.
Added a refresh icon to the `Refresh` button and added the external link
icon `➚` to all of the links as they all link out to `/docs` (this is
inline with the rest of the application).

|    |    |
|---|---|
| Old | <img width="1152" height="65" alt="ALERT_1"
src="https://github.com/user-attachments/assets/5e0a0ce3-29ef-4fa1-8793-8aa89d80c661"
/> |
| New | <img width="1152" height="65" alt="ALERT_1_FIX"
src="https://github.com/user-attachments/assets/7be1f0b7-1594-478c-b7c1-6f2288064e13"
/> |

|    |    |
|---|---|
| Old | <img width="1152" height="81" alt="ALERT_2"
src="https://github.com/user-attachments/assets/f8e4d65f-5aa1-408c-9149-0511c8367e3b"
/> |
| New | <img width="1152" height="81" alt="ALERT_2_FIX"
src="https://github.com/user-attachments/assets/230e0754-dd18-40d5-825d-5e5082fe806a"
/> |
This commit is contained in:
Jake Howell
2026-02-10 00:01:48 +11:00
committed by GitHub
parent e8fa04404f
commit 2c0ffdd590
@@ -1,4 +1,3 @@
import Link from "@mui/material/Link";
import type { WorkspaceAgent } from "api/typesGenerated";
import {
Alert,
@@ -6,6 +5,8 @@ import {
type AlertProps,
} from "components/Alert/Alert";
import { Button } from "components/Button/Button";
import { Link } from "components/Link/Link";
import { RefreshCcwIcon } from "lucide-react";
import { type FC, useEffect, useRef, useState } from "react";
import { cn } from "utils/cn";
import { docs } from "utils/docs";
@@ -205,6 +206,7 @@ const RefreshSessionButton: FC = () => {
window.location.reload();
}}
>
<RefreshCcwIcon />
{isRefreshing ? "Refreshing session..." : "Refresh session"}
</Button>
);