Skip to content

Commit b88fc1f

Browse files
committed
Website/frontend: remove outdated content and text copied from files
The documentation in the code is enough, and we should rely more on this.
1 parent 420921b commit b88fc1f

File tree

1 file changed

+1
-361
lines changed

1 file changed

+1
-361
lines changed

website/docs/developers/frontend/environment-configuration.mdx

Lines changed: 1 addition & 361 deletions
Original file line numberDiff line numberDiff line change
@@ -30,357 +30,6 @@ with full JSDoc documentation.
3030

3131
<!-- prettier-ignore-stop -->
3232

33-
```javascript
34-
export default {
35-
// Core settings
36-
production: boolean,
37-
canAddNodes: boolean,
38-
hideNodeStats: boolean,
39-
showWebNodeLandingPage: boolean,
40-
hidePeersPill: boolean,
41-
hideTxPill: boolean,
42-
43-
// Global configuration
44-
globalConfig: {
45-
features: {
46-
dashboard: string[],
47-
'block-production': string[],
48-
mempool: string[],
49-
state: string[],
50-
},
51-
firebase: {
52-
projectId: string,
53-
appId: string,
54-
apiKey: string,
55-
authDomain: string,
56-
storageBucket: string,
57-
messagingSenderId: string,
58-
measurementId: string,
59-
},
60-
heartbeats: boolean,
61-
},
62-
63-
// Error tracking
64-
sentry: {
65-
dsn: string,
66-
tracingOrigins: string[],
67-
},
68-
69-
// Node configurations
70-
configs: Array<{
71-
name: string,
72-
url?: string,
73-
isWebNode?: boolean,
74-
}>,
75-
};
76-
```
77-
78-
## Configuration Fields Reference
79-
80-
### Core Settings
81-
82-
#### `production: boolean`
83-
84-
- **Purpose**: Determines if the application runs in production mode
85-
- **Default**: `false` for development environments, `true` for production
86-
- **Effects**:
87-
- Enables/disables debugging features
88-
- Controls console logging verbosity
89-
- Affects bundle optimization
90-
91-
#### `canAddNodes: boolean`
92-
93-
- **Purpose**: Controls whether users can dynamically add new node connections
94-
- **Default**: `true` for development, `false` for production
95-
- **Effects**: Shows/hides "Add Node" functionality in the UI
96-
97-
#### `hideNodeStats: boolean`
98-
99-
- **Purpose**: Controls visibility of detailed node statistics
100-
- **Default**: `false`
101-
- **Effects**: Hides performance metrics and detailed node information when
102-
`true`
103-
104-
#### `showWebNodeLandingPage: boolean`
105-
106-
- **Purpose**: Controls whether to display the WebNode-specific landing page
107-
- **Default**: `false`
108-
- **Effects**: Shows WebNode introduction and setup instructions
109-
110-
#### `hidePeersPill: boolean`
111-
112-
- **Purpose**: Controls visibility of the peers status indicator
113-
- **Default**: `false`
114-
- **Effects**: Hides the peers connection pill in the UI
115-
116-
#### `hideTxPill: boolean`
117-
118-
- **Purpose**: Controls visibility of the transaction pool indicator
119-
- **Default**: `false`
120-
- **Effects**: Hides the transaction pool status pill in the UI
121-
122-
### Global Configuration
123-
124-
#### `globalConfig.features`
125-
126-
Controls which features and sub-features are enabled for each module:
127-
128-
**`dashboard: string[]`**
129-
130-
- Available features: `[]` (empty array enables all dashboard features)
131-
- Controls main dashboard functionality
132-
133-
**`'block-production': string[]`**
134-
135-
- Available features: `['overview', 'won-slots']`
136-
- `overview`: Block production statistics and metrics
137-
- `won-slots`: Detailed view of won slot information
138-
139-
**`mempool: string[]`**
140-
141-
- Available features: `[]` (empty array enables all mempool features)
142-
- Controls transaction pool monitoring
143-
144-
**`state: string[]`**
145-
146-
- Available features: `['actions']`
147-
- `actions`: State transition action monitoring
148-
149-
#### `globalConfig.firebase`
150-
151-
Firebase integration settings for analytics and real-time features:
152-
153-
- **`projectId`**: Firebase project identifier
154-
- **`appId`**: Firebase application ID
155-
- **`apiKey`**: Firebase API key for client authentication
156-
- **`authDomain`**: Firebase authentication domain
157-
- **`storageBucket`**: Firebase storage bucket name
158-
- **`messagingSenderId`**: Firebase Cloud Messaging sender ID
159-
- **`measurementId`**: Google Analytics measurement ID
160-
161-
#### `globalConfig.heartbeats: boolean`
162-
163-
- **Purpose**: Enables periodic heartbeat signals for monitoring
164-
- **Default**: `false`
165-
- **Effects**: Sends regular status updates to monitoring systems
166-
167-
### Error Tracking
168-
169-
#### `sentry`
170-
171-
Sentry error tracking and performance monitoring configuration:
172-
173-
**`dsn: string`**
174-
175-
- **Purpose**: Sentry Data Source Name for error reporting
176-
- **Format**: `https://[key]@[host]/[project-id]`
177-
178-
**`tracingOrigins: string[]`**
179-
180-
- **Purpose**: List of origins to include in performance tracing
181-
- **Example**: `['https://www.openmina.com', 'localhost:4200']`
182-
183-
### Node Configurations
184-
185-
#### `configs: Array<Config>`
186-
187-
Array of node connection configurations:
188-
189-
**Config Object Structure:**
190-
191-
```javascript
192-
{
193-
name: string, // Display name for the node
194-
url?: string, // GraphQL endpoint URL (optional for WebNodes)
195-
isWebNode?: boolean, // True for browser-based WebAssembly nodes
196-
}
197-
```
198-
199-
**Examples:**
200-
201-
```javascript
202-
// Regular node connection
203-
{
204-
name: 'Production Node',
205-
url: 'https://api.openmina.com/graphql'
206-
}
207-
208-
// WebNode (browser-based)
209-
{
210-
name: 'Web Node',
211-
isWebNode: true
212-
}
213-
```
214-
215-
## Available Environments
216-
217-
### `local.js`
218-
219-
Development environment for local node connections:
220-
221-
```javascript
222-
export default {
223-
production: false,
224-
globalConfig: {
225-
features: {
226-
dashboard: [],
227-
"block-production": ["overview", "won-slots"],
228-
},
229-
},
230-
configs: [
231-
{
232-
name: "Local Node",
233-
url: "http://localhost:3085",
234-
},
235-
],
236-
};
237-
```
238-
239-
### `production.js`
240-
241-
Optimized production environment:
242-
243-
```javascript
244-
export default {
245-
production: true,
246-
globalConfig: {
247-
features: {
248-
dashboard: [],
249-
"block-production": ["overview", "won-slots"],
250-
},
251-
},
252-
sentry: {
253-
dsn: "https://[email protected]/project-id",
254-
tracingOrigins: ["https://www.openmina.com"],
255-
},
256-
configs: [
257-
{
258-
name: "Production Node",
259-
url: "https://production-node.openmina.com",
260-
},
261-
],
262-
};
263-
```
264-
265-
### `webnode.js`
266-
267-
WebNode browser-based configuration:
268-
269-
```javascript
270-
export default {
271-
production: true,
272-
canAddNodes: false,
273-
showWebNodeLandingPage: true,
274-
globalConfig: {
275-
features: {
276-
dashboard: [],
277-
"block-production": ["won-slots"],
278-
},
279-
firebase: {
280-
/* Firebase config */
281-
},
282-
},
283-
sentry: {
284-
/* Sentry config */
285-
},
286-
configs: [
287-
{
288-
name: "Web Node",
289-
isWebNode: true,
290-
},
291-
],
292-
};
293-
```
294-
295-
### `producer.js`
296-
297-
Block producer dashboard configuration:
298-
299-
```javascript
300-
export default {
301-
production: true,
302-
hideNodeStats: true,
303-
globalConfig: {
304-
features: {
305-
"block-production": ["overview"],
306-
},
307-
},
308-
configs: [
309-
{
310-
name: "Producer-0",
311-
url: "https://producer-0.example.com",
312-
},
313-
// Additional producer nodes...
314-
],
315-
};
316-
```
317-
318-
### `fuzzing.js`
319-
320-
Fuzzing test environment:
321-
322-
```javascript
323-
export default {
324-
production: false,
325-
globalConfig: {
326-
features: {
327-
dashboard: [],
328-
"block-production": ["overview", "won-slots"],
329-
},
330-
},
331-
configs: [
332-
{
333-
name: "Fuzzing Node",
334-
url: "http://localhost:3085",
335-
},
336-
],
337-
};
338-
```
339-
340-
## Creating Custom Environments
341-
342-
To create a new environment configuration:
343-
344-
1. **Create the configuration file** in `frontend/src/assets/environments/`:
345-
346-
```bash
347-
cp frontend/src/assets/environments/local.js frontend/src/assets/environments/custom.js
348-
```
349-
350-
2. **Modify the configuration** to suit your needs:
351-
352-
```javascript
353-
export default {
354-
production: true,
355-
canAddNodes: true,
356-
globalConfig: {
357-
features: {
358-
dashboard: [],
359-
"block-production": ["overview"],
360-
},
361-
},
362-
configs: [
363-
{
364-
name: "Custom Node",
365-
url: "https://your-node.example.com",
366-
},
367-
],
368-
};
369-
```
370-
371-
3. **Add a Makefile target** (optional):
372-
373-
```makefile
374-
.PHONY: build-custom
375-
build-custom: ## Build the frontend with custom configuration
376-
npx ng build --configuration production
377-
cp dist/frontend/browser/assets/environments/custom.js \
378-
dist/frontend/browser/assets/environments/env.js
379-
```
380-
381-
4. **Update Docker support** (if needed) by adding the environment to
382-
`frontend/docker/startup.sh`.
383-
38433
## Usage and Integration
38534

38635
<!-- prettier-ignore-start -->
@@ -560,16 +209,7 @@ if (CONFIG.hidePeersPill) {
560209
}
561210
```
562211

563-
#### 4. Firebase Integration
564-
565-
```typescript
566-
// Initialize Firebase with environment-specific config
567-
if (CONFIG.globalConfig.firebase) {
568-
initializeApp(CONFIG.globalConfig.firebase);
569-
}
570-
```
571-
572-
#### 5. Error Tracking
212+
#### 4. Error Tracking
573213

574214
```typescript
575215
// Configure Sentry with environment-specific DSN

0 commit comments

Comments
 (0)