# TODO: Fix URL-based Page Navigation (useNavigate URL Format Issue)

## Problem Summary
Pages return "page not found" when accessed via URL. The issue is a mismatch between how `useNavigate.js` generates URLs and how `VueRouteMap.php` parses them back to component names.

### Root Cause
- **Frontend** (`useNavigate.js`): Converts `CooperativeList` → `/cooperativelist` (no separators)
- **Backend** (`VueRouteMap.php`): Expects hyphenated format like `/cooperative-list` to properly convert back to `CooperativeList`
- **Result**: Component name mismatch → page not found

---

## Fix Steps

### Step 1: Fix Frontend URL Generation
**File**: `resources/js/composables/Core/useNavigate.js`

- [ ] Modify the URL generation logic to convert camelCase/PascalCase page names to kebab-case
- [ ] Change: `page.replace(/\./g, '/').toLowerCase()`
- [ ] To: Convert `CooperativeList` → `cooperative-list` (hyphenated kebab-case)
- [ ] Ensure all page navigations generate proper kebab-case URLs

### Step 2: Verify Backend Route Parsing
**File**: `app/Http/Controllers/Support/VueRouteMap.php`

- [ ] Verify `toCamelCase()` method properly converts kebab-case back to PascalCase
- [ ] Confirm: `cooperative-list` → `CooperativeList`
- [ ] Test with multi-word component names

### Step 3: Test URL Patterns
- [ ] Test direct URL access: `/cooperative-list` → loads `CooperativeList` component
- [ ] Test direct URL access: `/buy-view-product-market` → loads `BuyViewProductMarket` component
- [ ] Test URLs with hash parameters: `/edit-user--hHASHKEY`
- [ ] Test URLs with payload parameters: `/some-page--e:ENCODED_PAYLOAD`

### Step 4: Verify Browser Back/Forward Navigation
- [ ] Test popstate event handling with new URL format
- [ ] Ensure browser history works correctly with kebab-case URLs

### Step 5: Check Existing Routes
- [ ] Verify all routes in `VueRouteMap::$routes` array work with new URL format
- [ ] Ensure no broken links or navigation issues

---

## Expected Outcome
- All pages accessible via direct URL
- Browser refresh maintains current page
- Browser back/forward navigation works correctly
- URLs are clean and SEO-friendly (kebab-case)

## Files to Modify
1. `resources/js/composables/Core/useNavigate.js` - Fix URL generation
2. Potentially `resources/js/composables/useUrlEncoder.js` - If hash/payload encoding needs adjustment

## Testing Checklist
- [ ] Navigate to a page, copy URL, open in new tab → page loads correctly
- [ ] Refresh page while on a route → page stays on same route
- [ ] Browser back button works correctly
- [ ] URLs with hashkey parameters work
- [ ] URLs with payload parameters work