docs: Update coinbase ticker to use product id as pk

reactive · Dec 7, 2023 · e0a8dd8 · e0a8dd8
1 parent df87fcb
commit e0a8dd8
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 4 deletions.
diff --git a/docs/core/shared/_useLive.mdx b/docs/core/shared/_useLive.mdx
@@ -6,6 +6,7 @@ import HooksPlayground from '@site/src/components/HooksPlayground';
 import { Entity, RestEndpoint } from '@data-client/rest';
 
 export class Ticker extends Entity {
+  product_id = '';
   trade_id = 0;
   price = 0;
   size = '0';
@@ -15,7 +16,7 @@ export class Ticker extends Entity {
   volume = '';
 
   pk(): string {
-    return `${this.trade_id}`;
+    return `${this.product_id}`;
   }
   static key = 'Ticker';
 
@@ -30,6 +31,10 @@ export const getTicker = new RestEndpoint({
   path: '/products/:productId/ticker',
   schema: Ticker,
   pollFrequency: 2000,
+  process(value, { productId }) {
+    value.product_id = productId;
+    return value;
+  }
 });
 ```
 

diff --git a/docs/rest/guides/pagination.md b/docs/rest/guides/pagination.md
@@ -69,7 +69,6 @@ export const PostResource = createResource({
 ```
 
 ```tsx title="PostItem" collapsed
-import { useSuspense } from '@data-client/react';
 import { type Post } from './Post';
 
 export default function PostItem({ post }: Props) {

diff --git a/examples/nextjs/resources/Ticker.ts b/examples/nextjs/resources/Ticker.ts
@@ -4,6 +4,7 @@ import { Temporal } from '@js-temporal/polyfill';
 
 // Visit https://dataclient.io/docs/guides/resource-types to read more about these definitions
 export class Ticker extends Entity {
+  product_id = '';
   trade_id = 0;
   price = 0;
   size = '0';
@@ -31,6 +32,10 @@ export const getTicker = new RestEndpoint({
   path: '/products/:productId/ticker',
   schema: Ticker,
   pollFrequency: 2000,
+  process(value, { productId }) {
+    value.product_id = productId;
+    return value;
+  }
 });
 
 export let TickerFixtures: Record<string, FixtureEndpoint> = {};

diff --git a/website/src/components/Demo/code/live-app/polling/resources.ts b/website/src/components/Demo/code/live-app/polling/resources.ts
@@ -1,6 +1,7 @@
 import { Entity, RestEndpoint } from '@data-client/rest';
 
 export class Ticker extends Entity {
+  product_id = '';
   trade_id = 0;
   price = 0;
   size = '0';
@@ -27,4 +28,8 @@ export const getTicker = new RestEndpoint({
   schema: Ticker,
   // in miliseconds
   pollFrequency: 2000,
+  process(value, { productId }) {
+    value.product_id = productId;
+    return value;
+  },
 });
diff --git a/website/src/components/Playground/StoreInspector.tsx b/website/src/components/Playground/StoreInspector.tsx
@@ -20,9 +20,13 @@ function StoreInspector({
     <>
       <div className={styles.debugToggle} onClick={toggle}>
         Store
-        <span className={clsx(styles.arrow, rotation, styles.vertical)}>▶</span>
+        <span className={clsx(styles.arrow, rotation, styles.vertical)}>
+          ▶
+        </span>
       </div>
-      {isSelected ? <StoreTreeM /> : null}
+      {isSelected ?
+        <StoreTreeM />
+      : null}
     </>
   );
 }