Implement liveReload utils to simplify live reload implementations #168
Conversation
src/utils/liveReload.ts
Outdated
| const applyUpdateOnItemOptionallyAsync = <Elements extends IContentItemElements>( | ||
| item: IContentItem<Elements>, | ||
| update: InternalUpdateMessage, | ||
| resolveElementCodename: null | ((codename: string) => string) |
There was a problem hiding this comment.
nitpick: you can use default value here, then you could use resolveElementCodename without || null on line 31 and line 49 won't be necessary.. if you find this harder to read, I understand
src/utils/liveReload.ts
Outdated
| }; | ||
| } | ||
| default: | ||
| throw new Error(); |
There was a problem hiding this comment.
this error doesn't tell much :D
src/utils/liveReload.ts
Outdated
| const shouldApplyOnThisItem = | ||
| item.system.codename === update.item.codename && item.system.language === update.variant.codename; | ||
|
|
||
| const resolveCodename = resolveElementCodename ?? ((c: string) => camelCasePropertyNameResolver('', c)); |
There was a problem hiding this comment.
by default codenames are in snake_case, wouldn't it bebetter to have snakeCaseResolver as default?
There was a problem hiding this comment.
The SDK uses camelCase by default. When you don't configure it explicitly you will have camelCase codenames in item.elements keys in res.data of SDK responses.
src/utils/liveReload.ts
Outdated
|
|
||
| return applyOnOptionallyAsync( | ||
| mergeOptionalAsyncs( | ||
| typedItemElement.linkedItems.map((i) => applyUpdateOnItemOptionallyAsync(i, update, resolveElementCodename)) |
There was a problem hiding this comment.
just for thinking if not already solved: what is the depth for linked items? what about the circular references?
There was a problem hiding this comment.
This is a very good point. I updated the code to handle item cycles properly coupled with a few tests.
JiriLojda
force-pushed
the
live_reload_utils
branch
from
e846cf0
to
ae85001
Compare
README.md
Outdated
|
|
||
| ```ts | ||
| import KontentSmartLink, { KontentSmartLinkEvent } from '@kontent-ai/smart-link'; | ||
| import KontentSmartLink, { KontentSmartLinkEvent, applyUpdateOnItem, applyUpdateOnItemAndLoadLinkedItems } from '@kontent-ai/smart-link'; | ||
|
|
||
| // Initialize the SDK | ||
| const sdk = KontentSmartLink.initialize({ ... }); | ||
|
|
||
| // Listen for updates and apply them to your application | ||
| sdk.on(KontentSmartLink.Update, (data: IUpdateMessageData) => { |
| // Use this data to update your application state or UI as needed e.g.: | ||
| setItems((items) => items.map(item => applyUpdateOnItem(item, data))); | ||
| // or | ||
| Promise.all(items.map(item => applyUpdateOnItemAndLoadLinkedItems(item, data, fetchItemsFromDeliveryApi))) |
There was a problem hiding this comment.
don't we want to add below?
I know its up to anybody how he want to get the items, but this example would save me 2 or 3 minutes till i figured out how to do it :D
const fetchItemsFromDeliveryApi = (items) => client.items().inFilter(system.codename, items).toAllPromise().then(res => res.data.items)
JiriLojda
force-pushed
the
live_reload_utils
branch
from
470a405
to
d9af171
Compare
Motivation
Which issue does this fix? Fixes #
issue numberIf no issue exists, what is the fix or new feature? Were there any reasons to fix/implement things that are not obvious?
Checklist
How to test
If manual testing is required, what are the steps?