mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 03:45:06 +03:00
764d10986d
* Fix tests in tests/unit, tests/components and files under tests, looking into tests/pages * Fix tests under pages/projects root * Fix * Comment out broken tests that im stuck with * Fix api-report.test * Fix storage-report-test * chore: fix some tests * chore: remove logging * Fix LogsPreviewer.test.js * Fix most of logs-query-test * Skip broken tests instead of false positiving them * Replace jest with vitest * Rename all *.test.js to *.test.ts * Configure vitest to work with jsx * fix vitest issues, fix tests, skip broken tests, add msw, add next-router-mock * uncomment file * add tests for msw and nrm * Fix failing tests * fix tests in RowEditor * fix datepicker tests * fix type errors and comment out tests that need some refactoring * leave 1 test so test script works * rm clog and aaaaa * rename script * move msw to studio * add pckg json which i forgot in last commit * rm consolelog * move vitest ui dep * Move next-router-mock to studio. --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com> Co-authored-by: TzeYiing <ty@tzeyiing.com> Co-authored-by: Kamil Ogórek <kamil.ogorek@gmail.com> Co-authored-by: Terry Sutton <saltcod@gmail.com> Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.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
const ComponentA = ({ sampleProp }: ComponentAProps) => {
return <div>ComponentA: {sampleProp}</div>
}
export default ComponentA