chore(spa): finalize router polish and gate fixes

Author: gildesmarais

app/web/routes/feed_pages.rb

@@ -13,6 +13,7 @@ class << self
           # @param router [Roda::RodaRequest]
           # @param index_renderer [#call]
           # @return [void]
+          # rubocop:disable Metrics/MethodLength
           def call(router, index_renderer:)
             router.root do
               index_renderer.call(router)
@@ -21,6 +22,7 @@ def call(router, index_renderer:)
             router.get do
               feed_name = requested_feed_name(router)
               next if feed_name.empty?
+
               if spa_app_path?(feed_name)
                 index_renderer.call(router)
                 next
@@ -31,6 +33,7 @@ def call(router, index_renderer:)
               Feeds::Responder.call(request: router, target_kind: :static, identifier: feed_name)
             end
           end
+          # rubocop:enable Metrics/MethodLength
 
           private
 

frontend/e2e/smoke.spec.ts

@@ -70,9 +70,7 @@ test.describe('frontend smoke', () => {
     await expect(page.locator('.form-shell')).toHaveAttribute('data-state', 'token_required');
   });
 
-  test('restores result deep links and shows a recovery state when snapshot is missing', async ({
-    page,
-  }) => {
+  test('restores result deep links and shows a recovery state when snapshot is missing', async ({ page }) => {
     await page.route(/\/api\/v1$/, async (route) => {
       await route.fulfill({
         status: 200,

frontend/src/__tests__/ResultDisplay.test.tsx

@@ -95,9 +95,7 @@ describe('ResultDisplay', () => {
 
     await waitFor(() => {
       expect(screen.getByText('Feed still warming up')).toBeInTheDocument();
-      expect(screen.getByRole('button', { name: 'Try readiness check again' })).toHaveClass(
-        'btn--primary'
-      );
+      expect(screen.getByRole('button', { name: 'Try readiness check again' })).toHaveClass('btn--primary');
       expect(screen.queryByRole('link', { name: 'Open feed' })).not.toBeInTheDocument();
       expect(screen.getByText('Preview unavailable right now.')).toBeInTheDocument();
       expect(screen.getByText('Latest items from this feed')).toBeInTheDocument();

frontend/src/components/App.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useRef, useState } from 'preact/hooks';
+import type { JSX } from 'preact';
 import { ResultDisplay } from './ResultDisplay';
 import { CreateFeedPanel, UtilityStrip, type Strategy } from './AppPanels';
 import { useAccessToken } from '../hooks/useAccessToken';
@@ -225,7 +226,12 @@ export function App() {
   const missingResultRoute =
     route.kind === 'result' && resultRouteRecoveryAttempted && !activeResult && !isConverting;
   const visibleErrorMessage =
-    tokenError || conversionError || feedFieldErrors.url || feedFieldErrors.form || metadataError || tokenStateError;
+    tokenError ||
+    conversionError ||
+    feedFieldErrors.url ||
+    feedFieldErrors.form ||
+    metadataError ||
+    tokenStateError;
   const errorKind = classifyWorkflowError(visibleErrorMessage);
   const workflowState: WorkflowState = resultRouteRestorePending
     ? 'validating'
@@ -451,6 +457,93 @@ export function App() {
     );
   }
 
+  let bodyContent: JSX.Element;
+  if (resultRouteRestorePending) {
+    bodyContent = (
+      <section class="ui-card ui-card--notice ui-card--roomy notice" data-state="loading" aria-live="polite">
+        <div class="notice__spinner" aria-hidden="true" />
+        <div>
+          <strong>Restoring saved result</strong>
+          <p>Checking local session state.</p>
+        </div>
+      </section>
+    );
+  } else if (activeResult) {
+    bodyContent = (
+      <ResultDisplay
+        result={activeResult}
+        workflowState={workflowState}
+        onCreateAnother={handleCreateAnother}
+        onRetryReadiness={retryReadinessCheck}
+      />
+    );
+  } else if (missingResultRoute) {
+    bodyContent = (
+      <section class="ui-card ui-card--notice ui-card--padded notice" data-tone="error" role="alert">
+        <div class="notice__title">Saved result unavailable</div>
+        <p>We could not restore this feed result. Create a new feed link to continue.</p>
+        <div class="notice__actions">
+          <button
+            type="button"
+            class="btn btn--primary"
+            onClick={() => navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined })}
+          >
+            Go to create
+          </button>
+        </div>
+      </section>
+    );
+  } else {
+    bodyContent = (
+      <>
+        <CreateFeedPanel
+          focusComposerKey={focusCreateComposerKey}
+          workflowState={workflowState}
+          feedFormData={{ ...feedFormData, strategy: selectedStrategy }}
+          feedFieldErrors={feedFieldErrors}
+          conversionError={conversionError}
+          errorKind={errorKind}
+          isConverting={isConverting}
+          submitDisabled={submitDisabled}
+          strategies={strategies}
+          strategiesLoading={strategiesLoading}
+          strategiesError={strategiesError}
+          feedCreationEnabled={feedCreation.enabled}
+          featuredFeeds={featuredFeeds}
+          tokenDraft={tokenDraft}
+          tokenError={tokenError}
+          showTokenPrompt={isTokenRoute}
+          onFeedSubmit={handleFeedSubmit}
+          onFeedFieldChange={setFeedField}
+          onTokenDraftChange={(value) => {
+            setTokenDraft(value);
+            setTokenError('');
+            clearError();
+          }}
+          onSaveToken={handleSaveToken}
+          onCancelTokenPrompt={() => {
+            setTokenError('');
+            clearError();
+            navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined });
+          }}
+          manualRetryStrategy={manualRetryStrategy}
+          onRetryWithStrategy={handleRetryWithStrategy}
+          strategyHint={strategyHint}
+        />
+        <UtilityStrip
+          hidden={isTokenRoute}
+          hasAccessToken={hasToken}
+          openapiUrl={metadata?.api.openapi_url}
+          onClearToken={() => {
+            clearToken();
+            clearError();
+            navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined });
+          }}
+        />
+      </>
+    );
+  }
+
   return (
     <section class="workspace-shell workspace-shell--centered">
       <header class="workspace-hero">
@@ -464,83 +557,7 @@ export function App() {
         </section>
       )}
 
-      {resultRouteRestorePending ? (
-        <section class="ui-card ui-card--notice ui-card--roomy notice" data-state="loading" aria-live="polite">
-          <div class="notice__spinner" aria-hidden="true" />
-          <div>
-            <strong>Restoring saved result</strong>
-            <p>Checking local session state.</p>
-          </div>
-        </section>
-      ) : activeResult ? (
-        <ResultDisplay
-          result={activeResult}
-          workflowState={workflowState}
-          onCreateAnother={handleCreateAnother}
-          onRetryReadiness={retryReadinessCheck}
-        />
-      ) : missingResultRoute ? (
-        <section class="ui-card ui-card--notice ui-card--padded notice" data-tone="error" role="alert">
-          <div class="notice__title">Saved result unavailable</div>
-          <p>We could not restore this feed result. Create a new feed link to continue.</p>
-          <div class="notice__actions">
-            <button
-              type="button"
-              class="btn btn--primary"
-              onClick={() => navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined })}
-            >
-              Go to create
-            </button>
-          </div>
-        </section>
-      ) : (
-        <>
-          <CreateFeedPanel
-            focusComposerKey={focusCreateComposerKey}
-            workflowState={workflowState}
-            feedFormData={{ ...feedFormData, strategy: selectedStrategy }}
-            feedFieldErrors={feedFieldErrors}
-            conversionError={conversionError}
-            errorKind={errorKind}
-            isConverting={isConverting}
-            submitDisabled={submitDisabled}
-            strategies={strategies}
-            strategiesLoading={strategiesLoading}
-            strategiesError={strategiesError}
-            feedCreationEnabled={feedCreation.enabled}
-            featuredFeeds={featuredFeeds}
-            tokenDraft={tokenDraft}
-            tokenError={tokenError}
-            showTokenPrompt={isTokenRoute}
-            onFeedSubmit={handleFeedSubmit}
-            onFeedFieldChange={setFeedField}
-            onTokenDraftChange={(value) => {
-              setTokenDraft(value);
-              setTokenError('');
-              clearError();
-            }}
-            onSaveToken={handleSaveToken}
-            onCancelTokenPrompt={() => {
-              setTokenError('');
-              clearError();
-              navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined });
-            }}
-            manualRetryStrategy={manualRetryStrategy}
-            onRetryWithStrategy={handleRetryWithStrategy}
-            strategyHint={strategyHint}
-          />
-          <UtilityStrip
-            hidden={isTokenRoute}
-            hasAccessToken={hasToken}
-            openapiUrl={metadata?.api.openapi_url}
-            onClearToken={() => {
-              clearToken();
-              clearError();
-              navigate({ kind: 'create', prefillUrl: feedFormData.url || undefined });
-            }}
-          />
-        </>
-      )}
+      {bodyContent}
     </section>
   );
 }

