Fix linter & type errors

Author: Polleps

browser/.gitignore

@@ -29,11 +29,11 @@ data-browser/coverage
 .DS_Store
 **/.trunk/*
 
-**/tomic-lib-**.tgz
-**/tomic-react-**.tgz
-**/tomic-svelte-**.tgz
-**/tomic-cli-**.tgz
-**/tomic-create-template-**.tgz
+**/tomic-lib**.tgz
+**/tomic-react**.tgz
+**/tomic-svelte**.tgz
+**/tomic-cli**.tgz
+**/tomic-create-template**.tgz
 
 data-browser/src/locales/.wuchale
 data-browser/src/locales/data.js

browser/data-browser/src/components/Toaster.tsx

@@ -2,15 +2,16 @@ import toast, {
   type Toast,
   ToastBar,
   Toaster as ReactHotToast,
+  resolveValue,
   type Renderable,
 } from 'react-hot-toast';
 import { FaCopy, FaTimes } from 'react-icons/fa';
-import { useTheme } from 'styled-components';
+import styled, { useTheme } from 'styled-components';
 import { zIndex } from '../styling';
 import { Row } from './Row';
 import { IconButton } from './IconButton/IconButton';
 
-import type { JSX } from 'react';
+import { useRef, type JSX } from 'react';
 
 /**
  * Makes themed toast notifications available in the Context. Render this
@@ -59,31 +60,28 @@ interface ToastMessageProps {
 }
 
 function ToastMessage({ icon, message, t }: ToastMessageProps) {
-  let text: string;
-
-  if (typeof message === 'string') {
-    text = message;
-  } else if (message && 'props' in message) {
-    // children can technically still be a react node but we never do that in our code so we'll just assume it to be a string.
-    text = message.props.children;
-  } else {
-    text = '';
-  }
+  const textRef = useRef<HTMLDivElement>(null);
 
   function handleCopy() {
+    const text = textRef.current?.textContent;
+
+    if (text === undefined) {
+      toast.error('Nothing to copy.');
+
+      return;
+    }
+
     toast.success('Copied error to clipboard');
     navigator.clipboard.writeText(text);
     toast.dismiss(t.id);
   }
 
-  if (text.length > 100) {
-    text = text.substring(0, 100) + '...';
-  }
-
   return (
-    <Row gap='1ch' center>
+    <StyledRow gap='1ch' center>
       {icon}
-      {text}
+      <div ref={textRef} style={{ display: 'contents' }}>
+        {resolveValue(message, t)}
+      </div>
       {t.type !== 'loading' && (
         <div
           style={{
@@ -101,6 +99,11 @@ function ToastMessage({ icon, message, t }: ToastMessageProps) {
           )}
         </div>
       )}
-    </Row>
+    </StyledRow>
   );
 }
+
+const StyledRow = styled(Row)`
+  max-height: 10rem;
+  overflow-y: auto;
+`;

browser/data-browser/src/helpers/loggingHandlers.tsx

@@ -21,5 +21,6 @@ export function initBugsnag(apiKey: string): BugsnagErrorBoundary {
     autoDetectErrors: !isDev(),
   });
 
+  // @ts-expect-error - BugsnagPluginReact types do not match React 19.2 types.
   return Bugsnag.getPlugin('react')!.createErrorBoundary(React);
 }

browser/data-browser/src/locales/de.po

@@ -3151,3 +3151,7 @@ msgstr "Wähle ein Bild <0/>"
 #: src/chunks/RTE/ImagePicker.tsx
 msgid "Inline"
 msgstr "Fließtext"
+
+#: src/components/Toaster.tsx
+msgid "Nothing to copy."
+msgstr "Nichts zum Kopieren."

browser/data-browser/src/locales/en.po

@@ -3159,3 +3159,7 @@ msgstr "Choose an image <0/>"
 #: src/chunks/RTE/ImagePicker.tsx
 msgid "Inline"
 msgstr "Inline"
+
+#: src/components/Toaster.tsx
+msgid "Nothing to copy."
+msgstr "Nothing to copy."

browser/data-browser/src/locales/es.po

@@ -3129,3 +3129,7 @@ msgstr "Elegir una imagen <0/>"
 #: src/chunks/RTE/ImagePicker.tsx
 msgid "Inline"
 msgstr "En línea"
+
+#: src/components/Toaster.tsx
+msgid "Nothing to copy."
+msgstr "Nada para copiar."

browser/data-browser/src/locales/fr.po

@@ -3148,3 +3148,7 @@ msgstr "Choisir une image <0/>"
 #: src/chunks/RTE/ImagePicker.tsx
 msgid "Inline"
 msgstr "En ligne"
+
+#: src/components/Toaster.tsx
+msgid "Nothing to copy."
+msgstr "Rien à copier."

browser/data-browser/src/routes/PruneTestsRoute.tsx

@@ -40,6 +40,6 @@ const PruneTestsRoute: React.FC = () => {
   );
 };
 
-export const pruneTestRouteLazy = createLazyRoute('/$')({
+export const pruneTestRouteLazy = createLazyRoute('/app/prunetests')({
   component: PruneTestsRoute,
 });

browser/data-browser/src/routes/Router.tsx

@@ -22,6 +22,7 @@ import { LinkOpenRouter } from './LinkOpenRouter';
 const PruneTestsRoute = createRoute({
   getParentRoute: () => appRoute,
   path: pathNames.pruneTests,
+  // @ts-expect-error - Mismatch between unavailable route name and prune route name, not sure how to fix this.
 }).lazy(() => {
   if (isDev()) {
     return import('./PruneTestsRoute').then(mod => mod.pruneTestRouteLazy);
@@ -33,6 +34,7 @@ const PruneTestsRoute = createRoute({
 const SandboxRoute = createRoute({
   getParentRoute: () => appRoute,
   path: pathNames.sandbox,
+  // @ts-expect-error - Mismatch between unavailable route name and sandbox route name, not sure how to fix this.
 }).lazy(() => {
   if (isDev()) {
     return import('./Sandbox').then(mod => mod.sandboxRouteLazy);

browser/data-browser/src/routes/Sandbox.tsx

@@ -15,6 +15,6 @@ function Sandbox(): JSX.Element {
   );
 }
 
-export const sandboxRouteLazy = createLazyRoute('/$')({
+export const sandboxRouteLazy = createLazyRoute('/app/sandbox')({
   component: Sandbox,
 });