Now I have all the details. Let me create the FINAL UPDATED DESIGN SPECIFICATION incorporating all your feedback:

FINAL DESIGN SPECIFICATION: Stock Management App

1. Authentication & Navigation

Login/Register Pages

• Email input
• Password input (with strength indicator on register)
• "Remember me" checkbox (login page)
• "Forgot password?" link
• Clean, minimal design with industry-standard colors (dark background, primary accent color)

Main Navigation - Left Sidebar (Persistent)

Top Header Bar

• Breadcrumb navigation
• Quick ticker search bar

• Portfolio Stats Display:

  • Time Filter Radio Buttons: MTD | YTD | 1M | 6M | 1Y | 5Y | MAX
  • Total Portfolio Value (large)
  • Total P&L ($)
  • Total P&L (%)

2. Portfolio Dashboard Tab

Layout Structure:

Top Section - Statistics Cards (controlled by time filter radio buttons)

• These metrics update based on selected time period
• Color coding: Green for positive P&L, Red for negative

Middle Section - Portfolio Controls

• Upload Portfolio button → Opens Modal
• Filter options: By Account, By Sentiment
• View options: Maintained in table format

Main Content - Single Portfolio Table

• Sentiment indicators use industry standard colors (green/yellow/red)
• Actions dropdown: Edit, Delete, View Details
• Table is sortable by any column
• All P&L calculations based on selected time period

Upload Portfolio Modal

Flow:

1. User clicks "Upload Portfolio" button
2. Modal opens with instructions

3. Options:

   • Manual entry form (Ticker, Company, Avg Buy Price, Shares, Account)
   • CSV file upload

4. If CSV uploaded:

   • Agent validates and reviews the data
   • Shows preview with any detected issues or missing data
   • Displays suggestions for corrections
   • User reviews and approves each row
   • Confirmation button to finalize import

5. If manual entry:

   • Form allows adding multiple rows
   • Save button to import

3. Research Tab - Three Sub-tabs

3A. Watchlist Sub-tab (Default)

Layout: Two Columns

Left Column - Watchlist Manager

• List of stocks you're monitoring
• Click to jump to that stock's research
• Remove from watchlist option

Right Column - Watchlist Overview Table

• Sortable table
• Click ticker to open full research view

3B. Research Sub-tab

Layout: Split Screen (Chat + Results)

Left Panel - Chat Interface

Right Panel - Research Results

Section 1: Company Overview

• Ticker & Name
• 1-2 line description
• Sector, Industry, Market Cap

Section 2: Key Financial Indicators

Static table format, fetched from yfinance/Alpha Vantage

Section 3: Market Sentiment Analysis

• Main Indicator Badge: Buy/Hold/Sell (large, color-coded)
• Confidence Score: 0-100% bar chart

• Analysis Summary: 3-4 sharp, concise lines

  • Institutional investor positioning
  • Analyst price targets and ratings
  • Key catalysts or risks
• Sources: Data sources used (analyst reports, institutional holdings, etc.)

Section 4: Social Media Sentiment Analysis

• Main Indicator Badge: Buy/Hold/Sell (large, color-coded)
• Confidence Score: 0-100% bar chart

• Analysis Summary: 3-4 sharp, concise lines

  • Retail/social consensus
  • Sentiment trend direction
  • Key talking points on social
• Activity Level: Low/Medium/High chatter

Chat History Persistence:

• Entire chat conversation visible on left
• Scroll through all previous queries and agent responses
• Ability to reference earlier research in new queries

3C. Alerts Sub-tab

Layout: Alert Management

Alert Creation Section

Active Alerts Table

• Active/Inactive toggle for each alert
• Edit and Delete actions
• Alert history log showing past triggers

4. Social Media Tracker Tab

Layout Structure

Top Section - Configuration

Collapsible Accounts List

• Click account to expand details
• Remove (X) button for each account
• Add new account by pasting URL/handle

Agent Memory & Instructions Panel (similar to Claude Projects)

Main Content - Social Media Feed

Filter & Sort Section

Feed Cards (Scrollable List)

Expandable Section (Related Posts)

Card Components:

• Account name + platform icon + timestamp
• Post content snippet
• Ticker mentioned (badge/tag)
• AI Sentiment badge (Buy/Hold/Sell) with color
• AI Summary (2-3 concise analysis lines)
• Expand button for related posts
• Original post link
• Engagement metrics (if available)

5. Market Sentiment Tab

Layout Structure

Search & Filter Section (Top)

Sentiment Summary Cards

Trend Analysis

• Sentiment change over last 7 days (chart or trend indicator)
• Recent upgrades/downgrades

Main Content - Analyst Reports Feed

Reports List (Card Format)

Card Components:

