fix(ui): раскрывать большую очередь проблем порциями

app/(main)/dashboard/page.tsx

@@ -1,5 +1,7 @@
 "use client"
 
+import { useState } from "react"
+import { Button } from "@/components/ui/button"
 import Link from "next/link"
 import {
   ActivityIcon,
@@ -36,6 +38,8 @@ function fmtIntRu(n: number): string {
 }
 
 function AttentionRows({ rows }: { rows: AttentionRow[] }) {
+  const [expanded,setExpanded]=useState(false)
+  const [visible,setVisible]=useState(55)
   function renderRow(row: AttentionRow) {
     return (
       <Link
@@ -59,9 +63,10 @@ function AttentionRows({ rows }: { rows: AttentionRow[] }) {
     <div className="flex flex-col gap-0.5">
       {rows.slice(0, 5).map(renderRow)}
       {rows.length > 5 && (
-        <details>
+        <details onToggle={event=>{setExpanded(event.currentTarget.open);if(!event.currentTarget.open)setVisible(55)}}>
           <summary className="cursor-pointer rounded-md px-1 py-2 text-xs text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring">Ещё {rows.length - 5}</summary>
-          {rows.slice(5).map(renderRow)}
+          {expanded && rows.slice(5,visible).map(renderRow)}
+          {expanded && rows.length>visible && <Button type="button" variant="ghost" size="sm" onClick={()=>setVisible(count=>Math.min(count+50,rows.length))}>Показать ещё {Math.min(50,rows.length-visible)}</Button>}
         </details>
       )}
     </div>