@pheem49/mint 1.14.0 → 1.15.0

package/src/renderer/shared/agentProgress.ts

@@ -6,19 +6,152 @@
 import type { AgentProgress, InteractionMemory, DiffHunk, FileChange } from './types'
 export type { AgentProgress, InteractionMemory }
 
+export function isInternalCot(text: string): boolean {
+  const trimmed = text.trim()
+  if (trimmed.startsWith('<think>') || trimmed.includes('</think>')) {
+    return true
+  }
+  const lineCount = trimmed.split('\n').length
+  const charCount = trimmed.length
+  if (trimmed.includes('\n\n') || lineCount > 2 || charCount > 180) {
+    return true
+  }
+  const lower = trimmed.toLowerCase()
+  if (
+    lower.startsWith('the user ') ||
+    lower.startsWith("let's think") ||
+    lower.startsWith('let me analyze') ||
+    lower.startsWith('per rule') ||
+    lower.startsWith('note the ') ||
+    lower.includes('thinking process:')
+  ) {
+    return true
+  }
+  return false
+}
+
+/** Short inline agent notes (excluding long chain-of-thought). */
 export function thoughtsFrom(progress: AgentProgress[]): string[] {
   return progress
     .filter((event) => event.type === 'Thought')
     .map((event) => (event as Extract<AgentProgress, { type: 'Thought' }>).data.thought)
-    .filter(Boolean)
+    .filter((t) => Boolean(t) && !isInternalCot(t))
+}
+
+/** Extended reasoning / chain-of-thought from the model's API thinking tokens or <think> tags. */
+export function extendedThoughtsFrom(progress: AgentProgress[]): string[] {
+  const extended: string[] = []
+  for (const event of progress) {
+    if (event.type === 'ThinkingDelta') {
+      if (event.data.delta?.trim()) extended.push(event.data.delta)
+    } else if (event.type === 'ExtendedThinking') {
+      if (event.data.thought?.trim()) extended.push(event.data.thought)
+    } else if (event.type === 'Thought' && event.data.thought && isInternalCot(event.data.thought)) {
+      extended.push(event.data.thought)
+    }
+  }
+  return extended
 }
 
 export function trimAgentProgress(progress: AgentProgress[], maxNonThought = 20): AgentProgress[] {
   if (progress.length === 0) return progress
   const keptNonThought = new Set(
-    progress.filter((event) => event.type !== 'Thought').slice(-maxNonThought),
+    progress
+      .filter((event) => event.type !== 'Thought' && event.type !== 'ThinkingDelta' && event.type !== 'ExtendedThinking')
+      .slice(-maxNonThought),
+  )
+  return progress.filter(
+    (event) =>
+      event.type === 'Thought' ||
+      event.type === 'ThinkingDelta' ||
+      event.type === 'ExtendedThinking' ||
+      keptNonThought.has(event),
   )
-  return progress.filter((event) => event.type === 'Thought' || keptNonThought.has(event))
+}
+
+/** Fold live reasoning deltas into one replaceable record per model step. */
+export function reduceLiveAgentProgress(
+  current: AgentProgress[],
+  event: AgentProgress,
+): AgentProgress[] {
+  if (event.type === 'ThinkingDelta') {
+    const index = current.findIndex(
+      (item) => item.type === 'ThinkingDelta' && item.data.id === event.data.id,
+    )
+    if (index < 0) return trimAgentProgress([...current, event])
+    const next = current.slice()
+    const previous = next[index] as Extract<AgentProgress, { type: 'ThinkingDelta' }>
+    next[index] = {
+      type: 'ThinkingDelta',
+      data: {
+        id: event.data.id,
+        delta: `${previous.data.delta}${event.data.delta}`,
+        elapsed_ms: event.data.elapsed_ms,
+      },
+    }
+    return next
+  }
+
+  if (event.type === 'ExtendedThinking' && event.data.id) {
+    const index = current.findIndex(
+      (item) => item.type === 'ThinkingDelta' && item.data.id === event.data.id,
+    )
+    if (index >= 0) {
+      const next = current.slice()
+      next[index] = event
+      return trimAgentProgress(next)
+    }
+  }
+  return trimAgentProgress([...current, event])
+}
+
+export function reduceLiveAgentProgressBatch(
+  current: AgentProgress[],
+  events: AgentProgress[],
+): AgentProgress[] {
+  return events.reduce(reduceLiveAgentProgress, current)
+}
+
+/** Remove transport-only deltas before activity is stored in conversation history. */
+export function compactAgentProgressForPersistence(progress: AgentProgress[]): AgentProgress[] {
+  const completedIds = new Set(
+    progress
+      .filter((event): event is Extract<AgentProgress, { type: 'ExtendedThinking' }> => event.type === 'ExtendedThinking')
+      .map((event) => event.data.id)
+      .filter((id): id is string => Boolean(id)),
+  )
+  const result: AgentProgress[] = []
+  const interrupted = new Map<string, Extract<AgentProgress, { type: 'ThinkingDelta' }>>()
+  for (const event of progress) {
+    if (event.type === 'ThinkingDelta') {
+      if (!completedIds.has(event.data.id)) {
+        const previous = interrupted.get(event.data.id)
+        interrupted.set(event.data.id, previous
+          ? {
+              type: 'ThinkingDelta',
+              data: {
+                id: event.data.id,
+                delta: `${previous.data.delta}${event.data.delta}`,
+                elapsed_ms: event.data.elapsed_ms,
+              },
+            }
+          : event)
+      }
+      continue
+    }
+    result.push(event)
+  }
+  for (const event of interrupted.values()) {
+    result.push({
+      type: 'ExtendedThinking',
+      data: {
+        id: event.data.id,
+        thought: event.data.delta,
+        elapsed_ms: event.data.elapsed_ms,
+      },
+    })
+  }
+  return result
 }
 
 export function hasAgentToolActivity(progress: AgentProgress[]): boolean {
@@ -150,3 +283,35 @@ export function parseFileChangesFromProgress(progress: AgentProgress[]): FileCha
 
   return Array.from(changes.values())
 }
