Improve channel storage UI

[tudddorrr]

No description provided.

[claude]

Code Review for PR #438

🔵 Code Quality - Minor

Inconsistent styling pattern (src/pages/ChannelStorage.tsx:97-100)

The new code wraps <code> inside a <span>, which differs from the existing pattern in Identifier.tsx:14:

// Existing pattern (Identifier.tsx)
<code className='bg-gray-900 rounded p-2 text-xs md:text-sm'>

// New pattern (ChannelStorage.tsx)
<span className='bg-gray-900 rounded text-xs flex'>
  <code className='align-middle inline-block p-2 break-all'>

While PropBadges.tsx uses a similar wrapper pattern, it serves a functional purpose (adding an action button). Here the extra <span> wrapper doesn't appear necessary. Consider applying styling directly to <code> to match the simpler pattern used in Identifier.tsx.

---

⚠️ Performance - Minor

Fixed width may cause table layout issues (src/pages/ChannelStorage.tsx:97)

Using both min-w-[400px] and max-w-[400px] creates a fixed 400px column that cannot shrink on smaller screens. The parent Table component has overflow-x-scroll (Table.tsx:14), but other cells in the row will still occupy space, potentially creating excessive horizontal scrolling on mobile devices.

Consider:

• Using only min-w-[400px] (like PropsEditor.tsx:164) and allowing growth
• Or adding responsive classes like lg:min-w-0 (like Groups.tsx:126) for better mobile UX

---

Security, Bugs

No issues found.