cognite-create 0.2.16 → 0.2.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bin/index.js +3 -0
- package/package.json +2 -2
- package/templates/.cursor/rules/general.mdc +27 -1
- package/templates/.env.example +7 -10
- package/templates/README.MD +198 -0
package/bin/index.js
CHANGED
|
@@ -8,6 +8,9 @@ const fs = require("node:fs/promises");
|
|
|
8
8
|
const path = require("node:path");
|
|
9
9
|
|
|
10
10
|
const REQUIRED_DEPENDENCIES = [
|
|
11
|
+
{ name: "recharts", version: "^3.2.1" },
|
|
12
|
+
{ name: "@cognite/sdk", version: "^10.2.0" },
|
|
13
|
+
{ name: "date-fns", version: "^4.1.0" },
|
|
11
14
|
{ name: "tailwind-merge", version: "^3.3.1" },
|
|
12
15
|
{ name: "tw-animate-css", version: "^1.3.8" },
|
|
13
16
|
{ name: "clsx", version: "^2.1.1" },
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cognite-create",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.19",
|
|
4
4
|
"description": "Create a Next.js app preconfigured with Cognite defaults.",
|
|
5
5
|
"bin": {
|
|
6
6
|
"cognite-create": "./bin/index.js"
|
|
@@ -13,4 +13,4 @@
|
|
|
13
13
|
"node": ">=18.0.0"
|
|
14
14
|
},
|
|
15
15
|
"license": "UNLICENSED"
|
|
16
|
-
}
|
|
16
|
+
}
|
|
@@ -8,4 +8,30 @@ Use the ShadCN MCP server to list the Cognite registry for components you can us
|
|
|
8
8
|
|
|
9
9
|
Always use semantic Tailwind color classes (e.g., bg-primary, text-primary, border-primary) instead of arbitrary color values (e.g., bg-blue-600, text-red-500). This ensures consistency with the design system.
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
When setting up auth rememeber to set up the oidcTokenProvider.
|
|
12
|
+
|
|
13
|
+
Use this function to get the token string:
|
|
14
|
+
|
|
15
|
+
export const getToken = async (clientId: string, clientSecret: string) => {
|
|
16
|
+
const header = "Basic " + btoa(`${clientId}:${clientSecret}`);
|
|
17
|
+
|
|
18
|
+
const response = await fetch("https://auth.cognite.com/oauth2/token", {
|
|
19
|
+
method: "POST",
|
|
20
|
+
headers: {
|
|
21
|
+
Authorization: header,
|
|
22
|
+
"Content-Type": "application/x-www-form-urlencoded",
|
|
23
|
+
},
|
|
24
|
+
body: new URLSearchParams({
|
|
25
|
+
grant_type: "client_credentials",
|
|
26
|
+
}),
|
|
27
|
+
});
|
|
28
|
+
|
|
29
|
+
const data = await response.json();
|
|
30
|
+
|
|
31
|
+
console.log("Token response:", data);
|
|
32
|
+
return data.access_token;
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
Always run `pnpm lint` after you make changes to make sure you have fixed all potential errors.
|
|
36
|
+
|
|
37
|
+
Make sure all client and server components are handled properly and you are not passing client events from server components.
|
package/templates/.env.example
CHANGED
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
#
|
|
2
|
-
|
|
1
|
+
# Cognite Configuration
|
|
2
|
+
NEXT_PUBLIC_COGNITE_PROJECT=your-project-name
|
|
3
|
+
NEXT_PUBLIC_COGNITE_BASE_URL=https://api.cognitedata.com
|
|
3
4
|
|
|
4
|
-
#
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
# Authentication (Service Account)
|
|
10
|
-
CLIENT_ID=your_client_id
|
|
11
|
-
CLIENT_SECRET=your_client_secret
|
|
5
|
+
# OIDC Authentication (Required for production)
|
|
6
|
+
NEXT_PUBLIC_COGNITE_CLIENT_ID=your_client_id
|
|
7
|
+
NEXT_PUBLIC_COGNITE_TENANT_ID=6a5949bb-8ea1-4bd1-aa0a-4d03846de30e
|
|
8
|
+
COGNITE_CLIENT_SECRET=your_client_secret
|
|
@@ -0,0 +1,198 @@
|
|
|
1
|
+
# CDF Application Template
|
|
2
|
+
|
|
3
|
+
A React application template for building applications with Cognite Data Fusion (CDF) using AI assistance.
|
|
4
|
+
|
|
5
|
+
## Prerequisites
|
|
6
|
+
|
|
7
|
+
This project requires Node.js v22 or higher and npm (Node Package Manager).
|
|
8
|
+
|
|
9
|
+
**Don't have Node.js installed?** See [Installing Node.js and npm](#installing-nodejs-and-npm) at the bottom of this document.
|
|
10
|
+
|
|
11
|
+
## Initial Setup
|
|
12
|
+
|
|
13
|
+
1. **Configure your app:** Fill in `app.json` with your application details
|
|
14
|
+
2. **Install dependencies:** `npm install`
|
|
15
|
+
3. **Start development server:** `npm start`
|
|
16
|
+
4. **Deploy to CDF:** `npm run deploy`
|
|
17
|
+
|
|
18
|
+
### Optional: Enable Fast Deployment & MCP Server
|
|
19
|
+
|
|
20
|
+
Create a `.env` file with your CDF credentials:
|
|
21
|
+
|
|
22
|
+
```
|
|
23
|
+
CLIENT_ID=your-client-id
|
|
24
|
+
CLIENT_SECRET=your-client-secret
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
This enables:
|
|
28
|
+
|
|
29
|
+
- **Faster CI deployment:** `npm run deploy:ci`
|
|
30
|
+
- **MCP server for Cursor:** AI can query and create data models directly in CDF
|
|
31
|
+
|
|
32
|
+
## Features
|
|
33
|
+
|
|
34
|
+
- **MCP Server Integration:** Query CDF data models, spaces, views, and containers directly through Cursor
|
|
35
|
+
- **Cognite Design System:** Pre-configured `cdf-design-system-alpha` for consistent UI styling
|
|
36
|
+
- **Requirements Template:** Structured template to guide AI in building your application
|
|
37
|
+
- **Authentication Included:** Ready-to-use auth for both local development and CDF hosting
|
|
38
|
+
- **Data Modeling Support:** AI can help structure and connect to CDF data models
|
|
39
|
+
|
|
40
|
+
## Building Your Application
|
|
41
|
+
|
|
42
|
+
### 1. Request a Requirements Doc
|
|
43
|
+
|
|
44
|
+
Ask your AI assistant to create requirements based on your input:
|
|
45
|
+
|
|
46
|
+
```
|
|
47
|
+
"Write me a set of requirements for an application that [describe your needs]"
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
Review the generated requirements carefully. Add, remove, or modify as needed.
|
|
51
|
+
|
|
52
|
+
### 2. Review Requirements List
|
|
53
|
+
|
|
54
|
+
Go through the requirements document line by line. Make sure it accurately captures what you want to build.
|
|
55
|
+
|
|
56
|
+
### 3. Request a Dummy Data Version
|
|
57
|
+
|
|
58
|
+
Start with a working prototype using mock data:
|
|
59
|
+
|
|
60
|
+
```
|
|
61
|
+
"Build a dummy data version of this application based on the requirements"
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
### 4. Build and Iterate
|
|
65
|
+
|
|
66
|
+
Run `npm start` and test your application. Iterate on the UI, functionality, and user experience with your AI assistant.
|
|
67
|
+
|
|
68
|
+
### 5. Connect to CDF (Step by Step)
|
|
69
|
+
|
|
70
|
+
Once satisfied with the prototype, connect it to real CDF data:
|
|
71
|
+
|
|
72
|
+
```
|
|
73
|
+
"Let's connect this to CDF data models. Start by creating the space and containers we need."
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
Take this **step by step** - this is where you're most likely to run into issues. Create spaces, then containers, then views, then connect your UI.
|
|
77
|
+
|
|
78
|
+
## Tips and Tricks
|
|
79
|
+
|
|
80
|
+
### Important Warnings
|
|
81
|
+
|
|
82
|
+
⚠️ **If you get errors:** Copy-paste the error into Cursor. If it doesn't work after 3 attempts, ask it to simplify the approach.
|
|
83
|
+
|
|
84
|
+
⚠️ **Don't try to implement notifications** - This rarely works well
|
|
85
|
+
|
|
86
|
+
⚠️ **Don't extend existing data models** - It will likely not work. Create new views instead.
|
|
87
|
+
|
|
88
|
+
⚠️ **Don't delete data models** - You can't easily recover them
|
|
89
|
+
|
|
90
|
+
⚠️ **Limited availability:** Only enabled for select Cognite projects (e.g., lervik, atlas). Not to be used in customer projects.
|
|
91
|
+
|
|
92
|
+
⚠️ **Commit after every step** - Version control saves you from having to rebuild everything
|
|
93
|
+
|
|
94
|
+
### Helpful Prompts
|
|
95
|
+
|
|
96
|
+
- Open browser console to see errors, paste them into Cursor
|
|
97
|
+
- If AI isn't using the design system: "Please use the cdf-design-system-alpha design system"
|
|
98
|
+
- To get correct types: "Fetch the [ViewName] view from CDF and use that to define the type"
|
|
99
|
+
- To check data models: "List the available views in the [space_name] space"
|
|
100
|
+
|
|
101
|
+
## Environment Variables
|
|
102
|
+
|
|
103
|
+
Your `.env` file (optional, for MCP and fast deployment):
|
|
104
|
+
|
|
105
|
+
```
|
|
106
|
+
CLIENT_ID=your-client-id
|
|
107
|
+
CLIENT_SECRET=your-client-secret
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
## Development Commands
|
|
111
|
+
|
|
112
|
+
- `npm start` - Start development server
|
|
113
|
+
- `npm run build` - Build for production
|
|
114
|
+
- `npm run lint` - Run linter
|
|
115
|
+
- `npm run deploy` - Deploy to CDF
|
|
116
|
+
- `npm run deploy:ci` - Fast deployment (requires .env)
|
|
117
|
+
|
|
118
|
+
## Security
|
|
119
|
+
|
|
120
|
+
- Never commit `.env` files
|
|
121
|
+
- Environment files are automatically ignored by git
|
|
122
|
+
- Use service account credentials for deployment only
|
|
123
|
+
|
|
124
|
+
---
|
|
125
|
+
|
|
126
|
+
## Installing Node.js and npm
|
|
127
|
+
|
|
128
|
+
This project requires Node.js v22 or higher and npm (Node Package Manager).
|
|
129
|
+
|
|
130
|
+
### macOS
|
|
131
|
+
|
|
132
|
+
**Option 1: Using Homebrew (recommended)**
|
|
133
|
+
|
|
134
|
+
```bash
|
|
135
|
+
# Install Homebrew if you don't have it
|
|
136
|
+
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
|
|
137
|
+
|
|
138
|
+
# Install Node.js (includes npm)
|
|
139
|
+
brew install node@22
|
|
140
|
+
```
|
|
141
|
+
|
|
142
|
+
**Option 2: Using the official installer**
|
|
143
|
+
|
|
144
|
+
1. Download the installer from [nodejs.org](https://nodejs.org/)
|
|
145
|
+
2. Choose the LTS (Long Term Support) version
|
|
146
|
+
3. Run the installer and follow the prompts
|
|
147
|
+
|
|
148
|
+
### Windows
|
|
149
|
+
|
|
150
|
+
**Option 1: Using the official installer (recommended)**
|
|
151
|
+
|
|
152
|
+
1. Download the installer from [nodejs.org](https://nodejs.org/)
|
|
153
|
+
2. Choose the LTS (Long Term Support) version
|
|
154
|
+
3. Run the `.msi` installer and follow the prompts
|
|
155
|
+
4. Restart your terminal/command prompt
|
|
156
|
+
|
|
157
|
+
**Option 2: Using Chocolatey**
|
|
158
|
+
|
|
159
|
+
```powershell
|
|
160
|
+
# Install Chocolatey if you don't have it
|
|
161
|
+
Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))
|
|
162
|
+
|
|
163
|
+
# Install Node.js
|
|
164
|
+
choco install nodejs-lts
|
|
165
|
+
```
|
|
166
|
+
|
|
167
|
+
### Linux
|
|
168
|
+
|
|
169
|
+
**Ubuntu/Debian:**
|
|
170
|
+
|
|
171
|
+
```bash
|
|
172
|
+
# Install Node.js 22.x
|
|
173
|
+
curl -fsSL https://deb.nodesource.com/setup_22.x | sudo -E bash -
|
|
174
|
+
sudo apt-get install -y nodejs
|
|
175
|
+
```
|
|
176
|
+
|
|
177
|
+
**Fedora/RHEL/CentOS:**
|
|
178
|
+
|
|
179
|
+
```bash
|
|
180
|
+
# Install Node.js 22.x
|
|
181
|
+
curl -fsSL https://rpm.nodesource.com/setup_22.x | sudo bash -
|
|
182
|
+
sudo yum install -y nodejs
|
|
183
|
+
```
|
|
184
|
+
|
|
185
|
+
**Arch Linux:**
|
|
186
|
+
|
|
187
|
+
```bash
|
|
188
|
+
sudo pacman -S nodejs npm
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
### Verify Installation
|
|
192
|
+
|
|
193
|
+
After installation, verify that Node.js and npm are installed correctly:
|
|
194
|
+
|
|
195
|
+
```bash
|
|
196
|
+
node --version # Should show v22.x.x or higher
|
|
197
|
+
npm --version # Should show 10.x.x or higher
|
|
198
|
+
```
|