feat(vue-demo): add dynamic breadcrumbs #1369
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
@shopware/api-client
@shopware/api-gen
@shopware-pwa/composables-next
@shopware-pwa/cms-base
@shopware-pwa/helpers-next
@shopware-pwa/nuxt3-module
commit: |
|
@kstala could you test this please 🙌 |
|
|
||
| useBreadcrumbs(breadcrumbs); | ||
| const { buildDynamicBreadcrumbs } = useBreadcrumbs(); | ||
| buildDynamicBreadcrumbs(props.navigationId); |
There was a problem hiding this comment.
it's happening asynchronously, so I have two questions:
- how are you assuring it's loaded on Server Side Render?
- isn't there a blink on client side? What about showing previous breadcrumbs and replace them when new ones are loaded? Does it make sense?
| @@ -48,8 +66,38 @@ export function useBreadcrumbs( | |||
| _breadcrumbs.value = []; | |||
| }; | |||
|
|
|||
| const getCategoryBreadcrumbs = async (categoryId: string) => { | |||
| const response = await apiClient.invoke( | |||
| "readBreadcrumb get /breadcrumb/{id}", | |||
There was a problem hiding this comment.
this endpoint is not only to load category breadcrumbs, I'm not sure about exposing it here, what is the designed flow here looks like?
There was a problem hiding this comment.
This endpoint is only for the category breadcrumbs. For the product entity we will also receive, category breadcrumbs
| return response.data; | ||
| }; | ||
|
|
||
| const buildDynamicBreadcrumbs = async (categoryId: string) => { |
There was a problem hiding this comment.
what about product breadcrumbs?
There was a problem hiding this comment.
it is the same method, for product we are also getting category breadcrumbs
| } catch (error) { | ||
| console.error("Error while fetching breadcrumbs", error); | ||
| } |
There was a problem hiding this comment.
we should not handle errors in composable, it should be thrown to invoking component to handle in the project - analytics/notifications etc. however they need to handle it
| "@shopware-pwa/composables-next": minor | ||
| --- | ||
|
|
||
| Added `getCategoryBreadcrumbs` method for fetching backend breadcrumbs in `useBreadcrumbs` composable |
There was a problem hiding this comment.
the buildDynamicBreadcrumbs is more important functionality, should be mentioned and explained here more
| * @param page | ||
| * @returns | ||
| */ | ||
| export function getCmsBreadcrumbs< |
There was a problem hiding this comment.
not sure about this helper - it's not creating breadcrumbs, just displaying entity translated property, when would that be useful for the users?
There was a problem hiding this comment.
We are using it to build CMS page breadcrumbs, where we always have 1 level of breadcrumbs
Description
closes #139
Type of change
ToDo's
Screenshots (if applicable)
Additional context