mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 02:15:05 +03:00
Francesco SansalvadoreandClaude Sonnet 5
a87e49685f
Splits Storage Size into current versus noncurrent objects, and attributes the noncurrent portion to the buckets responsible, so the cost of object versioning sits with the metric it inflates. The split is flag-aware. With the preview off, Storage Size renders exactly the single real series it does today; `USAGE_CATEGORIES` takes an options argument and only emits the two stacked segments when the preview is on. Noncurrent is deliberately not split further into noncurrent versions and soft-deleted files: the platform can't reliably tell the two apart after the fact, and the user's lever for shrinking either is the same lifecycle policy. Using S3's own terms also reads better than Studio-only words like "live". - `storage-retention-usage-query.ts` — org-scoped (the prototype keyed this org-level data under `['projects', undefined, …]`), real `queryOptions` shape with the endpoint stubbed - `StorageRetention.constants.ts` — one definition of the two segments, used by both the chart attributes and the breakdown table, so labels, colors and key casing cannot drift - `StorageRetention.utils.ts` + tests — maps retention days onto chart points - `StorageRetentionBreakdown.tsx` — the segment table, retained-data warning, and per-bucket list, rendered through the existing `additionalInfo` hook - `Usage.colors.ts` — `COLOR_MAP` and `AttributeColor` moved out of `Usage.constants` so the breakdown can read a color token without a cycle back through the module that renders it Known limitation: with the preview on, the stacked chart and the breakdown read zeros until the retention endpoint exists. No mock data is shipped. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Writing components
Where to create your components
- For components that declare the general structure and layout of a page:
/components/layouts/xxx
- For components that are tightly coupled to a specific interface:
/components/interfaces/xxx
- For components that are meant to be reusable across multiple pages:
/components/ui/xxx
- Note: We're gradually moving files out of the
to-be-cleanedfolder into the respective folders as we refactor
Component structure
- If a component has constants and utility methods that are tightly coupled to itself, keep them close to the component and enclose them in a folder with an
index.tsxas an entry point - Otherwise it can just be a file on its own
- For example:
-
components/ui - SampleComponentA - SampleComponentA.tsx - SampleComponentA.constants.ts - SampleComponentA.utils.ts - SampleComponentA.types.ts - index.ts - SampleComponentB.tsx
-
Template for building components
// Declare the prop types of your component
interface ComponentAProps {
sampleProp: string
}
// Name your component accordingly — use a named export, not a default export
export const ComponentA = ({ sampleProp }: ComponentAProps) => {
return <div>ComponentA: {sampleProp}</div>
}