import{u as l,j as o}from"./query-CBHSEszN.js";import{I as s,a as i}from"./index-BXO8FbHk.js";import{a as d,P as c,E as p}from"./PageError-B8nAUtH9.js";import"./react-B_PbFb63.js";async function x(e=100,a,r){try{const t=new URLSearchParams({limit:String(e)});return await d(`/my/photos/?${t}`)}catch(t){throw t instanceof Error?t:new Error("fetchPhotos failed")}}function h(e){return l({queryKey:["photos",e],queryFn:()=>x(100,void 0,e),refetchInterval:6e4})}const f=i.div`
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
`,g=i.h1`
  margin: 0;
  padding: 14px 20px;
  font-size: 18px;
  font-weight: 700;
  color: #e0e0f0;
  border-bottom: 1px solid #2a2a38;
  background: #0a0a0f;
`,u=i.span`
  font-size: 11px;
  color: #8a8a9a;
  padding: 8px 20px 4px;
`,m=i.ul`
  list-style: none;
  margin: 0;
  padding: 16px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
  overflow-y: auto;
  flex: 1;
`,b=i.li`
  aspect-ratio: 1;
  background: #1c1c26;
  border: 1px solid #2a2a38;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  cursor: default;
  transition: border-color 0.15s;

  &:hover {
    border-color: rgba(201,168,76,0.4);
  }
`,y=i.img`
  width: 100%;
  flex: 1;
  object-fit: cover;
  min-height: 0;
  display: block;
  background: #13131a;
`,j=i.div`
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3a3a4a;
`,v=i.span`
  font-size: 10px;
  color: #8a8a9a;
  padding: 4px 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
`,n=i.span`
  position: absolute;
  top: 4px;
  left: 4px;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: 9px;
  padding: 2px 5px;
  border-radius: 3px;
`,w=i.div`
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
`,P=i.div`
  padding: 20px;
  font-size: 12px;
  color: #8a8a9a;
  text-align: center;
`;function T(e){return e.storageKey?`/my/photos/${encodeURIComponent(e.storageKey)}`:null}function z({photo:e}){const a=T(e),r=e.filename||e.externalId;return o.jsxs(b,{"aria-label":r,children:[o.jsxs(w,{children:[a?o.jsx(y,{src:a,alt:r,loading:"lazy"}):o.jsx(j,{"aria-hidden":"true",children:o.jsx(s,{size:24})}),e.mediaType==="video"&&o.jsx(n,{"aria-label":"Video",children:"video"}),e.mediaType==="live_photo"&&o.jsx(n,{"aria-label":"Live photo",children:"live"})]}),o.jsx(v,{title:r,children:r})]})}function R(){const{data:e,isLoading:a,error:r}=h();return o.jsxs(f,{children:[o.jsx(g,{children:"Photos"}),a&&o.jsx(P,{"aria-live":"polite",children:"Loading photos…"}),r&&o.jsx(c,{message:"Failed to load photos"}),!a&&!r&&(e==null?void 0:e.length)===0&&o.jsx(p,{icon:o.jsx(s,{size:36}),heading:"No photos",sub:"Photos will appear here once sync runs."}),!a&&!r&&e&&e.length>0&&o.jsxs(o.Fragment,{children:[o.jsxs(u,{children:[e.length," photo",e.length!==1?"s":""]}),o.jsx(m,{"aria-label":"Photo grid",children:e.map(t=>o.jsx(z,{photo:t},t.id))})]})]})}export{R as PhotosTab};
