cognite-create 0.2.41 → 0.2.42

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cognite-create",
-  "version": "0.2.41",
+  "version": "0.2.42",
   "description": "Create a Next.js app preconfigured with Cognite defaults.",
   "bin": {
     "cognite-create": "./bin/index.js"

package/templates/.cursor/rules/general.mdc

@@ -11,79 +11,72 @@ Always use semantic Tailwind color classes (e.g., bg-primary, text-primary, bord
 Layout & Components
 Make sure to put the components together in a cohesive manner.
 Make sure to properly handle x and y values to proper scales.
-Make sure you are properly handling timezoned dates between client and server.
+Make sure you are properly handling timezoned dates.
 
 Chart Rendering Rules
-Use direct hex colors: Avoid CSS variables like var(--color-*) in stroke properties
+Use direct hex colors: Avoid CSS variables like var(--color-\*) in stroke properties
 Make sure charts have properly formatted value properties to display data.
 Use real Cognite data from the SDK.
 Be really careful with x chart values and make sure you are rendering them correctly. Keep consistent with date and timestamp formatting as this can cause rendering issues.
 
 CogniteSDK Rules
 
-Environment Variables
-# Cognite Configuration
-NEXT_PUBLIC_COGNITE_PROJECT=
-NEXT_PUBLIC_COGNITE_BASE_URL=
+This is a client-side only application. All Cognite SDK calls are made directly from the browser.
 
-# OIDC Authentication (Required for production)
-NEXT_PUBLIC_COGNITE_CLIENT_ID=
-COGNITE_CLIENT_SECRET=
+Environment Variables
 
-Make sure to build fallbacks for any error or empty states.
+# Cognite Configuration
 
-All CogniteSDK calls should be done server side in server actions or in server components.
+COGNITE_PROJECT=
+COGNITE_BASE_URL=
 
-We can't use the cognite sdk in the browser as the COGNITE_CLIENT_SECRET is private.
+# OIDC Authentication (Required for production)
 
-Prefer server actions over API routes.
+COGNITE_CLIENT_ID=
 
-When setting up auth rememeber to set up the oidcTokenProvider.
+SDK Usage
 
-Use this function to get the token string:
+The Cognite SDK is initialized and provided through the infrastructure components. Use the `useCDF` hook to access the authenticated SDK client in any component:
 
-export const getToken = async (clientId: string, clientSecret: string) => {
-  const header = "Basic " + btoa(`${clientId}:${clientSecret}`);
+```tsx
+import { useCDF } from "@/infrastructure/hooks/useCDF";
 
-  const response = await fetch("https://auth.cognite.com/oauth2/token", {
-    method: "POST",
-    headers: {
-      Authorization: header,
-      "Content-Type": "application/x-www-form-urlencoded",
-    },
-    body: new URLSearchParams({
-      grant_type: "client_credentials",
-    }),
-  });
+function MyComponent() {
+  const sdk = useCDF();
 
-  const data = await response.json();
+  // Use sdk to make API calls
+  const timeSeries = await sdk.timeseries.list().autoPagingToArray();
+}
+```
 
-  console.log("Token response:", data);
-  return data.access_token;
-};
+All data fetching happens client-side. Use React Query for managing async data:
 
-Always run `pnpm lint` after you make changes to make sure you have fixed all potential errors.
+- Wrap SDK calls in custom hooks using `useQuery` or `useMutation`
+- Handle loading and error states appropriately
+- Cache data effectively to minimize API calls
 
-Make sure all client and server components are handled properly and you are not passing client events from server components.
+Authentication is handled by the infrastructure layer - use the provided components from `/src/infrastructure`. The infrastructure handles token management and SDK initialization automatically.
 
-Security Fix: Moved Cognite SDK authentication to server-side API routes (/api/cognite/*) to keep client secrets secure, with client-side service using fetch() calls to these routes.
+Make sure to build fallbacks for any error or empty states.
 
-Date Format Fix: Converted Date objects to Unix timestamps (milliseconds) before sending to Cognite API, as it doesn't accept ISO strings.
+Always run `npm run lint` after you make changes to make sure you have fixed all potential errors.
 
-Granularity/Aggregates Fix: Ensured aggregates are always provided when granularity is specified (Cognite API requirement), defaulting to "average" aggregation.
+Date Format Fix: Convert Date objects to Unix timestamps (milliseconds) before sending to Cognite API, as it doesn't accept ISO strings.
 
-Aggregated Data Display: Updated chart component to handle both regular datapoints (value) and aggregated datapoints (average, max, min, etc.) since granularity returns aggregated data.
+Granularity/Aggregates Fix: Ensure aggregates are always provided when granularity is specified (Cognite API requirement), defaulting to "average" aggregation.
 
-UI Enhancement: Replaced search dialog with dropdown interface for time series selection, providing better UX with automatic loading and filtering of available time series.
+Aggregated Data Display: Update chart components to handle both regular datapoints (value) and aggregated datapoints (average, max, min, etc.) since granularity returns aggregated data.
 
-Prefer select dropdowns with in built search
+UI Enhancement: Prefer select dropdowns with built-in search for better user experience.
 
 WATCH OUT FOR THIS BUG WITH SHADCN SELECTS:
 A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.
 
 src/components/ui/cognite/select.tsx (107:5) @ SelectItem
 
+105 | }: React.ComponentProps<typeof SelectPrimitive.Item>) {
+106 | return (
+
+> 107 | <SelectPrimitive.Item
 
-  105 | }: React.ComponentProps<typeof SelectPrimitive.Item>) {
-  106 |   return (
-> 107 |     <SelectPrimitive.Item
+Use React best practices when calling useEffect, make sure we are using useMemo and useCallback effectively to avoid re-renders.

package/templates/.env.example

@@ -0,0 +1,7 @@
+# Cognite Configuration
+VITE_COGNITE_PROJECT=
+VITE_COGNITE_BASE_URL=
+
+# OIDC Authentication (Required for production)
+VITE_COGNITE_CLIENT_ID=
+VITE_COGNITE_CLIENT_SECRET=