fix: simplify result actions and surface feed errors

Author: gildesmarais

frontend/src/components/ResultDisplay.module.css

@@ -17,7 +17,7 @@
 
 .heroName {
   margin: 0;
-  color: var(--sl-color-gray-2);
+  color: var(--app-text-muted);
   font-size: 0.9rem;
 }
 
@@ -41,15 +41,15 @@
   margin: 0;
   font-weight: 500;
   font-size: 0.9rem;
-  color: var(--sl-color-text);
+  color: var(--app-text);
 }
 
 .previewList {
   margin: 0;
   padding-left: 1.1rem;
   display: grid;
   gap: 0.35rem;
-  color: var(--sl-color-text);
+  color: var(--app-text);
 }
 
 .previewList li {
@@ -58,22 +58,18 @@
 
 .previewLoading {
   margin: 0;
-  color: var(--sl-color-text-accent);
+  color: var(--app-text-muted);
   font-size: 0.9rem;
 }
 
 .actionHint {
   margin: -0.2rem 0 0;
-  color: var(--sl-color-gray-2);
+  color: var(--app-text-muted);
   font-size: 0.8rem;
 }
 
 .guestCue {
   margin: 0;
-  color: var(--sl-color-text-accent);
+  color: var(--app-text-muted);
   font-size: 0.85rem;
 }
-
-.footer {
-  justify-self: start;
-}

frontend/src/components/ResultDisplay.tsx

@@ -103,8 +103,13 @@ export function ResultDisplay({
       <div class="panel-meta">
         <span class="panel-meta__primary">{isAuthenticated ? (username ?? '') : ''}</span>
         <span class="panel-meta__actions">
-          <button type="button" class="btn btn--link btn--meta" onClick={onClose}>
-            ← Convert another
+          <button
+            type="button"
+            class="btn btn--link btn--meta"
+            onClick={onClose}
+            aria-label="Convert another website"
+          >
+            ← Convert another website
           </button>
           {isAuthenticated && onLogout && (
             <button type="button" class="btn btn--link btn--meta" onClick={onLogout}>
@@ -166,12 +171,6 @@ export function ResultDisplay({
           )}
         </section>
       )}
-
-      <div class={styles.footer}>
-        <button type="button" class="btn btn--link btn--meta" onClick={onClose}>
-          ← Convert another website
-        </button>
-      </div>
     </section>
   );
 }

frontend/src/hooks/useFeedConversion.ts

@@ -1,20 +1,11 @@
 import { useState } from 'preact/hooks';
 import { createFeed } from '../api/generated';
 import { apiClient, bearerHeaders } from '../api/client';
-
-interface ConversionResult {
-  id: string;
-  name: string;
-  url: string;
-  strategy: string;
-  public_url: string;
-  created_at: string;
-  updated_at: string;
-}
+import type { FeedRecord } from '../api/contracts';
 
 interface ConversionState {
   isConverting: boolean;
-  result: ConversionResult | null;
+  result: FeedRecord | null;
   error: string | null;
 }
 
@@ -48,30 +39,21 @@ export function useFeedConversion() {
           url: url.trim(),
           strategy: strategy.trim(),
         },
+        responseStyle: 'data',
+        throwOnError: true,
       });
 
-      const errorPayload = response.error as { error?: { message?: string } } | undefined;
-      if (response.error) {
-        const networkMessage = response.error instanceof Error ? response.error.message : undefined;
-        throw new Error(networkMessage || errorPayload?.error?.message || 'Request failed');
-      }
-
-      const typed = response.data as {
-        success?: boolean;
-        data?: { feed?: ConversionResult };
-      };
-
-      if (!typed?.success || !typed?.data?.feed) {
+      if (!response?.success || !response.data?.feed) {
         throw new Error('Invalid response format');
       }
 
-      const result = typed.data.feed;
+      const result = response.data.feed;
       setState((prev) => ({ ...prev, isConverting: false, result, error: null }));
     } catch (error) {
       setState((prev) => ({
         ...prev,
         isConverting: false,
-        error: error instanceof Error ? error.message : 'An unexpected error occurred',
+        error: toErrorMessage(error),
         result: null,
       }));
     }
@@ -95,3 +77,20 @@ export function useFeedConversion() {
     clearResult,
   };
 }
+
+const toErrorMessage = (error: unknown): string => {
+  if (error instanceof Error) return error.message;
+  if (typeof error === 'string' && error.trim()) return error;
+
+  const message = extractMessage(error);
+  return message ?? 'An unexpected error occurred';
+};
+
+const extractMessage = (error: unknown): string | null => {
+  if (!error || typeof error !== 'object') return null;
+
+  const candidate = (error as { error?: { message?: unknown }; message?: unknown }).error?.message ??
+    (error as { message?: unknown }).message;
+
+  return typeof candidate === 'string' && candidate.trim() ? candidate : null;
+};