+
+/**
+ * Combine file changes from multiple agent turns into one conversation-level
+ * review. Keeping this fold next to the parser means every surface (chat,
+ * desktop review, and future exports) gets the same aggregation semantics.
+ */
+export function mergeFileChanges(changeGroups: FileChange[][]): FileChange[] {
+  const merged = new Map<string, FileChange>()
+
+  for (const changes of changeGroups) {
+    for (const change of changes) {
+      const existing = merged.get(change.path)
+      if (!existing) {
+        merged.set(change.path, {
+          path: change.path,
+          created: change.created,
+          additions: change.additions,
+          deletions: change.deletions,
+          hunks: [...change.hunks],
+        })
+        continue
+      }
+
+      existing.created = existing.created || change.created
+      existing.additions += change.additions
+      existing.deletions += change.deletions
+      existing.hunks.push(...change.hunks)
+    }
+  }
+
+  return Array.from(merged.values())
+}

package/src/renderer/shared/components/AgentActivityDrawer.tsx

@@ -43,7 +43,7 @@ export function AgentActivityDrawer({
     .find((e): e is { type: 'RunCompleted'; data: { summary: RunTelemetrySummary } } => e.type === 'RunCompleted')
     ?.data.summary
 
-  if (activityView.items.length === 0 && !latestPlan && !latestRunSummary) return null
+  if (activityView.items.length === 0 && (!activityView.timeline || activityView.timeline.length === 0) && !latestPlan && !latestRunSummary) return null
 
   const hasSubagents = (rawProgress || []).some(
     (e) =>
@@ -74,16 +74,16 @@ export function AgentActivityDrawer({
             gap: '8px',
             marginBottom: '10px',
             paddingBottom: '8px',
-            borderBottom: '1px solid rgba(255, 255, 255, 0.08)',
+            borderBottom: '1px solid var(--border)',
           }}
         >
           <div
             style={{
               display: 'inline-flex',
               padding: '2px',
-              background: 'rgba(255, 255, 255, 0.05)',
+              background: 'var(--surface-strong)',
               borderRadius: '6px',
-              border: '1px solid rgba(255, 255, 255, 0.08)',
+              border: '1px solid var(--border)',
             }}
           >
             <button
@@ -142,7 +142,7 @@ export function AgentActivityDrawer({
 
       {viewMode === 'dag' && hasSubagents ? (
         <SubagentDagView progress={rawProgress || []} isLive={!isHistorical} />
-      ) : activityView.items.length > 0 ? (
+      ) : activityView.items.length > 0 || (activityView.timeline && activityView.timeline.length > 0) ? (
         <AgentActivityTable activityView={activityView} />
       ) : null}
     </>
@@ -152,7 +152,7 @@ export function AgentActivityDrawer({
     latestPlan?.objective ||
     activityView.summary ||
     (latestRunSummary
-      ? `Run Telemetry (${latestRunSummary.outcome})`
+      ? `Run telemetry (${latestRunSummary.outcome})`
       : 'Agent Activity')
 
   if (isHistorical) {

package/src/renderer/shared/components/AgentActivityTable.tsx

@@ -1,8 +1,11 @@
 import { Fragment, useState } from 'react'
-import type { AgentActivityView, AgentActivity, AgentActivityGroup } from '../utils/agentActivity'
+import type { AgentActivityView, AgentActivity, AgentActivityGroup, TimelineItem } from '../utils/agentActivity'
 import { groupActivities } from '../utils/agentActivity'
 import { materialFileIcon, materialFolderIcon, getExtension } from '../utils/fileIcons'
+import { InlineThoughtNote } from './InlineThoughtNote'
+import { renderFormattedMessage } from '../utils/markdown'
 import {
+  Brain,
   Calculator,
   FileCode,
   Folder,
@@ -71,10 +74,10 @@ function renderStatusIndicator(state: AgentActivity['state']) {
     return <Loader2 size={12} className="agent-activity-status-spin" />
   }
   if (state === 'retry') {
-    return <span className="agent-activity-badge retry" title="Step encountered an error but agent retried">Retried</span>
+    return <span className="agent-activity-badge retry" title="Encountered an error but agent retried">Retried</span>
   }
   if (state === 'error') {
-    return <span className="agent-activity-badge error" title="Step failed">Failed</span>
+    return <span className="agent-activity-badge error" title="Action failed">Failed</span>
   }
   return <Check size={12} className="agent-activity-status-check" />
 }
@@ -91,151 +94,208 @@ export function AgentActivityTable({ activityView }: Props) {
     }))
   }
 
-  const toggleExpandItem = (key: string) => {
+  const toggleExpandItem = (key: string, defaultExpanded = false) => {
     setExpandedIndices(prev => ({
       ...prev,
-      [key]: !prev[key],
+      [key]: !(prev[key] ?? defaultExpanded),
     }))
   }
 
-  return (
-    <div className="agent-activity-list">
-      {groups.map((group, groupIdx) => {
-        const isMulti = group.count > 1
-        const isGroupExpanded = Boolean(expandedGroups[group.id])
-
-        if (!isMulti) {
-          const activity = group.items[0]
-          const itemKey = `${groupIdx}-0-${activity.label}-${activity.target}`
-          const isItemExpanded = Boolean(expandedIndices[itemKey])
-          const output = activity.result?.trim()
-          const inlineResult = extractResultPreview(activity.action, output)
+  const renderSingleItem = (activity: AgentActivity, itemKey: string) => {
+    const isItemExpanded = Boolean(expandedIndices[itemKey])
+    const output = activity.result?.trim()
+    const inlineResult = extractResultPreview(activity.action, output)
 
-          return (
-            <Fragment key={group.id}>
-              <div
-                className="agent-activity-item"
-                data-kind={activity.kind}
-                data-state={activity.state}
-                style={{ cursor: output ? 'pointer' : 'default' }}
-                onClick={() => output && toggleExpandItem(itemKey)}
+    return (
+      <Fragment key={itemKey}>
+        <div
+          className="agent-activity-item"
+          data-kind={activity.kind}
+          data-state={activity.state}
+          style={{ cursor: output ? 'pointer' : 'default' }}
+          onClick={() => output && toggleExpandItem(itemKey)}
+        >
+          <span className="agent-activity-icon-wrap" aria-hidden="true">
+            {renderActivityIcon(activity.kind, activity.target, activity.action)}
+          </span>
+          <span className="agent-activity-label">
+            <span className="agent-activity-tool-name">{activity.label || activity.action}</span>
+          </span>
+          <span
+            className="agent-activity-text"
+            title={activity.target}
+            style={isItemExpanded ? { whiteSpace: 'normal', wordBreak: 'break-all', overflow: 'visible', textOverflow: 'clip' } : undefined}
+          >
+            <span className="agent-activity-target-text">{activity.target}</span>
+            {inlineResult && <span className="agent-activity-inline-result">{inlineResult}</span>}
+          </span>
+          <span className="agent-activity-status-col">
+            {renderStatusIndicator(activity.state)}
+            {output && (
+              <span
+                className={`agent-activity-chevron${isItemExpanded ? ' is-open' : ''}`}
+                aria-hidden="true"
               >
-                <span className="agent-activity-icon-wrap" aria-hidden="true">
-                  {renderActivityIcon(activity.kind, activity.target, activity.action)}
-                </span>
-                <span className="agent-activity-label">
-                  <span className="agent-activity-tool-name">{activity.label || activity.action}</span>
-                </span>
-                <span
-                  className="agent-activity-text"
-                  title={activity.target}
-                  style={isItemExpanded ? { whiteSpace: 'normal', wordBreak: 'break-all', overflow: 'visible', textOverflow: 'clip' } : undefined}
-                >
-                  <span className="agent-activity-target-text">{activity.target}</span>
-                  {inlineResult && <span className="agent-activity-inline-result">{inlineResult}</span>}
-                </span>
-                <span className="agent-activity-status-col">
-                  {renderStatusIndicator(activity.state)}
-                  {output && (
-                    <span
-                      className={`agent-activity-chevron${isItemExpanded ? ' is-open' : ''}`}
-                      aria-hidden="true"
-                    >
-                      <ChevronRight size={12} strokeWidth={2.2} />
-                    </span>
-                  )}
-                </span>
-              </div>
-              {isItemExpanded && output && (
-                <div className="agent-activity-output">
-                  <pre>{output}</pre>
-                </div>
-              )}
-            </Fragment>
-          )
-        }
+                <ChevronRight size={12} strokeWidth={2.2} />
+              </span>
+            )}
+          </span>
+        </div>
+        {isItemExpanded && output && (
+          <div className="agent-activity-output">
+            <pre>{output}</pre>
+          </div>
+        )}
+      </Fragment>
+    )
+  }
 
-        return (
-          <div key={group.id} className="agent-activity-group">
-            <div
-              className={`agent-activity-group-header${isGroupExpanded ? ' is-expanded' : ''}`}
-              data-state={group.state}
-              onClick={() => toggleGroup(group.id)}
+  const renderGroup = (group: AgentActivityGroup) => {
+    const isGroupExpanded = Boolean(expandedGroups[group.id])
+
+    return (
+      <div key={group.id} className="agent-activity-group">
+        <div
+          className={`agent-activity-group-header${isGroupExpanded ? ' is-expanded' : ''}`}
+          data-state={group.state}
+          onClick={() => toggleGroup(group.id)}
+        >
+          <span className="agent-activity-icon-wrap" aria-hidden="true">
+            {renderActivityIcon(group.kind, group.items[0]?.target, group.action)}
+          </span>
+          <span className="agent-activity-group-title">
+            {group.title}
+          </span>
+          <span className="agent-activity-group-badges">
+            <span className="agent-activity-count-badge">
+              {group.count}
+            </span>
+            {renderStatusIndicator(group.state)}
+            <span
+              className={`agent-activity-chevron${isGroupExpanded ? ' is-open' : ''}`}
+              aria-hidden="true"
             >
-              <span className="agent-activity-icon-wrap" aria-hidden="true">
-                {renderActivityIcon(group.kind, group.items[0]?.target, group.action)}
-              </span>
-              <span className="agent-activity-group-title">
-                {group.title}
-              </span>
-              <span className="agent-activity-group-badges">
-                <span className="agent-activity-count-badge">
-                  {group.count} steps
-                </span>
-                {renderStatusIndicator(group.state)}
-                <span
-                  className={`agent-activity-chevron${isGroupExpanded ? ' is-open' : ''}`}
-                  aria-hidden="true"
-                >
-                  <ChevronRight size={13} strokeWidth={2.2} />
-                </span>
-              </span>
-            </div>
+              <ChevronRight size={13} strokeWidth={2.2} />
+            </span>
+          </span>
+        </div>
 
-            {isGroupExpanded && (
-              <div className="agent-activity-group-subitems">
-                {group.items.map((activity, itemIdx) => {
-                  const itemKey = `${group.id}-${itemIdx}-${activity.target}`
-                  const isItemExpanded = Boolean(expandedIndices[itemKey])
-                  const output = activity.result?.trim()
-                  const inlineResult = extractResultPreview(activity.action, output)
+        {isGroupExpanded && (
+          <div className="agent-activity-group-subitems">
+            {group.items.map((activity, itemIdx) => {
+              const itemKey = `${group.id}-${itemIdx}-${activity.target}`
+              const isItemExpanded = Boolean(expandedIndices[itemKey])
+              const output = activity.result?.trim()
+              const inlineResult = extractResultPreview(activity.action, output)
 
-                  return (
-                    <Fragment key={itemKey}>
-                      <div
-                        className="agent-activity-subitem"
-                        data-state={activity.state}
-                        style={{ cursor: output ? 'pointer' : 'default' }}
-                        onClick={() => output && toggleExpandItem(itemKey)}
-                      >
-                        <span className="agent-activity-tree-bullet" aria-hidden="true">
-                          {itemIdx === group.items.length - 1 ? '└─' : '├─'}
-                        </span>
+              return (
+                <Fragment key={itemKey}>
+                  <div
+                    className="agent-activity-subitem"
+                    data-state={activity.state}
+                    style={{ cursor: output ? 'pointer' : 'default' }}
+                    onClick={() => output && toggleExpandItem(itemKey)}
+                  >
+                    <span className="agent-activity-tree-bullet" aria-hidden="true">
+                      {itemIdx === group.items.length - 1 ? '└─' : '├─'}
+                    </span>
+                    <span
+                      className="agent-activity-subitem-target"
+                      title={activity.target}
+                    >
+                      {activity.target}
+                    </span>
+                    {inlineResult && (
+                      <span className="agent-activity-inline-result">{inlineResult}</span>
+                    )}
+                    <span className="agent-activity-subitem-status">
+                      {renderStatusIndicator(activity.state)}
+                      {output && (
                         <span
-                          className="agent-activity-subitem-target"
-                          title={activity.target}
+                          className={`agent-activity-chevron${isItemExpanded ? ' is-open' : ''}`}
+                          aria-hidden="true"
                         >
-                          {activity.target}
-                        </span>
-                        {inlineResult && (
-                          <span className="agent-activity-inline-result">{inlineResult}</span>
-                        )}
-                        <span className="agent-activity-subitem-status">
-                          {renderStatusIndicator(activity.state)}
-                          {output && (
-                            <span
-                              className={`agent-activity-chevron${isItemExpanded ? ' is-open' : ''}`}
-                              aria-hidden="true"
-                            >
-                              <ChevronRight size={11} strokeWidth={2.2} />
-                            </span>
-                          )}
+                          <ChevronRight size={11} strokeWidth={2.2} />
                         </span>
-                      </div>
-                      {isItemExpanded && output && (
-                        <div className="agent-activity-output agent-activity-subitem-output">
-                          <pre>{output}</pre>
-                        </div>
                       )}
-                    </Fragment>
-                  )
-                })}
-              </div>
-            )}
+                    </span>
+                  </div>
+                  {isItemExpanded && output && (
+                    <div className="agent-activity-output agent-activity-subitem-output">
+                      <pre>{output}</pre>
+                    </div>
+                  )}
+                </Fragment>
+              )
+            })}
           </div>
-        )
-      })}
+        )}
+      </div>
+    )
+  }
+
+  return (
+    <div className="agent-activity-list">
+      {activityView.timeline && activityView.timeline.length > 0
+        ? activityView.timeline.map((item, idx) => {
+            if (item.kind === 'thought') {
+              return <InlineThoughtNote key={item.id || `thought-${idx}`} thought={item.thought} />
+            }
+            if (item.kind === 'extendedThinking') {
+              const itemKey = item.id || `ext-thought-${idx}`
+              const isThoughtExpanded = expandedIndices[itemKey] ?? Boolean(item.streaming)
+              return (
+                <div key={itemKey} className="agent-activity-thought-step">
+                  <div
+                    className={`agent-activity-thought-header${isThoughtExpanded ? ' is-expanded' : ''}`}
+                    onClick={() => toggleExpandItem(itemKey, Boolean(item.streaming))}
+                  >
+                    <span className="agent-activity-icon-wrap" aria-hidden="true">
+                      <Brain size={14} className="agent-activity-kind-icon" />
+                    </span>
+                    <span className="agent-activity-thought-title">
+                      Thought
+                      <span className="agent-activity-thought-meta">
+                        {item.streaming
+                          ? ' · Thinking…'
+                          : item.elapsedMs != null
+                            ? ` · ${(item.elapsedMs / 1000).toFixed(1)}s`
+                            : ''}
+                      </span>
+                    </span>
+                    <span
+                      className={`agent-activity-chevron${isThoughtExpanded ? ' is-open' : ''}`}
+                      aria-hidden="true"
+                    >
+                      <ChevronRight size={13} strokeWidth={2.2} />
+                    </span>
+                  </div>
+                  {isThoughtExpanded && (
+                    <div className="agent-activity-thought-body">
+                      {item.streaming
+                        ? <>{item.thought}<span className="agent-activity-thought-cursor">▍</span></>
+                        : (renderFormattedMessage(item.thought) ?? item.thought)}
+                    </div>
+                  )}
+                </div>
+              )
+            }
+            if (item.kind === 'activity') {
+              return renderSingleItem(item.activity, item.id || `act-${idx}`)
+            }
+            if (item.kind === 'group') {
+              return renderGroup(item.group)
+            }
+            return null
+          })
+        : groups.map((group, groupIdx) => {
+            if (group.count <= 1) {
+              const activity = group.items[0]
+              const itemKey = `${groupIdx}-0-${activity.label}-${activity.target}`
+              return renderSingleItem(activity, itemKey)
+            }
+            return renderGroup(group)
+          })}
     </div>
   )
 }
-

package/src/renderer/shared/components/ArtifactPreviewPanel.tsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useCallback, useMemo } from 'react'
-import { readWorkspaceFile } from '@/tauri'
+import { runtimePlatform } from '../platform'
 import { renderFormattedMessage } from '../utils/markdown'
 import { ChatCodeBlock } from './ChatCodeBlock'
 
@@ -72,7 +72,7 @@ export function ArtifactPreviewPanel({ artifact, onClose, workspacePath }: Props
     setLoading(true)
     setError(null)
     try {
-      const text = await readWorkspaceFile(filePath, workspacePath)
+      const text = await runtimePlatform.readWorkspaceFile(filePath, workspacePath)
       setContent(text)
     } catch (err: any) {
       // If content was already supplied in artifact, fallback to it
@@ -162,7 +162,7 @@ export function ArtifactPreviewPanel({ artifact, onClose, workspacePath }: Props
               height: '24px',
               borderRadius: 'var(--radius-xs, 4px)',
               background: 'color-mix(in srgb, var(--accent) 15%, transparent)',
-              color: 'var(--accent)',
+              color: 'var(--interactive-fg)',
               fontSize: '0.68rem',
               fontWeight: 700,
               flexShrink: 0,
@@ -376,7 +376,7 @@ export function ArtifactPreviewPanel({ artifact, onClose, workspacePath }: Props
           <button
             type="button"
             onClick={onClose}
-            title="Close Preview Panel"
+            title="Close preview Panel"
             style={{
               background: 'none',
               border: 'none',

package/src/renderer/shared/components/AuthGate.tsx

@@ -1,15 +1,10 @@
 import React, { createContext, useContext, useEffect, useState } from 'react'
 import type { AuthUser } from '../types'
-import {
-  APP_ICON_PATH,
-  authGetCurrentUser,
-  authLogin,
-  authLogout,
-  authRegister,
-  resolveAvatarUrl,
-} from '@/tauri'
+import { authPlatform, runtimePlatform } from '../platform'
 import '../css/auth-gate.css'
 
+const { authGetCurrentUser, authLogin, authLogout, authRegister, resolveAvatarUrl } = authPlatform
+
 interface AuthContextValue {
   user: AuthUser | null
   avatarUrl: string | null
@@ -126,7 +121,7 @@ function AuthForm({ onSuccess }: { onSuccess: (user: AuthUser) => void }) {
   return (
     <div className="auth-gate-overlay">
       <form className="auth-gate-card" onSubmit={handleSubmit}>
-        <img src={APP_ICON_PATH} alt="" className="auth-gate-logo" />
+        <img src={runtimePlatform.appIconPath()} alt="" className="auth-gate-logo" />
         <h1 className="auth-gate-title">
           {mode === 'login' ? 'Sign in to Mint' : 'Create your Mint account'}
         </h1>