---
task: Fix AssignProductToStore — navigation only encodes store hash into URL, product hash is lost on direct access. Switch to encoded payload containing both product_hashkey and store_hashkey.
cycles: 5
context: true
private: false
started: 2026-05-17T09:00:00Z
finished: 2026-05-17T09:01:00Z
---

## files
- resources/js/Pages/ListProductsMarket.vue [lines 42-52] — only caller of AssignProductToStore; passes `target: product.hashkey` and `store_hash` as separate props
- resources/js/Pages/AssignProductToStore.vue [lines 65-84] — onMounted reads `props.target` (product hash) and `props.store_hash` (store hash); both must survive direct URL access
- resources/js/composables/Core/useNavigate.js [lines 112-130] — URL builder: only encodes `props.target|hashkey|id` as `--h:`, or `props.payload` as `--e:`; `store_hash` is never encoded into the URL
- resources/js/composables/useUrlEncoder.js — encodePayload/decodePayload helpers
- app/Http/Controllers/Support/VueRouteMap.php [lines 575-585] — on `--e:` URLs, sets `$props['payload'] = $parsedData['value']` (object); on `--h:` URLs, sets `target/hashkey/id` to the hash value

## steps
1. In `resources/js/Pages/ListProductsMarket.vue` at the `viewProduct` function (lines 42-52), replace the current navigation call with a payload-based navigation:
   - REMOVE: `props: { target: product.hashkey, store_hash: props.data.store_hash }`
   - ADD: `props: { payload: { product_hashkey: product.hashkey, store_hashkey: props.data.store_hash } }`
   - This encodes both hashes into the URL as `--e:BASE64` so they survive page reload.

2. In `resources/js/Pages/AssignProductToStore.vue` at `onMounted` (lines 65-84), update prop reading to support the new payload format while keeping backward compat with pushState:
   - CHANGE `productHash.value = props.target || urlParams.get('target') || urlParams.get('product_id') || urlParams.get('id')`
   - TO `productHash.value = props.payload?.product_hashkey || props.payload?.product_hash || props.target || urlParams.get('target') || urlParams.get('product_id') || urlParams.get('id')`
   - CHANGE `if (props.store_hash) { selectedStoreHash.value = props.store_hash }`
   - TO `if (props.payload?.store_hashkey || props.payload?.store_hash || props.store_hash) { selectedStoreHash.value = props.payload?.store_hashkey || props.payload?.store_hash || props.store_hash }`

3. In `resources/js/Pages/AssignProductToStore.vue` `defineProps` (line 12-16), add `payload` prop:
   - ADD `payload: { type: Object, default: null }` to the props definition alongside `target`, `store_hash`, and `user`.

## context
### ListProductsMarket.vue — current viewProduct (lines 42-52)
```js
const viewProduct = (product) => {
    if (props.data?.store_hash) {
        navigate({
            page: 'AssignProductToStore',
            props: { 
                target: product.hashkey,       // goes into URL --h: but store_hash is lost
                store_hash: props.data.store_hash
            }
        });
        return;
    }
    navigate({
        page: 'BuyViewProductMarket',
        props: { target: product.hashkey }
    });
};
```
### AssignProductToStore.vue — current onMounted (lines 65-84)
```js
onMounted(() => {
  productHash.value = props.target || urlParams.get('target') || ...
  if (props.store_hash) {
    selectedStoreHash.value = props.store_hash
  }
  if (!productHash.value) {
    errorMessage.value = 'No product specified...'
    return
  }
  loadStores()
  loadProductData()
})
```
### useNavigate.js — URL builder logic
```js
const hashkeyProp = props?.target || props?.target_user || props?.hashkey || props?.id;
const payloadProp = props?.payload;
if (hashkeyProp) {
    url = `${basePageUrl}--${encodeHash(hashkeyProp)}`;   // --h:
} else if (payloadProp) {
    url = `${basePageUrl}--${encodePayload(payloadProp)}`; // --e:
}
```
### VueRouteMap.php — payload extraction
```php
} elseif (isset($parsedData['type']) && $parsedData['type'] === 'payload') {
    $props['payload'] = $parsedData['value'];  // decoded object available as props.payload in Vue
}
```
### Precedent: ManageProductAdmin.vue uses same pattern
```js
const productHash = computed(() => props.target || props.payload?.product_hash || props.payload?.product_hashkey);
const storeHash = computed(() => props.payload?.store_hash || props.payload?.store_hashkey);
```

## notes
- dictionary: ai-docs/dictionary.md — confirms: "use encoded payload (`--e:`) containing `product_hashkey` and `store_hashkey`" for product-in-store context
- linters: none detected
- constraints: canonical table names from dictionary irrelevant here (frontend-only change); no backend changes needed
- no migration, no permission enum, no VueRouteMap changes needed — the `/assign-product-to-store` route already has no `--h:` or `--e:` suffix registered (catch-all handles both)