Skip to content

Modernize Export and AI Lab Interfaces#94

Merged
d-oit merged 1 commit intomainfrom
feat/export-lab-trust-pass-17723910974572926102
May 3, 2026
Merged

Modernize Export and AI Lab Interfaces#94
d-oit merged 1 commit intomainfrom
feat/export-lab-trust-pass-17723910974572926102

Conversation

@d-oit
Copy link
Copy Markdown
Owner

@d-oit d-oit commented May 3, 2026

This change implements Phase 7 of the UI Modernization 2026 plan.

Key changes:

  • ExportPanel.tsx: Replaced generic layout with a structured, preview-first interface. Added format selection for Markdown, JSON, SQLite, Graph, and Static Site. Added scope selection (All, Selected, etc.) and integrated live repository stats for entities, claims, and links.
  • AIHarness.tsx: Refactored the generic chat view into a dedicated lab interface with four panels: Prompt, Context, Run Log, and Artifacts. Added a model status banner to provide truthful feedback on local model availability.
  • JobMetrics.tsx: Moved inline styles to components.css using design tokens and restricted visibility to development mode (import.meta.env.DEV).
  • Styling: Extended features.css and components.css to support the new layouts while maintaining the established design system and accessibility standards (e.g., minimum 44px tap targets).

These updates clarify the local-first nature of the application and ensure the 'Lab' features accurately reflect their experimental and local-only status.

Fixes #81


PR created automatically by Jules for task 17723910974572926102 started by @d-oit

- Modernize ExportPanel with preview-first UX, format cards, and scope selection.
- Update AIHarness with a lab-ready four-panel layout and truthful status.
- Refactor JobMetrics to use tokenized CSS and gate to development mode.
- Update styling to align with 2026 UI modernization tokens.
- Ensure compliance with anti-slop rules for local-first messaging.

Co-authored-by: d-oit <6849456+d-oit@users.noreply.github.com>
@google-labs-jules
Copy link
Copy Markdown
Contributor

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.


For security, I will only act on instructions from the user who triggered this task.

@deepsource-io
Copy link
Copy Markdown

deepsource-io Bot commented May 3, 2026

DeepSource Code Review

We reviewed changes in 5df6e1a...7523d45 on this pull request. Below is the summary for the review, and you can see the individual issues we found as inline review comments.

See full review on DeepSource ↗

PR Report Card

Overall Grade   Security  

Reliability  

Complexity  

Hygiene  

Code Review Summary

Analyzer Status Updated (UTC) Details
JavaScript May 3, 2026 2:14p.m. Review ↗
Python May 3, 2026 2:14p.m. Review ↗
Shell May 3, 2026 2:14p.m. Review ↗
SQL May 3, 2026 2:14p.m. Review ↗

Important

AI Review is run only on demand for your team. We're only showing results of static analysis review right now. To trigger AI Review, comment @deepsourcebot review on this thread.

AI agent ready to assist with TRIZ analysis and knowledge synthesis.
import React, { useState } from 'react';

const AIHarness: React.FC = () => {
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

`AIHarness` has a cyclomatic complexity of 9 with "medium" risk


A function with high cyclomatic complexity can be hard to understand and
maintain. Cyclomatic complexity is a software metric that measures the number of
independent paths through a function. A higher cyclomatic complexity indicates
that the function has more decision points and is more complex.

links: number;
}

const ExportPanel: React.FC = () => {
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

`ExportPanel` has a cyclomatic complexity of 6 with "medium" risk


A function with high cyclomatic complexity can be hard to understand and
maintain. Cyclomatic complexity is a software metric that measures the number of
independent paths through a function. A higher cyclomatic complexity indicates
that the function has more decision points and is more complex.

<button className="primary" onClick={() => handleExport('markdown')}>Export as Markdown</button>
<button onClick={() => handleExport('json')}>Export as JSON</button>
<button onClick={() => handleExport('site')}>Export as Static Site</button>
<div className="export-view">
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

JSX tree is too deeply nested. Found 5 levels of nesting


Nesting JSX elements too deeply can confuse developers reading the code. To make maintenance and refactoring easier, DeepSource recommends limiting the maximum JSX tree depth to 4.

@d-oit d-oit marked this pull request as ready for review May 3, 2026 14:42
@d-oit d-oit merged commit fdffb24 into main May 3, 2026
20 of 21 checks passed
@d-oit d-oit deleted the feat/export-lab-trust-pass-17723910974572926102 branch May 3, 2026 14:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat(export): Phase 7 - Export and Lab Trust Pass

1 participant