RSC: server cells lowercase data function (#10015)

redwoodjs · Feb 15, 2024 · ef015ca · ef015ca
1 parent cfd4c92
commit ef015ca
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 12 deletions.
diff --git a/...-and-cells/web/src/components/UserExample/UserExampleServerCell/UserExampleServerCell.tsx b/...-and-cells/web/src/components/UserExample/UserExampleServerCell/UserExampleServerCell.tsx
@@ -1,4 +1,3 @@
-import type Prisma from '@prisma/client'
 import type { CellSuccessProps, CellFailureProps } from '@redwoodjs/web'
 
 import { db } from 'api/src/lib/db'
@@ -9,7 +8,7 @@ interface DataArgs {
   id: number
 }
 
-export const DATA = async ({ id }: DataArgs) => {
+export const data = async ({ id }: DataArgs) => {
   const userExample = await db.userExample.findUnique({
     where: { id },
   })
@@ -25,8 +24,8 @@ export const Failure = ({ error }: CellFailureProps) => (
   <div className="rw-cell-error">{error?.message}</div>
 )
 
-export const Success = ({
-  userExample,
-}: CellSuccessProps<{ userExample: Prisma.UserExample }>) => {
+type SuccessProps = CellSuccessProps<Awaited<ReturnType<typeof data>>>
+
+export const Success = ({ userExample }: SuccessProps) => {
   return <UserExample userExample={userExample} />
 }
diff --git a/packages/babel-config/src/plugins/babel-plugin-redwood-cell.ts b/packages/babel-config/src/plugins/babel-plugin-redwood-cell.ts
@@ -22,7 +22,7 @@ import type { PluginObj, types } from '@babel/core'
 const EXPECTED_EXPORTS_FROM_CELL = [
   'beforeQuery',
   'QUERY',
-  'DATA',
+  'data',
   'isEmpty',
   'afterQuery',
   'Loading',
@@ -122,14 +122,14 @@ export default function ({ types: t }: { types: typeof types }): PluginObj {
         },
         exit(path) {
           const hasQueryOrDataExport =
-            exportNames.includes('QUERY') || exportNames.includes('DATA')
+            exportNames.includes('QUERY') || exportNames.includes('data')
 
           // If the file already has a default export then
           //   1. It's likely not a cell, or it's a cell that's already been
           //      wrapped in `createCell`
           //   2. If we added another default export we'd be breaking JS module
           //      rules. There can only be one default export.
-          // If there's no QUERY or DATA export it's not a valid cell
+          // If there's no `QUERY` or `data` export it's not a valid cell
           if (hasDefaultExport || !hasQueryOrDataExport) {
             return
           }

diff --git a/packages/web/src/components/cell/createServerCell.tsx b/packages/web/src/components/cell/createServerCell.tsx
@@ -14,7 +14,7 @@ type CreateServerCellProps<CellProps, CellVariables> = Omit<
   CreateCellProps<CellProps, CellVariables>,
   'QUERY' | 'Failure'
 > & {
-  DATA: (variables?: AnyObj) => any
+  data: (variables?: AnyObj) => any
   Failure?: React.ComponentType<{
     error: unknown
     queryResult: { refetch: (variables: CellProps) => AnyObj }
@@ -30,7 +30,7 @@ export function createServerCell<
   createCellProps: CreateServerCellProps<CellProps, CellVariables> // 👈 AnyObj, because using CellProps causes a TS error
 ): React.FC<CellProps> {
   const {
-    DATA,
+    data: dataFn,
     isEmpty = isDataEmpty,
     Loading,
     Failure,
@@ -51,15 +51,15 @@ export function createServerCell<
       const queryResultWithRefetch = {
         refetch: (variables: CellProps | undefined) => {
           // TODO (RSC): How do we refresh the page with new data?
-          return DATA(variables)
+          return dataFn(variables)
         },
       }
 
       return <Failure error={error} queryResult={queryResultWithRefetch} />
     }
 
     try {
-      const data = await DATA(variables)
+      const data = await dataFn(variables)
 
       if (isEmpty(data, { isDataEmpty }) && Empty) {
         return <Empty {...props} {...data} />