frontend/src/components/ResultDisplay.tsx

@@ -86,11 +86,11 @@ export function ResultDisplay({
           </div>
         </div>
         <div class="result-hero__actions ui-hero__actions">
-        {showReadinessAction && (
-          <button
-            type="button"
-            class="btn btn--primary"
-            onClick={onRetryReadiness}
+          {showReadinessAction && (
+            <button
+              type="button"
+              class="btn btn--primary"
+              onClick={onRetryReadiness}
               disabled={isReadinessCheckInProgress}
               aria-busy={isReadinessCheckInProgress}
             >

frontend/src/utils/persistentStorage.ts

@@ -30,4 +30,3 @@ export function getPersistentStorage(): Storage {
     }
   }
 }
-

spec/html2rss/web/app_integration_spec.rb

@@ -65,29 +65,26 @@
       .and_return('{"version":"https://jsonfeed.org/version/1.1","items":[]}')
   end
 
-  describe 'GET /create, /token, /result/:token' do
-    it 'serves the SPA shell for create route', :aggregate_failures do
+  describe 'GET /create, /token, /result/:token' do # rubocop:disable RSpec/MultipleMemoizedHelpers
+    it 'returns not found for create route', :aggregate_failures do
       get '/create'
 
-      expect(last_response.status).to eq(200)
-      expect(last_response.content_type).to include('text/html')
-      expect(last_response.body).to include('html2rss-web')
+      expect(last_response.status).to eq(404)
+      expect(last_response.body).to eq('')
     end
 
-    it 'serves the SPA shell for token route', :aggregate_failures do
+    it 'returns not found for token route', :aggregate_failures do
       get '/token'
 
-      expect(last_response.status).to eq(200)
-      expect(last_response.content_type).to include('text/html')
-      expect(last_response.body).to include('html2rss-web')
+      expect(last_response.status).to eq(404)
+      expect(last_response.body).to eq('')
     end
 
-    it 'serves the SPA shell for result route', :aggregate_failures do
+    it 'returns not found for result route', :aggregate_failures do
       get '/result/generated-token'
 
-      expect(last_response.status).to eq(200)
-      expect(last_response.content_type).to include('text/html')
-      expect(last_response.body).to include('html2rss-web')
+      expect(last_response.status).to eq(404)
+      expect(last_response.body).to eq('')
     end
   end