mirror of
https://github.com/The-Low-Code-Foundation/OpenNoodl.git
synced 2026-01-13 07:42:55 +01:00
working on problem opening projet
This commit is contained in:
Tara West
@@ -0,0 +1,106 @@
|
||||
# BUG-001: Home Component Shown as "Component" not "Page"
|
||||
|
||||
**Severity**: 🟡 Medium (Cosmetic/UX Issue)
|
||||
**Status**: Identified
|
||||
**Category**: UI Display
|
||||
|
||||
---
|
||||
|
||||
## 🐛 Symptom
|
||||
|
||||
When creating a new project, the Components panel shows:
|
||||
|
||||
- ✅ **App** - displayed as regular component
|
||||
- ❌ **Home** - displayed as regular component (should show as "page")
|
||||
|
||||
**Expected**: Home should have a page icon (router icon) indicating it's a page component.
|
||||
|
||||
**Actual**: Home shows with standard component icon.
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Root Cause
|
||||
|
||||
The component name **IS correct** in the template (`'/#__page__/Home'`), but the UI display logic may not be recognizing it properly.
|
||||
|
||||
### Template Structure (CORRECT)
|
||||
|
||||
```typescript
|
||||
// packages/noodl-editor/src/editor/src/models/template/templates/hello-world.template.ts
|
||||
|
||||
components: [
|
||||
{
|
||||
name: 'App' // ✅ Regular component
|
||||
// ...
|
||||
},
|
||||
{
|
||||
name: '/#__page__/Home' // ✅ CORRECT - Has page prefix!
|
||||
// ...
|
||||
}
|
||||
];
|
||||
```
|
||||
|
||||
The `/#__page__/` prefix is the standard Noodl convention for marking page components.
|
||||
|
||||
---
|
||||
|
||||
## 💡 Analysis
|
||||
|
||||
**Location**: `packages/noodl-editor/src/editor/src/views/panels/ComponentsPanelNew/hooks/useComponentsPanel.ts`
|
||||
|
||||
The issue is likely in how the Components Panel determines if something is a page:
|
||||
|
||||
```typescript
|
||||
// Pseudo-code of likely logic:
|
||||
const isPage = component.name.startsWith('/#__page__/');
|
||||
```
|
||||
|
||||
**Possible causes**:
|
||||
|
||||
1. The component naming is correct, but display logic has a bug
|
||||
2. The icon determination logic doesn't check for page prefix
|
||||
3. UI state not updated after project load
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Proposed Solution
|
||||
|
||||
### Option 1: Verify Icon Logic (Recommended)
|
||||
|
||||
Check `ComponentItem.tsx` line ~85:
|
||||
|
||||
```typescript
|
||||
let icon = IconName.Component;
|
||||
if (component.isRoot) {
|
||||
icon = IconName.Home;
|
||||
} else if (component.isPage) {
|
||||
// ← Verify this is set correctly
|
||||
icon = IconName.PageRouter;
|
||||
}
|
||||
```
|
||||
|
||||
Ensure `component.isPage` is correctly detected from the `/#__page__/` prefix.
|
||||
|
||||
### Option 2: Debug Data Flow
|
||||
|
||||
Add temporary logging:
|
||||
|
||||
```typescript
|
||||
console.log('Component:', component.name);
|
||||
console.log('Is Page?', component.isPage);
|
||||
console.log('Is Root?', component.isRoot);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ✅ Verification Steps
|
||||
|
||||
1. Create new project from launcher
|
||||
2. Open Components panel
|
||||
3. Check icon next to "Home" component
|
||||
4. Expected: Should show router/page icon, not component icon
|
||||
|
||||
---
|
||||
|
||||
**Impact**: Low - Cosmetic issue only, doesn't affect functionality
|
||||
**Priority**: P2 - Fix after critical bugs
|
||||
@@ -0,0 +1,118 @@
|
||||
# BUG-002: App Component Not Set as Home
|
||||
|
||||
**Severity**: 🔴 CRITICAL
|
||||
**Status**: Root Cause Identified
|
||||
**Category**: Core Functionality
|
||||
|
||||
---
|
||||
|
||||
## 🐛 Symptom
|
||||
|
||||
After creating a new project:
|
||||
|
||||
- ❌ Preview shows error: **"No 🏠 HOME component selected"**
|
||||
- ❌ App component is not marked as Home in Components panel
|
||||
- ❌ `ProjectModel.instance.rootNode` is `undefined`
|
||||
|
||||
**Expected**: App component should be automatically set as Home, preview should work.
|
||||
|
||||
**Actual**: No home component is set, preview fails.
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Root Cause
|
||||
|
||||
**Router node is missing `allowAsExportRoot: true`**
|
||||
|
||||
### The Problem Chain
|
||||
|
||||
1. **Template includes `rootComponent`**:
|
||||
|
||||
```typescript
|
||||
// hello-world.template.ts
|
||||
content: {
|
||||
rootComponent: 'App', // ✅ This is correct
|
||||
components: [...]
|
||||
}
|
||||
```
|
||||
|
||||
2. **ProjectModel.fromJSON() tries to set it**:
|
||||
|
||||
```typescript
|
||||
// projectmodel.ts:172
|
||||
if (json.rootComponent && !_this.rootNode) {
|
||||
const rootComponent = _this.getComponentWithName(json.rootComponent);
|
||||
if (rootComponent) {
|
||||
_this.setRootComponent(rootComponent); // ← Calls the broken method
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
3. **setRootComponent() SILENTLY FAILS**:
|
||||
|
||||
```typescript
|
||||
// projectmodel.ts:233
|
||||
setRootComponent(component: ComponentModel) {
|
||||
const root = _.find(component.graph.roots, function (n) {
|
||||
return n.type.allowAsExportRoot; // ❌ Router returns undefined!
|
||||
});
|
||||
if (root) this.setRootNode(root); // ❌ NEVER EXECUTES!
|
||||
// NO ERROR THROWN - Silent failure!
|
||||
}
|
||||
```
|
||||
|
||||
4. **Router node has NO `allowAsExportRoot`**:
|
||||
|
||||
```typescript
|
||||
// packages/noodl-viewer-react/src/nodes/navigation/router.tsx
|
||||
const RouterNode = {
|
||||
name: 'Router'
|
||||
// ❌ MISSING: allowAsExportRoot: true
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 💥 Impact
|
||||
|
||||
This is a **BLOCKER**:
|
||||
|
||||
- New projects cannot be previewed
|
||||
- Users see cryptic error message
|
||||
- "Make Home" button also fails (same root cause)
|
||||
- No console errors to debug
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Solution
|
||||
|
||||
**Add one line to router.tsx**:
|
||||
|
||||
```typescript
|
||||
const RouterNode = {
|
||||
name: 'Router',
|
||||
displayNodeName: 'Page Router',
|
||||
allowAsExportRoot: true, // ✅ ADD THIS
|
||||
category: 'Visuals'
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
**That's it!** This single line fixes both Bug #2 and Bug #3.
|
||||
|
||||
---
|
||||
|
||||
## ✅ Verification
|
||||
|
||||
After fix:
|
||||
|
||||
1. Create new project
|
||||
2. Check Components panel - App should have home icon
|
||||
3. Open preview - should show "Hello World!"
|
||||
4. No error messages
|
||||
|
||||
---
|
||||
|
||||
**Priority**: P0 - MUST FIX IMMEDIATELY
|
||||
**Blocks**: All new project workflows
|
||||
@@ -0,0 +1,99 @@
|
||||
# BUG-003: "Make Home" Context Menu Does Nothing
|
||||
|
||||
**Severity**: 🔴 CRITICAL
|
||||
**Status**: Root Cause Identified (Same as BUG-002)
|
||||
**Category**: Core Functionality
|
||||
|
||||
---
|
||||
|
||||
## 🐛 Symptom
|
||||
|
||||
When right-clicking on App component and selecting "Make Home":
|
||||
|
||||
- ❌ Nothing happens
|
||||
- ❌ No console output
|
||||
- ❌ No error messages
|
||||
- ❌ Component doesn't become Home
|
||||
|
||||
**Expected**: App should be set as Home, preview should work.
|
||||
|
||||
**Actual**: Silent failure, no feedback.
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Root Cause
|
||||
|
||||
**Same as BUG-002**: Router node missing `allowAsExportRoot: true`
|
||||
|
||||
### The Code Path
|
||||
|
||||
1. **User clicks "Make Home"** in context menu
|
||||
|
||||
2. **Handler is called correctly**:
|
||||
|
||||
```typescript
|
||||
// useComponentActions.ts:27
|
||||
const handleMakeHome = useCallback((node: TreeNode) => {
|
||||
const component = node.data.component;
|
||||
|
||||
ProjectModel.instance?.setRootComponent(component); // ← This is called!
|
||||
}, []);
|
||||
```
|
||||
|
||||
3. **setRootComponent() FAILS SILENTLY**:
|
||||
|
||||
```typescript
|
||||
// projectmodel.ts:233
|
||||
setRootComponent(component: ComponentModel) {
|
||||
const root = _.find(component.graph.roots, function (n) {
|
||||
return n.type.allowAsExportRoot; // ❌ Returns undefined for Router!
|
||||
});
|
||||
if (root) this.setRootNode(root); // ❌ Never reaches here
|
||||
// ❌ NO ERROR, NO LOG, NO FEEDBACK
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 💡 Why It's Silent
|
||||
|
||||
The method doesn't throw errors or log anything. It just:
|
||||
|
||||
1. Searches for a node with `allowAsExportRoot: true`
|
||||
2. Finds nothing (Router doesn't have it)
|
||||
3. Exits quietly
|
||||
|
||||
**No one knows it failed!**
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Solution
|
||||
|
||||
**Same fix as BUG-002**: Add `allowAsExportRoot: true` to Router node.
|
||||
|
||||
```typescript
|
||||
// packages/noodl-viewer-react/src/nodes/navigation/router.tsx
|
||||
const RouterNode = {
|
||||
name: 'Router',
|
||||
displayNodeName: 'Page Router',
|
||||
allowAsExportRoot: true // ✅ ADD THIS LINE
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ✅ Verification
|
||||
|
||||
After fix:
|
||||
|
||||
1. Create new project
|
||||
2. Right-click App component
|
||||
3. Click "Make Home"
|
||||
4. App should get home icon
|
||||
5. Preview should work
|
||||
|
||||
---
|
||||
|
||||
**Priority**: P0 - MUST FIX IMMEDIATELY
|
||||
**Fixes With**: BUG-002 (same root cause, same solution)
|
||||
@@ -0,0 +1,98 @@
|
||||
# BUG-004: "Create Page" Modal Misaligned
|
||||
|
||||
**Severity**: 🟡 Medium (UI/UX Issue)
|
||||
**Status**: Identified
|
||||
**Category**: CSS Styling
|
||||
|
||||
---
|
||||
|
||||
## 🐛 Symptom
|
||||
|
||||
When clicking "+ Add new page" in the Page Router property editor:
|
||||
|
||||
- ❌ Modal rectangle appears **below** the pointer triangle
|
||||
- ❌ Triangle "floats" and barely touches the rectangle
|
||||
- ❌ Looks unprofessional and broken
|
||||
|
||||
**Expected**: Triangle should be seamlessly attached to the modal rectangle.
|
||||
|
||||
**Actual**: Triangle and rectangle are visually disconnected.
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Root Cause
|
||||
|
||||
**CSS positioning issue in legacy PopupLayer system**
|
||||
|
||||
### The Modal Components
|
||||
|
||||
```typescript
|
||||
// Pages.tsx line ~195
|
||||
PopupLayer.instance.showPopup({
|
||||
content: { el: $(div) },
|
||||
attachTo: $(this.popupAnchor),
|
||||
position: 'right' // ← Position hint
|
||||
// ...
|
||||
});
|
||||
```
|
||||
|
||||
The popup uses legacy jQuery + CSS positioning from `pages.css`.
|
||||
|
||||
### Likely CSS Issue
|
||||
|
||||
```css
|
||||
/* packages/noodl-editor/src/editor/src/styles/propertyeditor/pages.css */
|
||||
|
||||
/* Triangle pointer */
|
||||
.popup-layer-arrow {
|
||||
/* Positioned absolutely */
|
||||
}
|
||||
|
||||
/* Modal rectangle */
|
||||
.popup-layer-content {
|
||||
/* Also positioned absolutely */
|
||||
/* ❌ Offset calculations may be incorrect */
|
||||
}
|
||||
```
|
||||
|
||||
The triangle and rectangle are positioned separately, causing misalignment.
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Solution
|
||||
|
||||
### Option 1: Fix CSS (Recommended)
|
||||
|
||||
Adjust positioning in `pages.css`:
|
||||
|
||||
```css
|
||||
.popup-layer-content {
|
||||
/* Ensure top aligns with triangle */
|
||||
margin-top: 0;
|
||||
/* Adjust offset if needed */
|
||||
}
|
||||
|
||||
.popup-layer-arrow {
|
||||
/* Ensure connects to content */
|
||||
}
|
||||
```
|
||||
|
||||
### Option 2: Migrate to Modern Popup
|
||||
|
||||
Replace legacy PopupLayer with modern PopupMenu (from `@noodl-core-ui`).
|
||||
|
||||
**Complexity**: Higher, but better long-term solution.
|
||||
|
||||
---
|
||||
|
||||
## ✅ Verification
|
||||
|
||||
1. Open project with Page Router
|
||||
2. Click "+ Add new page" button
|
||||
3. Check modal appearance
|
||||
4. Triangle should seamlessly connect to rectangle
|
||||
|
||||
---
|
||||
|
||||
**Priority**: P2 - Fix after critical bugs
|
||||
**Impact**: Cosmetic only, doesn't affect functionality
|
||||
@@ -0,0 +1,103 @@
|
||||
# Investigation: Project Creation Bugs
|
||||
|
||||
**Date**: January 12, 2026
|
||||
**Status**: 🔴 CRITICAL - Multiple Issues Identified
|
||||
**Priority**: P0 - Blocks Basic Functionality
|
||||
|
||||
---
|
||||
|
||||
## 📋 Summary
|
||||
|
||||
Four critical bugs were identified when creating new projects from the launcher:
|
||||
|
||||
1. **Home component shown as "component" not "page"** in Components panel
|
||||
2. **App component not set as Home** (preview fails with "No HOME component")
|
||||
3. **"Make Home" context menu does nothing** (no console output, no error)
|
||||
4. **"Create new page" modal misaligned** (triangle pointer detached from rectangle)
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Root Cause Analysis
|
||||
|
||||
### CRITICAL: Router Node Missing `allowAsExportRoot`
|
||||
|
||||
**Location**: `packages/noodl-viewer-react/src/nodes/navigation/router.tsx`
|
||||
|
||||
The Router node definition is **missing the `allowAsExportRoot` property**:
|
||||
|
||||
```typescript
|
||||
const RouterNode = {
|
||||
name: 'Router',
|
||||
displayNodeName: 'Page Router'
|
||||
// ❌ Missing: allowAsExportRoot: true
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
This causes `ProjectModel.setRootComponent()` to fail silently:
|
||||
|
||||
```typescript
|
||||
// packages/noodl-editor/src/editor/src/models/projectmodel.ts:233
|
||||
setRootComponent(component: ComponentModel) {
|
||||
const root = _.find(component.graph.roots, function (n) {
|
||||
return n.type.allowAsExportRoot; // ❌ Returns undefined for Router!
|
||||
});
|
||||
if (root) this.setRootNode(root); // ❌ Never executes!
|
||||
}
|
||||
```
|
||||
|
||||
**Impact**: This single missing property causes bugs #2 and #3.
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Detailed Analysis
|
||||
|
||||
See individual bug files for complete analysis:
|
||||
|
||||
- **[BUG-001-home-component-type.md](./BUG-001-home-component-type.md)** - Home shown as component not page
|
||||
- **[BUG-002-app-not-home.md](./BUG-002-app-not-home.md)** - App component not set as Home
|
||||
- **[BUG-003-make-home-silent-fail.md](./BUG-003-make-home-silent-fail.md)** - "Make Home" does nothing
|
||||
- **[BUG-004-create-page-modal-styling.md](./BUG-004-create-page-modal-styling.md)** - Modal alignment issue
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Proposed Solutions
|
||||
|
||||
See **[SOLUTIONS.md](./SOLUTIONS.md)** for detailed fixes.
|
||||
|
||||
### Quick Summary
|
||||
|
||||
| Bug | Solution | Complexity | Files Affected |
|
||||
| ------- | --------------------------------------- | ------------ | -------------- |
|
||||
| #1 | Improve UI display logic | Low | 1 file |
|
||||
| #2 & #3 | Add `allowAsExportRoot: true` to Router | **Critical** | 1 file |
|
||||
| #4 | Fix CSS positioning | Low | 1 file |
|
||||
|
||||
---
|
||||
|
||||
## 📂 Related Files
|
||||
|
||||
### Core Files
|
||||
|
||||
- `packages/noodl-viewer-react/src/nodes/navigation/router.tsx` - Router node (NEEDS FIX)
|
||||
- `packages/noodl-editor/src/editor/src/models/projectmodel.ts` - Root component logic
|
||||
- `packages/noodl-editor/src/editor/src/models/template/templates/hello-world.template.ts` - Template definition
|
||||
|
||||
### UI Files
|
||||
|
||||
- `packages/noodl-editor/src/editor/src/views/panels/ComponentsPanelNew/hooks/useComponentActions.ts` - "Make Home" handler
|
||||
- `packages/noodl-editor/src/editor/src/views/panels/propertyeditor/Pages/Pages.tsx` - Create page modal
|
||||
- `packages/noodl-editor/src/editor/src/styles/propertyeditor/pages.css` - Modal styling
|
||||
|
||||
---
|
||||
|
||||
## ✅ Next Steps
|
||||
|
||||
1. **CRITICAL**: Add `allowAsExportRoot: true` to Router node
|
||||
2. Test project creation flow end-to-end
|
||||
3. Fix remaining UI issues (bugs #1 and #4)
|
||||
4. Add regression tests
|
||||
|
||||
---
|
||||
|
||||
_Created: January 12, 2026_
|
||||
@@ -0,0 +1,191 @@
|
||||
# Solutions: Project Creation Bugs
|
||||
|
||||
**Date**: January 12, 2026
|
||||
**Status**: Ready for Implementation
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Priority Order
|
||||
|
||||
1. **CRITICAL** - BUG-002 & BUG-003 (Same fix)
|
||||
2. **Medium** - BUG-001 (UI improvement)
|
||||
3. **Low** - BUG-004 (CSS fix)
|
||||
|
||||
---
|
||||
|
||||
## 🔴 CRITICAL FIX: Add `allowAsExportRoot` to Router
|
||||
|
||||
**Fixes**: BUG-002 (App not Home) + BUG-003 ("Make Home" fails)
|
||||
|
||||
### File to Edit
|
||||
|
||||
`packages/noodl-viewer-react/src/nodes/navigation/router.tsx`
|
||||
|
||||
### The Fix (ONE LINE!)
|
||||
|
||||
```typescript
|
||||
const RouterNode = {
|
||||
name: 'Router',
|
||||
displayNodeName: 'Page Router',
|
||||
allowAsExportRoot: true, // ✅ ADD THIS LINE
|
||||
category: 'Visuals',
|
||||
docs: 'https://docs.noodl.net/nodes/navigation/page-router',
|
||||
useVariants: false
|
||||
// ... rest of the definition
|
||||
};
|
||||
```
|
||||
|
||||
### Why This Works
|
||||
|
||||
- `ProjectModel.setRootComponent()` searches for nodes with `allowAsExportRoot: true`
|
||||
- Router node currently doesn't have this property
|
||||
- Adding it allows Router to be set as the root of a component
|
||||
- This fixes both project creation AND "Make Home" functionality
|
||||
|
||||
### Testing
|
||||
|
||||
```bash
|
||||
# 1. Apply the fix
|
||||
# 2. Restart dev server: npm run dev
|
||||
# 3. Create new project
|
||||
# 4. Preview should show "Hello World!"
|
||||
# 5. "Make Home" should work on any component
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🟡 BUG-001: Fix Home Component Display
|
||||
|
||||
**Severity**: Medium (Cosmetic)
|
||||
|
||||
### Investigation Needed
|
||||
|
||||
The template correctly creates `'/#__page__/Home'` with the page prefix.
|
||||
|
||||
**Check**: `useComponentsPanel.ts` line where it builds tree data.
|
||||
|
||||
### Potential Fix
|
||||
|
||||
Ensure `isPage` flag is properly set:
|
||||
|
||||
```typescript
|
||||
// In tree data building logic
|
||||
const isPage = component.name.startsWith('/#__page__/');
|
||||
|
||||
return {
|
||||
// ...
|
||||
isPage: isPage, // ✅ Ensure this is set
|
||||
// ...
|
||||
};
|
||||
```
|
||||
|
||||
### Alternative
|
||||
|
||||
Check `ComponentItem.tsx` icon logic:
|
||||
|
||||
```typescript
|
||||
let icon = IconName.Component;
|
||||
if (component.isRoot) {
|
||||
icon = IconName.Home;
|
||||
} else if (component.isPage) {
|
||||
// ← Must be true for pages
|
||||
icon = IconName.PageRouter;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🟡 BUG-004: Fix Modal Styling
|
||||
|
||||
**Severity**: Low (Cosmetic)
|
||||
|
||||
### File to Edit
|
||||
|
||||
`packages/noodl-editor/src/editor/src/styles/propertyeditor/pages.css`
|
||||
|
||||
### Investigation Steps
|
||||
|
||||
1. Inspect the popup when it appears
|
||||
2. Check CSS classes on triangle and rectangle
|
||||
3. Look for positioning offsets
|
||||
|
||||
### Likely Fix
|
||||
|
||||
Adjust vertical alignment:
|
||||
|
||||
```css
|
||||
.popup-layer-content {
|
||||
margin-top: 0 !important;
|
||||
/* or adjust to match triangle position */
|
||||
}
|
||||
|
||||
.popup-layer-arrow {
|
||||
/* Ensure positioned correctly relative to content */
|
||||
}
|
||||
```
|
||||
|
||||
### Long-term Solution
|
||||
|
||||
Migrate from legacy PopupLayer to modern `PopupMenu` from `@noodl-core-ui`.
|
||||
|
||||
---
|
||||
|
||||
## ✅ Implementation Checklist
|
||||
|
||||
### Phase 1: Critical Fix (30 minutes)
|
||||
|
||||
- [ ] Add `allowAsExportRoot: true` to Router node
|
||||
- [ ] Test new project creation
|
||||
- [ ] Test "Make Home" functionality
|
||||
- [ ] Verify preview works
|
||||
|
||||
### Phase 2: UI Improvements (1-2 hours)
|
||||
|
||||
- [ ] Debug BUG-001 (page icon not showing)
|
||||
- [ ] Fix if needed
|
||||
- [ ] Debug BUG-004 (modal alignment)
|
||||
- [ ] Fix CSS positioning
|
||||
|
||||
### Phase 3: Documentation (30 minutes)
|
||||
|
||||
- [ ] Update LEARNINGS.md with findings
|
||||
- [ ] Document `allowAsExportRoot` requirement
|
||||
- [ ] Add regression test notes
|
||||
|
||||
---
|
||||
|
||||
## 📝 Regression Test Plan
|
||||
|
||||
After fixes, test:
|
||||
|
||||
1. **New Project Flow**
|
||||
|
||||
- Create project from launcher
|
||||
- App should be Home automatically
|
||||
- Preview shows "Hello World!"
|
||||
|
||||
2. **Make Home Feature**
|
||||
|
||||
- Create second component
|
||||
- Right-click → "Make Home"
|
||||
- Should work without errors
|
||||
|
||||
3. **Page Router**
|
||||
- App has Router as root
|
||||
- Can add pages to Router
|
||||
- Modal styling looks correct
|
||||
|
||||
---
|
||||
|
||||
## 🚀 Expected Results
|
||||
|
||||
| Bug | Before | After |
|
||||
| --- | ------------------------- | ------------------------- |
|
||||
| #1 | Home shows component icon | Home shows page icon |
|
||||
| #2 | Preview error | Preview works immediately |
|
||||
| #3 | "Make Home" does nothing | "Make Home" works |
|
||||
| #4 | Modal misaligned | Modal looks professional |
|
||||
|
||||
---
|
||||
|
||||
_Ready for implementation!_
|
||||
Reference in New Issue
Block a user