Skip to content

Writer + Reader tab v10 — active tag position, Reader dashboard boxes #742

@realproject7

Description

@realproject7

Three fixes

1. Move `active` tag next to the deadline counter (Image 242)

Currently active tag and deadline are on the same line but tag is before the dot separator. Put them closer together:

Current:
```
active · Deadline: 1d 7h 41m 14s
Created: Mar 26, 2026
```

After:
```
Deadline: 1d 7h 41m 14s active
Created: Mar 26, 2026
```

Or inline at the end of the countdown: `1d 7h 41m · active`. The active tag should feel attached to the deadline, not floating before it.

2. Reader Portfolio — use 4-box dashboard design with clearer titles (Image 243)

Current Portfolio summary is plain text (Value, Tokens, Best 24h). Convert to 4-box grid matching Writer Stats:

```
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
│ 37.56 │ │ $0.624 │ │ 1 │ │ +0.0% │
│ PLOT │ │ USD │ │ Holdings │ │ Best 24h │
└──────────┘ └──────────┘ └──────────┘ └──────────┘
```

Better title suggestions:

  • "Value" → show the PLOT amount, label "PLOT"
  • "USD" → show dollar value, label "USD"
  • "Tokens" → rename to "Holdings" (clearer)
  • "Best 24h" → show the % change, label "Best 24h"

3. Reader Donations section — use box dashboard design (Image 243)

Current Donations section is plain text. Convert to box layout:

```
DONATIONS

┌──────────┐ ┌──────────┐
│ 150 PLOT │ │ 300 PLOT │
│ Received │ │ Given │
└──────────┘ └──────────┘
```

Or use 4 boxes if there's enough data:
```
┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐
│ 150 PLOT │ │ $2.49 │ │ 300 PLOT │ │ 3 │
│ Received │ │ USD │ │ Given │ │ Donations│
└──────────┘ └──────────┘ └──────────┘ └──────────┘
```

Keep the per-story donation rows below the boxes.

Same box styling as Writer Stats (bordered, number bold on top, label muted below, `grid-cols-2 sm:grid-cols-4`).

Files to modify

  • `src/app/profile/[address]/page.tsx` — Writer deadline section + Reader Portfolio/Donations

Branch

`task/742-tab-v10-polish`

Self-Verification (T3)

  • Active tag positioned next to/after the deadline counter
  • Reader Portfolio: 4-box grid (PLOT, USD, Holdings, Best 24h)
  • Reader Donations: box layout (Received, Given)
  • Box styling matches Writer Stats (bordered, number top, label bottom)
  • Mobile (375px): boxes don't overflow
  • `npm run build` passes

Metadata

Metadata

Assignees

No one assigned

    Labels

    agent/T3Assigned to T3 builder agent

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions