Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .github/workflows/trigger.md
Original file line number Diff line number Diff line change
@@ -1 +1 @@
Again again. I know ...
last time
5 changes: 5 additions & 0 deletions hivemq-edge-frontend/.github/copilot-instructions.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,4 +50,9 @@ This directory contains comprehensive task documentation, progress tracking, and

**When working on tasks, AI agents should consult this directory first.**

## Important Guidelines

- **Design Guidelines**: [.tasks/DESIGN_GUIDELINES.md](../.tasks/DESIGN_GUIDELINES.md) - UI component patterns, button variants, styling conventions
- **Testing Guidelines**: [.tasks/TESTING_GUIDELINES.md](../.tasks/TESTING_GUIDELINES.md) - Mandatory accessibility testing, component test patterns

See [README.md](.tasks/README.md) for full documentation structure.
119 changes: 119 additions & 0 deletions hivemq-edge-frontend/.tasks/33168-duplicate-combiner/BUG_FIXES.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
# Bug Fixes for E2E Test File

**Date:** October 24, 2025
**File:** `cypress/e2e/workspace/duplicate-combiner.spec.cy.ts`

---

## Issues Fixed

### 1. TypeScript Error (Line 54) ✅

**Problem:**

```typescript
const sourceIds = combiner.sources?.items?.map((s: { identifier: string }) => s.identifier).join('-') || ''
```

Error: `Property 'identifier' is missing in type 'EntityReference'`

**Root Cause:**
The `EntityReference` type has an `id` property, not `identifier`. The type is defined as:

```typescript
export type EntityReference = {
type: EntityType
id: string // ← Not 'identifier'
}
```

**Fix:**
Changed `identifier` to `id`:

```typescript
const sourceIds = combiner.sources?.items?.map((s) => s.id).join('-') || ''
```

### 2. ESLint Error - Unused Variable ✅

**Problem:**

```typescript
const COMBINER_ID_1 = '9e975b62-6f8d-410f-9007-3f83719aec6f'
const COMBINER_ID_2 = 'combiner-duplicate-attempt'
```

Error: `'COMBINER_ID_1' is assigned a value but never used`

**Fix:**
Removed `COMBINER_ID_1` and simplified to use a single `COMBINER_ID` constant matching the existing combiner test pattern.

### 3. ESLint Warnings - Unused Aliases ✅

**Problem:**
Multiple unused `cy.as()` aliases:

- `getProtocols`
- `getAdapters`
- `getTopicFilters`
- `deleteCombiner`

**Fix:**
Removed all unused `.as()` calls from intercepts that don't need to be waited on.

### 4. Test Failures - Incorrect Combiner ID Format ✅

**Problem:**
Tests were using incorrect combiner ID format:

```typescript
const firstCombinerId = `combiner-adapter@opcua-pump-adapter@opcua-boiler`
```

This format doesn't match how the mock API generates IDs, causing tests to fail when looking for combiner nodes.

**Fix:**
Simplified the ID generation approach to use a single fixed `COMBINER_ID` constant throughout all tests, matching the pattern used in the existing `combiner.spec.cy.ts` test file. This makes the tests more predictable and maintainable.

**Changes:**

- Removed dynamic ID generation based on source IDs
- Used fixed `COMBINER_ID = '9e975b62-6f8d-410f-9007-3f83719aec6f'`
- Updated all test assertions to use `COMBINER_ID` constant
- Removed redundant `firstCombinerId` variables

---

## Summary of Changes

**Lines Modified:**

- Line 11: Removed unused `COMBINER_ID_1` constant
- Line 32-48: Removed `.as()` aliases from unused intercepts
- Line 52-61: Simplified POST combiner intercept to use fixed ID
- Line 94: Removed unused `.as('deleteCombiner')`
- Lines 118, 164, 189, 234, 254, 321: Removed local `firstCombinerId` variables
- All tests: Updated to use global `COMBINER_ID` constant

**Result:**

- ✅ All TypeScript errors resolved
- ✅ All ESLint errors resolved
- ✅ Tests now use consistent, predictable IDs
- ✅ Code follows existing test patterns

---

## Test Execution

To run the fixed tests:

```bash
# Terminal 1: Start dev server
pnpm dev

# Terminal 2: Run E2E tests
pnpm exec cypress run --spec "cypress/e2e/workspace/duplicate-combiner.spec.cy.ts"
```

Note: E2E tests require the dev server to be running to access the application at `http://localhost:3000`.
Original file line number Diff line number Diff line change
@@ -0,0 +1,152 @@
3. **`findExistingCombiner(allNodes, targetReferences)`**

- Finds existing combiner with matching sources
- Uses existing `arrayWithSameObjects` utility
- Handles sources in any order
- Pure function, fully testable

4. **`filterCombinerCandidates(selectedNodes, adapterTypes)`**

- Filters nodes to only combiner-eligible ones
- Wraps `isNodeCombinerCandidate` for array filtering
- Returns undefined if no candidates found

5. **`isAssetMapperCombiner(nodes)`**
- Checks if combiner should be an asset mapper
- Detects presence of pulse nodes
- Simple boolean check

**Type Exports:**

- `CombinerEligibleNode` - Union type for valid combiner source nodes

#### 2. Created Comprehensive Tests ✅

**File**: `src/modules/Workspace/utils/toolbar.utils.spec.ts`

**Test Coverage:**

- ✅ 29 test cases covering all functions
- ✅ All tests passing
- ✅ Edge cases covered:
- Nodes with/without COMBINE capability
- Missing adapter types
- Different node types (adapters, bridges, pulse, edge)
- Empty arrays
- Undefined parameters
- Source order variations
- Different source lengths
- Multiple matching combiners

**Test Results:**

```
Test Files 1 passed (1)
Tests 29 passed (29)
Duration 1.04s
```

#### 3. Refactored ContextualToolbar Component ✅

**File**: `src/modules/Workspace/components/nodes/ContextualToolbar.tsx`

**Changes Made:**

1. **Updated Imports**

- Removed: `EntityType`, `arrayWithSameObjects`, `CombinerEligibleNode` type
- Added: All new toolbar utility functions

2. **Simplified `selectedCombinerCandidates` Memoized Selector**

- **Before**: Complex inline filter with adapter type checking (8 lines)
- **After**: Single line call to `filterCombinerCandidates(selectedNodes, data?.items)`

3. **Simplified `isAssetManager` Memoized Selector**

- **Before**: `.find()` check for pulse nodes (3 lines)
- **After**: Single line call to `isAssetMapperCombiner(selectedCombinerCandidates)`

4. **Simplified `onManageTransformationNode` Function**
- **Before**: Complex inline logic for:
- Building entity references (15 lines)
- Finding existing combiner (11 lines)
- **After**: Clean, readable function calls:
```typescript
const entityReferences = buildEntityReferencesFromNodes(selectedCombinerCandidates)
const existingCombiner = findExistingCombiner(nodes, entityReferences)
```

**Benefits Achieved:**

- ✅ Reduced complexity in component
- ✅ Extracted logic is now unit testable
- ✅ Better separation of concerns
- ✅ More maintainable code
- ✅ Preserved all existing functionality
- ✅ No breaking changes

#### 4. Validation ✅

- ✅ All utility tests passing (29/29)
- ✅ TypeScript type checking passed
- ✅ No compilation errors
- ✅ Component successfully refactored
- ✅ All functions properly exported and imported

---

## Summary of Phase 1

**Files Created:**

1. `src/modules/Workspace/utils/toolbar.utils.ts` (100 lines)
2. `src/modules/Workspace/utils/toolbar.utils.spec.ts` (500+ lines)

**Files Modified:**

1. `src/modules/Workspace/components/nodes/ContextualToolbar.tsx` (simplified ~40 lines)

**Test Coverage:**

- 5 new utility functions
- 29 comprehensive test cases
- 100% coverage of utility functions
- All tests passing ✅

**Code Quality Improvements:**

- Reduced cyclomatic complexity in component
- Improved readability with descriptive function names
- Better testability with pure functions
- Maintained existing UX and functionality

---

## Next Steps

Phase 1 is complete! Ready to move to Phase 2 when user is ready:

**Phase 2: Improve UX**

- Enhance duplicate detection messaging
- Improve toast notifications
- Consider visual feedback options
- Possibly add user choice modal

**Phase 3: Add Component Tests**

- Cypress component tests for ContextualToolbar
- Test toolbar rendering with different selections
- Test button states and interactions
- Test toast notifications
- Test navigation behavior

---

## Notes

- All existing functionality preserved
- No breaking changes introduced
- UX remains the same (as requested)
- Ready for Phase 2 UX improvements
Loading
Loading