• Source name + publish date
• Report type badge (Bank/Hedge Fund/Analyst/Research Firm)
• Sentiment badge (Buy/Hold/Sell)
• Headline/main takeaway
• 2-3 key bullet points
• Rating history sparkline
• Link to original source

Additional Features:

• Sort by: Newest / Most Bullish / Most Bearish / Rating Change
• Filter by Source Type: Banks / Hedge Funds / Analysts / Research Firms
• Sources Footer: List all data sources used (APIs, aggregators, etc.)

6. Settings Tab

User Settings:

• Email / Change password
• Account preferences
• Notification settings (email, in-app alerts)
• Data refresh frequency
• Export data option

API Configuration:

• Display connected APIs (yfinance, Alpha Vantage, etc.)
• API rate limits and usage

7. Color System (Industry Standard)

• Primary background: Dark gray/charcoal (#1a1a1a or similar)
• Secondary background: Lighter gray (#2d2d2d or similar)
• Text: Light gray/white for contrast

• Sentiment Indicators:

  • Buy: Green (#10b981 or similar)
  • Hold: Yellow/Amber (#f59e0b or similar)
  • Sell: Red (#ef4444 or similar)
• Positive P&L: Green
• Negative P&L: Red
• Accent/Primary action: Blue or brand color

8. Data Flow Summary

Portfolio Tab:

• CSV upload → Agent review → User approval → Database storage
• Time filter controls all top-line metrics
• Real-time price updates from APIs

Research Tab - Watchlist:

• Manually add stocks to watchlist
• Watchlist persists per user account

Research Tab - Research:

• User query → Claude AI Agent
• Agent fetches data from yfinance, Alpha Vantage, web scraping
• Returns structured analysis (Company, Indicators, Market Sentiment, Social Sentiment)
• Chat history maintained for reference

Research Tab - Alerts:

• User creates conditions (price, sentiment, P&L)
• System monitors and triggers notifications

Social Media Tracker:

• Agent monitors pre-defined accounts
• Scans posts for ticker mentions
• Analyzes sentiment per post
• User can edit agent instructions
• Feed updates based on filters and sorting

Market Sentiment:

• Agent collects institutional data from free APIs
• Aggregates analyst ratings and price targets
• Displays in card format
• Sources tracked and displayed

This design is now complete and ready for Claude implementation. All workflows, data flows, layouts, and interactions have been specified for full development.

Now let me create the stock management app UI mockup. I'll build a complete, interactive design based on our specification. Let me start with the layout and main components.

Now I'll create the main app structure with all the pages and components. Let me start building the UI mockup:

I've created a complete, interactive UI mockup of your Stock Management App. Here's what's been built:

UI Components Created:

Main Layout

• Sidebar Navigation - Persistent left navigation with Dashboard, Research, Social Media, Market Sentiment tabs
• Header Bar - Portfolio stats display with time filter radio buttons (MTD, YTD, 1M, 6M, 1Y, 5Y, MAX)
• Dark Theme - Professional institutional look with slate/dark colors and green/yellow/red sentiment indicators

Tab 1: Portfolio Dashboard

• Single table view of all positions with: Ticker, Company, Account, Avg Buy, Current Price, Shares, Position Value, P&L ($), P&L (%), Market Sentiment, Social Sentiment
• Upload Portfolio modal with CSV file upload + manual entry
• Filter by Account and Sentiment
• Real-time P&L calculations
• Color-coded sentiment badges

Tab 2: Research (3 Sub-tabs)

• Watchlist - Table of monitored stocks with pricing, 52W high/low, sentiment indicators, last researched date

• Research - Split screen with:

  • Left: AI chat interface with chat history, suggested tickers, input
  • Right: Structured research output (Company Overview, Financial Indicators, Market Sentiment, Social Sentiment)
• Alerts - Create and manage price alerts, sentiment change alerts, P&L threshold alerts

Tab 3: Social Media Tracker

• Left panel: Collapsible monitored accounts list, agent memory/instructions editor, settings
• Right panel: Social media feed with posts from tracked accounts
• Each post shows: Account, Platform, Timestamp, Content, Ticker, AI Sentiment badge, Analysis summary
• Expandable "Related Posts" section for each post
• Filter by Ticker, Sentiment, Source
• Sort by Newest, Most Relevant, Highest Confidence

Tab 4: Market Sentiment

• Search & filter by source type
• Sentiment summary cards (Overall Score, Analyst Rating Distribution, Avg Price Target)
• Sentiment trend visualization
• Analyst reports feed with: Source, Type, Date, Sentiment, Headline, Key Points, Rating History
• Data sources list

The mockup is now interactive and ready for review! You can click between tabs, use the time filter, expand/collapse sections, and interact with all the UI elements. This is a fully functional design that you can evaluate before handing it to Claude for actual implementation with database integration and AI agents.