refactor: unified VI, removed compose layer, consolidated shared components#2706
Merged
sykp241095 merged 2 commits intomainfrom Mar 31, 2026
Merged
refactor: unified VI, removed compose layer, consolidated shared components#2706sykp241095 merged 2 commits intomainfrom
sykp241095 merged 2 commits intomainfrom
Conversation
…onents - Unified sidebar: CollapsibleSidebar across repo/org/user/collection/compare pages - Unified title hierarchy: H1(28px) H2(22px) H3(18px) H4(14px) across all pages - Unified ShowSQL: all placed in title row right side - Unified table styles: RankTable pattern (No./Name/Value) for repo/org - Unified chart grid lines: #2a2a2c dashed splitLine on all axes - Unified dataZoom: slim 16px slider, no data shadow - Unified sidebar nav: left border selected state, no background highlight - Unified spacing: section pt-8/pb-8, title pb-4, chart title mb-3 - Unified right padding: 10% on all analysis/collection layouts - Unified OG image constants: shared lib/og-image.ts - Unified colors: removed yellow (#f7df83) from collection pages - Unified breadcrumb: Home icon style on collection pages with Edit link - Removed compose layer: deleted charts/compose/org/ (17 chart wrappers) - Removed SectionTemplate: org/user sections use ScrollspySectionWrapper - Removed duplicate code: utils/format.ts, charts-utils/ui/, Analyze/options/ - Removed duplicate API route: /gh/repos/[owner]/[repo] - Removed unused components: MainSideGridTemplate, SplitTemplate, SubChart, ChartLinks - Shared chart visualizations: map-chart.ts, word-cloud.tsx, time-heatmap.tsx - Added StickyRepoHeader for repo analysis - Added ScrollspySectionWrapper anchors for sidebar scroll tracking - Added RadarChart/PieChart/TreemapChart to ECharts registry - Fixed hydration mismatch in ShareButtons - Fixed tainted canvas export error - Replaced native select with tabs in developer activities - Removed Organization/Developer type labels - Removed breadcrumbs from analysis pages - Removed "Last active at" from org header Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
… cleanup
## Shared UI Components
- TabBar: replaces 3 inline tab implementations
- SectionHeading: replaces 25 inline heading elements
- MetricTable: replaces duplicate overview tables in repo/user pages
- LoadingSkeleton: consolidates 3 identical definitions
- useChartContainer: shared ResizeObserver hook for RepoChart/OrgChart
- createTimeSeriesOption: reduces 7 inline ECharts option builders
- PageSkeleton: shared loading.tsx skeletons
## Visual Consistency
- Removed ALL yellow accent colors (#ffe895/#f7df83/#fbe593) — primary is now white
- Unified border-radius: rounded-xl/2xl/3xl → rounded-md/sm across all components
- Unified hover colors: 31 yellow hover variants → hover:text-white
- Unified description text: 4 non-standard styles → text-[16px] text-[#7c7c7c]
- Unified dropdown/popover bg: #2f2f3a → #212122
- Unified input/select focus: yellow ring → subtle gray border
- Unified kbd styling: removed border, simplified
- Cleaned search dialog width (CSS class with !important)
- Removed card backgrounds from Repository Statistics section
## Performance
- Context values memoized (AnalyzeContext, AnalyzeChartContext, CollapsibleSidebar)
- Removed 6 remaining key={} props forcing chart remounts
- Sidebar animation: removed transition-[width] (layout thrash)
- SQLDialog lazy-loaded via dynamic import (~300 lines deferred)
- fetchCollections wrapped in React.cache for server dedup
- useTransition for tab switches and URL param changes
- TabBar onPrefetch hook for hover-based data prefetching
- staleTime 5min on RepoChart/OrgChart queries
- content-visibility: auto on ScrollspySectionWrapper
- will-change-transform on sticky elements
- requestAnimationFrame throttling on scroll handlers
- passive: true on all scroll listeners
- Font display: swap for Geist font
- Fixed layout shift: StickyRepoHeader → fixed positioning
- transition-all → specific properties (6 files)
## Next.js Best Practices
- React 18 → 19, @types/react 18 → 19
- error.tsx on all 14 routes
- loading.tsx with proper skeletons on all routes
- generateStaticParams for popular repo/org pages
- Removed contradictory force-dynamic + revalidate on trending/languages
- next/image optimization enabled (removed unoptimized: true)
- router.push → Link component (3 places)
## Engineering Quality
- Removed 9 console.log/warn from client code
- Cleaned 18 TODO/FIXME comments
- VisualizerModule type replaces 14 `any` in chart system
- Deduplicated chart color palettes
- Unified percentage formatting to number2percent
- CSS variables configured for design tokens
- Fixed duplicate splitLine properties in 7 chart files
- Removed unused @ts-expect-error directives
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Major UI/VI unification across all analysis pages (repo, org, user, collection, compare).
charts/compose/org/layer (17 chart wrappers) — org sections now directly usecharts/analyze/org/Test plan
🤖 Generated with Claude Code