@semiont/react-ui 0.5.6 → 0.5.8

package/src/features/admin-exchange/__tests__/AdminExchangePage.test.tsx

@@ -45,16 +45,12 @@ const createProps = (overrides?: Partial<AdminExchangePageProps>): AdminExchange
     },
     progress: {
       phaseStarted: 'Starting…',
-      phaseEntityTypes: 'Entity types…',
-      phaseResources: 'Resources…',
-      phaseAnnotations: 'Annotations…',
       phaseComplete: 'Complete',
       phaseError: 'Failed',
-      hashChainValid: 'Hash valid',
-      hashChainInvalid: 'Hash invalid',
-      streams: 'Streams',
-      events: 'Events',
-      blobs: 'Blobs',
+      statsEventsReplayed: 'Events replayed',
+      statsResourcesCreated: 'Resources created',
+      statsAnnotationsCreated: 'Annotations created',
+      statsEntityTypesAdded: 'Entity types added',
     },
   },
   ToolbarPanels: () => <div data-testid="toolbar-panels" />,
@@ -100,10 +96,11 @@ describe('AdminExchangePage', () => {
   it('renders ImportProgress with backup result on completion', () => {
     render(<AdminExchangePage {...createProps({
       importPhase: 'complete',
-      importResult: { stats: { streams: 5, events: 42, blobs: 3 }, hashChainValid: true },
+      importResult: { stats: { eventsReplayed: 42, resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 } },
     })} />);
     expect(screen.getByText('Complete')).toBeInTheDocument();
-    expect(screen.getByText('5')).toBeInTheDocument();
+    expect(screen.getByText('42')).toBeInTheDocument();
+    expect(screen.getByText('Events replayed')).toBeInTheDocument();
   });
 
   it('applies panel-open class when common panel is active', () => {

package/src/features/admin-exchange/__tests__/ImportProgress.test.tsx

@@ -9,16 +9,12 @@ import type { ImportProgressProps } from '../components/ImportProgress';
 
 const translations: ImportProgressProps['translations'] = {
   phaseStarted: 'Starting restore…',
-  phaseEntityTypes: 'Adding entity types…',
-  phaseResources: 'Creating resources…',
-  phaseAnnotations: 'Creating annotations…',
   phaseComplete: 'Restore complete',
   phaseError: 'Restore failed',
-  hashChainValid: 'Hash chain valid',
-  hashChainInvalid: 'Hash chain invalid',
-  streams: 'Event streams',
-  events: 'Events',
-  blobs: 'Content blobs',
+  statsEventsReplayed: 'Events replayed',
+  statsResourcesCreated: 'Resources created',
+  statsAnnotationsCreated: 'Annotations created',
+  statsEntityTypesAdded: 'Entity types added',
 };
 
 describe('ImportProgress', () => {
@@ -33,8 +29,8 @@ describe('ImportProgress', () => {
   });
 
   it('renders message during active phases', () => {
-    render(<ImportProgress phase="resources" message="Processing resource 3/10" translations={translations} />);
-    expect(screen.getByText('Processing resource 3/10')).toBeInTheDocument();
+    render(<ImportProgress phase="started" message="Restoring backup..." translations={translations} />);
+    expect(screen.getByText('Restoring backup...')).toBeInTheDocument();
   });
 
   it('does not render message during complete phase', () => {
@@ -61,44 +57,59 @@ describe('ImportProgress', () => {
     expect(screen.getByText('Connection failed')).toBeInTheDocument();
   });
 
-  it('renders backup result stats', () => {
+  it('renders backup restore stats nested under result.stats', () => {
     render(<ImportProgress
       phase="complete"
-      result={{ stats: { streams: 5, events: 42, blobs: 3 } }}
+      result={{ stats: { eventsReplayed: 42, resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 } }}
       translations={translations}
     />);
-    expect(screen.getByText('5')).toBeInTheDocument();
-    expect(screen.getByText('Event streams')).toBeInTheDocument();
     expect(screen.getByText('42')).toBeInTheDocument();
-    expect(screen.getByText('Events')).toBeInTheDocument();
+    expect(screen.getByText('Events replayed')).toBeInTheDocument();
+    expect(screen.getByText('5')).toBeInTheDocument();
+    expect(screen.getByText('Resources created')).toBeInTheDocument();
+    expect(screen.getByText('12')).toBeInTheDocument();
+    expect(screen.getByText('Annotations created')).toBeInTheDocument();
     expect(screen.getByText('3')).toBeInTheDocument();
-    expect(screen.getByText('Content blobs')).toBeInTheDocument();
+    expect(screen.getByText('Entity types added')).toBeInTheDocument();
   });
 
-  it('renders valid hash chain badge', () => {
-    const { container } = render(<ImportProgress
+  it('renders linked-data import stats nested under result.stats', () => {
+    render(<ImportProgress
       phase="complete"
-      result={{ hashChainValid: true }}
+      result={{ stats: { resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 } }}
       translations={translations}
     />);
-    expect(screen.getByText('Hash chain valid')).toBeInTheDocument();
-    expect(container.querySelector('.semiont-exchange__hash-badge--valid')).toBeInTheDocument();
+    expect(screen.getByText('5')).toBeInTheDocument();
+    expect(screen.getByText('Resources created')).toBeInTheDocument();
+    expect(screen.getByText('12')).toBeInTheDocument();
+    expect(screen.getByText('Annotations created')).toBeInTheDocument();
+    expect(screen.getByText('3')).toBeInTheDocument();
+    expect(screen.getByText('Entity types added')).toBeInTheDocument();
   });
 
-  it('renders invalid hash chain badge', () => {
+  it('does not render result section when result lacks a stats object', () => {
     const { container } = render(<ImportProgress
       phase="complete"
-      result={{ hashChainValid: false }}
+      result={{ resourcesCreated: 5 }}
+      translations={translations}
+    />);
+    expect(container.querySelector('.semiont-exchange__result')).not.toBeInTheDocument();
+  });
+
+  it('renders raw key for unknown stats', () => {
+    render(<ImportProgress
+      phase="complete"
+      result={{ stats: { somethingNew: 7 } }}
       translations={translations}
     />);
-    expect(screen.getByText('Hash chain invalid')).toBeInTheDocument();
-    expect(container.querySelector('.semiont-exchange__hash-badge--invalid')).toBeInTheDocument();
+    expect(screen.getByText('7')).toBeInTheDocument();
+    expect(screen.getByText('somethingNew')).toBeInTheDocument();
   });
 
   it('does not render result section during non-complete phases', () => {
     const { container } = render(<ImportProgress
-      phase="resources"
-      result={{ stats: { streams: 1, events: 5, blobs: 0 } }}
+      phase="started"
+      result={{ stats: { eventsReplayed: 42, resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 } }}
       translations={translations}
     />);
     expect(container.querySelector('.semiont-exchange__result')).not.toBeInTheDocument();

package/src/features/admin-exchange/components/ImportProgress.tsx

@@ -6,16 +6,12 @@
 
 export interface ImportProgressTranslations {
   phaseStarted: string;
-  phaseEntityTypes: string;
-  phaseResources: string;
-  phaseAnnotations: string;
   phaseComplete: string;
   phaseError: string;
-  hashChainValid: string;
-  hashChainInvalid: string;
-  streams: string;
-  events: string;
-  blobs: string;
+  statsEventsReplayed: string;
+  statsResourcesCreated: string;
+  statsAnnotationsCreated: string;
+  statsEntityTypesAdded: string;
 }
 
 export interface ImportProgressProps {
@@ -27,13 +23,17 @@ export interface ImportProgressProps {
 
 const PHASE_LABELS: Record<string, keyof ImportProgressTranslations> = {
   started: 'phaseStarted',
-  'entity-types': 'phaseEntityTypes',
-  resources: 'phaseResources',
-  annotations: 'phaseAnnotations',
   complete: 'phaseComplete',
   error: 'phaseError',
 };
 
+const STAT_LABELS: Record<string, keyof ImportProgressTranslations> = {
+  eventsReplayed: 'statsEventsReplayed',
+  resourcesCreated: 'statsResourcesCreated',
+  annotationsCreated: 'statsAnnotationsCreated',
+  entityTypesAdded: 'statsEntityTypesAdded',
+};
+
 export function ImportProgress({ phase, message, result, translations: t }: ImportProgressProps) {
   const labelKey = PHASE_LABELS[phase];
   const phaseLabel = labelKey ? t[labelKey] : phase;
@@ -41,6 +41,13 @@ export function ImportProgress({ phase, message, result, translations: t }: Impo
   const isComplete = phase === 'complete';
   const isError = phase === 'error';
 
+  const stats = result?.stats != null && typeof result.stats === 'object'
+    ? (result.stats as Record<string, unknown>)
+    : undefined;
+  const statEntries = stats
+    ? Object.entries(stats).filter((entry): entry is [string, number] => typeof entry[1] === 'number')
+    : [];
+
   return (
     <div className="semiont-exchange__progress">
       <div className={`semiont-exchange__phase-label${isError ? ' semiont-exchange__phase-label--error' : isComplete ? ' semiont-exchange__phase-label--complete' : ''}`}>
@@ -51,30 +58,17 @@ export function ImportProgress({ phase, message, result, translations: t }: Impo
         <p className="semiont-exchange__progress-message">{message}</p>
       )}
 
-      {isComplete && result && (
+      {isComplete && statEntries.length > 0 && (
         <div className="semiont-exchange__result">
-          {result.stats != null && typeof result.stats === 'object' && (
-            <>
-              {Object.entries(result.stats as Record<string, number>).map(([key, value]) => {
-                const label = key === 'streams' ? t.streams
-                  : key === 'events' ? t.events
-                  : key === 'blobs' ? t.blobs
-                  : key;
-                return (
-                  <div key={key} className="semiont-exchange__result-stat">
-                    <span className="semiont-exchange__result-value">{value}</span>
-                    <span className="semiont-exchange__result-label">{label}</span>
-                  </div>
-                );
-              })}
-            </>
-          )}
-
-          {result.hashChainValid !== undefined && (
-            <div className={`semiont-exchange__hash-badge${result.hashChainValid ? ' semiont-exchange__hash-badge--valid' : ' semiont-exchange__hash-badge--invalid'}`}>
-              {result.hashChainValid ? t.hashChainValid : t.hashChainInvalid}
-            </div>
-          )}
+          {statEntries.map(([key, value]) => {
+            const statKey = STAT_LABELS[key];
+            return (
+              <div key={key} className="semiont-exchange__result-stat">
+                <span className="semiont-exchange__result-value">{value}</span>
+                <span className="semiont-exchange__result-label">{statKey ? t[statKey] : key}</span>
+              </div>
+            );
+          })}
         </div>
       )}
 

package/src/features/moderation-linked-data/__tests__/LinkedDataPage.test.tsx

@@ -45,16 +45,12 @@ const createProps = (overrides?: Partial<LinkedDataPageProps>): LinkedDataPagePr
     },
     progress: {
       phaseStarted: 'Starting…',
-      phaseEntityTypes: 'Entity types…',
-      phaseResources: 'Resources…',
-      phaseAnnotations: 'Annotations…',
       phaseComplete: 'Complete',
       phaseError: 'Failed',
-      hashChainValid: 'Verified',
-      hashChainInvalid: 'Verification failed',
-      streams: 'Resources',
-      events: 'Annotations',
-      blobs: 'Entity types',
+      statsEventsReplayed: 'Events replayed',
+      statsResourcesCreated: 'Resources created',
+      statsAnnotationsCreated: 'Annotations created',
+      statsEntityTypesAdded: 'Entity types added',
     },
   },
   ToolbarPanels: () => <div data-testid="toolbar-panels" />,
@@ -100,9 +96,15 @@ describe('LinkedDataPage', () => {
   it('renders ImportProgress with result on completion', () => {
     render(<LinkedDataPage {...createProps({
       importPhase: 'complete',
-      importResult: { resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 },
+      importResult: { stats: { resourcesCreated: 5, annotationsCreated: 12, entityTypesAdded: 3 } },
     })} />);
     expect(screen.getByText('Complete')).toBeInTheDocument();
+    expect(screen.getByText('5')).toBeInTheDocument();
+    expect(screen.getByText('Resources created')).toBeInTheDocument();
+    expect(screen.getByText('12')).toBeInTheDocument();
+    expect(screen.getByText('Annotations created')).toBeInTheDocument();
+    expect(screen.getByText('3')).toBeInTheDocument();
+    expect(screen.getByText('Entity types added')).toBeInTheDocument();
   });
 
   it('applies panel-open class when common panel is active', () => {

package/src/features/resource-compose/components/ResourceComposePage.tsx

@@ -8,7 +8,7 @@
 
 import React, { useState, useEffect } from 'react';
 import type { GatheredContext } from '@semiont/core';
-import { isImageMimeType, isPdfMimeType, LOCALES } from '@semiont/core';
+import { capabilitiesOf, AUTHORABLE_MEDIA_TYPES, MEDIA_TYPES, mediaTypeForExtension, isSupportedMediaType, LOCALES } from '@semiont/core';
 import type { UploadProgress } from '@semiont/sdk';
 import { type CloneData, type ReferenceData } from '../state/compose-page-state-unit';
 import { COMMON_PANELS, type ToolbarPanelType } from '../../../state/shell-state-unit';
@@ -17,6 +17,29 @@ import { CodeMirrorRenderer } from '../../../components/CodeMirrorRenderer';
 import { useFormAnnouncements } from '../../../components/LiveRegion';
 import { UploadProgressBar } from './UploadProgressBar';
 
+/**
+ * Big tent: every registry type is uploadable. The `accept` hint lists all
+ * known extensions — it's only a hint; `handleFileUpload` never rejects.
+ */
+const UPLOAD_ACCEPT = Object.values(MEDIA_TYPES).map((c) => c.extension).join(',');
+
+/**
+ * Detection chain for uploaded files (same spirit as the CLI):
+ * 1. the browser's `file.type`, if it names a registry member;
+ * 2. otherwise the filename extension (`file.type` is routinely empty for
+ *    `.md` and friends);
+ * 3. otherwise `application/octet-stream` — itself a registry member, so
+ *    under the big tent every file is uploadable.
+ */
+function detectUploadMediaType(file: File): string {
+  if (file.type && isSupportedMediaType(file.type)) return file.type;
+  if (file.name.includes('.')) {
+    const byExt = mediaTypeForExtension(file.name.slice(file.name.lastIndexOf('.')));
+    if (byExt) return byExt;
+  }
+  return 'application/octet-stream';
+}
+
 export interface ResourceComposePageProps {
   mode: 'new' | 'clone' | 'reference';
   cloneData?: CloneData | null;
@@ -170,8 +193,9 @@ export function ResourceComposePage({
     const file = e.target.files?.[0];
     if (!file) return;
 
+    const detectedMediaType = detectUploadMediaType(file);
     setUploadedFile(file);
-    setFileMimeType(file.type);
+    setFileMimeType(detectedMediaType);
     setInputMethod('upload');
 
     // Set file name as default resource name if empty
@@ -180,8 +204,9 @@ export function ResourceComposePage({
       setNewResourceName(nameWithoutExt);
     }
 
-    // For images and PDFs, create preview URL
-    if (isImageMimeType(file.type) || isPdfMimeType(file.type)) {
+    // Images and PDFs get an object-URL preview; everything else reads as text.
+    const detectedRender = capabilitiesOf(detectedMediaType)?.render;
+    if (detectedRender === 'image' || detectedRender === 'pdf') {
       const previewUrl = URL.createObjectURL(file);
       setFilePreviewUrl(previewUrl);
     } else {
@@ -521,7 +546,7 @@ export function ResourceComposePage({
                     <div className="semiont-form__upload-area">
                       <input
                         type="file"
-                        accept="text/plain,text/markdown,image/png,image/jpeg,application/pdf"
+                        accept={UPLOAD_ACCEPT}
                         onChange={handleFileUpload}
                         className="semiont-form__upload-input"
                         disabled={isCreating}
@@ -563,7 +588,7 @@ export function ResourceComposePage({
               )}
 
               {/* Image Preview */}
-              {uploadedFile && filePreviewUrl && isImageMimeType(fileMimeType) && (
+              {uploadedFile && filePreviewUrl && capabilitiesOf(fileMimeType)?.render === 'image' && (
                 <div className="semiont-form__image-preview">
                   <p className="semiont-form__image-preview-label">Preview:</p>
                   <div className="semiont-form__image-preview-container">
@@ -594,9 +619,11 @@ export function ResourceComposePage({
                     disabled={isCreating}
                     className="semiont-select"
                   >
-                    <option value="text/markdown">Markdown (text/markdown)</option>
-                    <option value="text/plain">Plain Text (text/plain)</option>
-                    <option value="text/html">HTML (text/html)</option>
+                    {AUTHORABLE_MEDIA_TYPES.map((mt) => (
+                      <option key={mt} value={mt}>
+                        {capabilitiesOf(mt)?.label ?? mt} ({mt})
+                      </option>
+                    ))}
                   </select>
                 </div>
               )}

package/src/features/resource-compose/state/compose-page-state-unit.ts

@@ -1,11 +1,11 @@
 import { BehaviorSubject, type Observable, map } from 'rxjs';
-import type { GatheredContext, AnnotationId, ContentFormat, AccessToken, ResourceDescriptor, ResourceId } from '@semiont/core';
+import type { GatheredContext, AnnotationId, AccessToken, ResourceDescriptor, ResourceId } from '@semiont/core';
 import { resourceId as makeResourceId, annotationId as makeAnnotationId } from '@semiont/core';
 import { createDisposer } from '@semiont/sdk';
 import type { StateUnit } from '@semiont/sdk';
 import type { ShellStateUnit } from '../../../state/shell-state-unit';
 import type { SemiontClient } from '@semiont/sdk';
-import { getPrimaryMediaType, decodeWithCharset } from '@semiont/core';
+import { decodeWithCharset, extensionForMediaType } from '@semiont/core';
 import type { UploadProgress } from '@semiont/sdk';
 
 export type ComposeMode = 'new' | 'clone' | 'reference';
@@ -108,11 +108,8 @@ export function createComposePageStateUnit(
         const tokenResult = await client.yield.fromToken(params.token!);
         if (tokenResult && auth) {
           const rId = makeResourceId(tokenResult['@id']);
-          const mediaType = getPrimaryMediaType(tokenResult) || 'text/plain';
-          const { data } = await client.browse.resourceRepresentation(rId, {
-            accept: mediaType as ContentFormat,
-          });
-          const content = decodeWithCharset(data, mediaType);
+          const { data, contentType } = await client.browse.resourceRepresentation(rId);
+          const content = decodeWithCharset(data, contentType);
           cloneData$.next({ sourceResource: tokenResult, sourceContent: content });
         }
       } catch {
@@ -143,7 +140,7 @@ export function createComposePageStateUnit(
       mimeType = saveParams.format ?? 'application/octet-stream';
     } else {
       const blob = new Blob([saveParams.content || ''], { type: saveParams.format ?? 'application/octet-stream' });
-      const extension = saveParams.format === 'text/plain' ? '.txt' : saveParams.format === 'text/html' ? '.html' : '.md';
+      const extension = extensionForMediaType(saveParams.format ?? 'application/octet-stream');
       fileToUpload = new File([blob], saveParams.name + extension, { type: saveParams.format ?? 'application/octet-stream' });
       mimeType = saveParams.format ?? 'application/octet-stream';
     }

package/src/features/resource-viewer/components/ResourceViewerPage.tsx

@@ -9,8 +9,7 @@ import React, { useState, useEffect, useCallback } from 'react';
 import type { components, ResourceDescriptor, ResourceId, GatheredContext, EventMap } from '@semiont/core';
 import type { ConnectionState } from '@semiont/core';
 import { annotationId } from '@semiont/core';
-import { getLanguage, getPrimaryRepresentation, getPrimaryMediaType } from '@semiont/core';
-import { getMimeCategory } from '@semiont/core';
+import { getLanguage, getPrimaryRepresentation, getPrimaryMediaType, capabilitiesOf } from '@semiont/core';
 import { ANNOTATORS } from '@semiont/react-ui';
 import { ErrorBoundary } from '@semiont/react-ui';
 import { AnnotationHistory } from '@semiont/react-ui';
@@ -141,9 +140,12 @@ export function ResourceViewerPage({
   const { hoverDelayMs } = useHoverDelay();
   const { triggerSparkleAnimation, clearNewAnnotationId } = useResourceAnnotations();
 
-  // Determine MIME category to choose content path
+  // Render mode chooses the content path: 'text' decodes inline; 'image'
+  // and 'pdf' go through the media-token (binary) path. 'none'/registry-miss
+  // fall to the text path harmlessly — the viewer shows metadata + download.
   const resourceMediaType = getPrimaryMediaType(resource) || 'text/plain';
-  const isBinary = getMimeCategory(resourceMediaType) === 'image';
+  const renderMode = capabilitiesOf(resourceMediaType)?.render;
+  const isBinary = renderMode === 'image' || renderMode === 'pdf';
 
   // Text path: fetch and decode representation (disabled for binary — mediaToken path handles those)
   const { content: textContent, loading: textLoading } = useResourceContent(rUri, resource, !isBinary);
@@ -577,7 +579,7 @@ export function ResourceViewerPage({
 
             {/* JSON-LD Panel */}
             {activePanel === 'jsonld' && (
-              <JsonLdPanel resource={resource} />
+              <JsonLdPanel resourceId={rUri} />
             )}
           </ToolbarPanels>
 

package/src/features/resource-viewer/state/__tests__/resource-viewer-page-state-unit.test.ts

@@ -150,6 +150,43 @@ describe('createResourceViewerPageStateUnit', () => {
     stateUnit.dispose();
   });
 
+  // isBinaryType keys off textExtractionOf(...) !== 'decode', not render mode:
+  // storage-tier binary (ZIP, gif/webp) must be fetched as bytes, never
+  // decoded as text — the client-side twin of the Phase 3a serving-side fix.
+  it('fetches storage-tier binary (ZIP) as bytes, never the text-decode path', async () => {
+    const mediaToken = vi.fn().mockResolvedValue({ token: 'tok-zip' });
+    const resourceRepresentation = vi.fn();
+    tc = clientWithNamespaces({ mediaToken, resourceRepresentation });
+    const stateUnit = createResourceViewerPageStateUnit(
+      tc.client, RID, 'en', mockBrowse(),
+      { mediaType: 'application/zip' },
+    );
+
+    const token = await firstValueFrom(stateUnit.mediaToken$.pipe(filter((t) => t !== null)));
+    expect(token).toBe('tok-zip');
+    expect(resourceRepresentation).not.toHaveBeenCalled();
+
+    stateUnit.dispose();
+  });
+
+  it('decodes a registry-miss text/* subtype via the text path (RFC 2046)', async () => {
+    const mediaToken = vi.fn();
+    const resourceRepresentation = vi.fn().mockResolvedValue({
+      data: new TextEncoder().encode('hi').buffer,
+      contentType: 'text/x-custom',
+    });
+    tc = clientWithNamespaces({ mediaToken, resourceRepresentation });
+    const stateUnit = createResourceViewerPageStateUnit(
+      tc.client, RID, 'en', mockBrowse(),
+      { mediaType: 'text/x-custom' },
+    );
+
+    expect(resourceRepresentation).toHaveBeenCalled();
+    expect(mediaToken).not.toHaveBeenCalled();
+
+    stateUnit.dispose();
+  });
+
   it('wizard initializes closed', async () => {
     tc = clientWithNamespaces();
     const stateUnit = createResourceViewerPageStateUnit(tc.client, RID, 'en', mockBrowse());

package/src/features/resource-viewer/state/resource-viewer-page-state-unit.ts

@@ -9,7 +9,7 @@ import { createGatherStateUnit, type GatherStateUnit } from '@semiont/sdk';
 import { createMatchStateUnit } from '@semiont/sdk';
 import { createYieldStateUnit, type YieldStateUnit } from '@semiont/sdk';
 import type { SemiontClient } from '@semiont/sdk';
-import { decodeWithCharset } from '@semiont/core';
+import { decodeWithCharset, textExtractionOf } from '@semiont/core';
 import { isHighlight, isComment, isAssessment, isReference, isTag } from '@semiont/core';
 import type { ReferencedByEntry } from '@semiont/sdk';
 
@@ -113,13 +113,17 @@ export function createResourceViewerPageStateUnit(
   const mediaToken$ = new BehaviorSubject<string | null>(null);
 
   const mediaType = options?.mediaType || 'text/plain';
-  const isBinaryType = mediaType.startsWith('image/') || mediaType === 'application/pdf';
+  // "Fetch raw bytes or decode as text?" — binary iff the registry says this
+  // type does not decode to text. Storage-tier images (gif/webp) are
+  // render:'none' but still binary, and a ZIP must avoid the text path; a
+  // mechanical render-mode check would mis-route both into mojibake.
+  const isBinaryType = textExtractionOf(mediaType) !== 'decode';
 
   if (!isBinaryType && mediaType) {
     contentLoading$.next(true);
-    client.browse.resourceRepresentation(resourceId, { accept: mediaType })
-      .then(({ data }) => {
-        content$.next(decodeWithCharset(data, mediaType));
+    client.browse.resourceRepresentation(resourceId)
+      .then(({ data, contentType }) => {
+        content$.next(decodeWithCharset(data, contentType));
         contentLoading$.next(false);
       })
       .catch(() => { contentLoading$.next(false); });

package/src/styles/features/exchange.css

@@ -362,36 +362,6 @@
   color: var(--semiont-color-gray-400);
 }
 
-/* Hash chain badge */
-.semiont-exchange__hash-badge {
-  display: inline-flex;
-  align-items: center;
-  padding: 0.25rem 0.75rem;
-  border-radius: 9999px;
-  font-size: 0.75rem;
-  font-weight: 500;
-}
-
-.semiont-exchange__hash-badge--valid {
-  background-color: var(--semiont-color-green-100);
-  color: var(--semiont-color-green-800);
-}
-
-[data-theme="dark"] .semiont-exchange__hash-badge--valid {
-  background-color: rgba(34, 197, 94, 0.15);
-  color: var(--semiont-color-green-300);
-}
-
-.semiont-exchange__hash-badge--invalid {
-  background-color: var(--semiont-color-red-100);
-  color: var(--semiont-color-red-800);
-}
-
-[data-theme="dark"] .semiont-exchange__hash-badge--invalid {
-  background-color: rgba(239, 68, 68, 0.15);
-  color: var(--semiont-color-red-300);
-}
-
 /* Error message */
 .semiont-exchange__error-message {
   font-size: 0.875rem;

package/src/styles/index.css

@@ -91,6 +91,7 @@
 @import '../components/annotation/references.css';
 @import '../components/Toast.css';
 @import '../components/StatusDisplay.css';
+@import '../components/ProtectedErrorBoundary.css';
 @import '../components/loading-states/loading.css';
 @import '../components/error-states/errors.css';
 @import '../features/auth/auth.css';

package/translations/ar.json

@@ -71,6 +71,7 @@
     "annotationRemoved": "تمت إزالة التعليق التوضيحي",
     "annotationBodyUpdated": "تم تحديث التعليق التوضيحي",
     "jobEvent": "حدث مهمة",
+    "embeddingComputed": "تم حساب التضمين",
     "justNow": "الآن",
     "minutesAgo": "منذ {{count}}د",
     "hoursAgo": "منذ {{count}}س",
@@ -356,8 +357,5 @@
     "semanticScoringHelp": "استخدام الذكاء الاصطناعي لتقييم النتائج حسب الصلة الدلالية",
     "searching": "جاري البحث...",
     "search": "بحث"
-  },
-  "History": {
-    "embeddingComputed": "تم حساب التضمين"
   }
 }

package/translations/bn.json

@@ -71,6 +71,7 @@
     "annotationRemoved": "টীকা অপসারিত হয়েছে",
     "annotationBodyUpdated": "টীকা আপডেট হয়েছে",
     "jobEvent": "কাজের ঘটনা",
+    "embeddingComputed": "এমবেডিং গণনা করা হয়েছে",
     "justNow": "এইমাত্র",
     "minutesAgo": "{{count}} মি. আগে",
     "hoursAgo": "{{count}} ঘ. আগে",
@@ -356,8 +357,5 @@
     "semanticScoringHelp": "অর্থগত প্রাসঙ্গিকতা অনুযায়ী ফলাফল স্কোর করতে AI ব্যবহার করুন",
     "searching": "অনুসন্ধান করা হচ্ছে...",
     "search": "অনুসন্ধান"
-  },
-  "History": {
-    "embeddingComputed": "এমবেডিং গণনা করা হয়েছে"
   }
 }

package/translations/cs.json

@@ -71,6 +71,7 @@
     "annotationRemoved": "Anotace odebrána",
     "annotationBodyUpdated": "Anotace aktualizována",
     "jobEvent": "Událost úlohy",
+    "embeddingComputed": "Embedding vypočten",
     "justNow": "právě teď",
     "minutesAgo": "před {{count}} min",
     "hoursAgo": "před {{count}} hod",
@@ -356,8 +357,5 @@
     "semanticScoringHelp": "Použít AI k hodnocení výsledků podle sémantické relevance",
     "searching": "Vyhledávání...",
     "search": "Hledat"
-  },
-  "History": {
-    "embeddingComputed": "Embedding vypočten"
   }
 }