refactor character asset mapping and replicant sync persistence

src/dashboard/example/stores/store-sync.ts

@@ -43,6 +43,13 @@ export const syncStateWithReplicant = <T>(
   storageKey?: string,
 ): void => {
   const isApplyingReplicant = ref(false);
+  const persistSnapshot = (value: T): void => {
+    if (!storageKey) {
+      return;
+    }
+
+    writeStorageSnapshot(storageKey, value);
+  };
 
   watch(
     () => replicant?.data,
@@ -55,9 +62,7 @@ export const syncStateWithReplicant = <T>(
       state.value = normalize(value);
       isApplyingReplicant.value = false;
 
-      if (storageKey) {
-        writeStorageSnapshot(storageKey, state.value);
-      }
+      persistSnapshot(state.value);
     },
     { deep: true, immediate: true },
   );
@@ -65,14 +70,13 @@ export const syncStateWithReplicant = <T>(
   watch(
     state,
     (value) => {
-      if (storageKey) {
-        writeStorageSnapshot(storageKey, value);
-      }
+      persistSnapshot(value);
 
       if (isApplyingReplicant.value || !replicant) {
         return;
       }
 
+      // Replicants remain the source of truth for server/browser synchronization.
       replicant.data = normalize(value);
       replicant.save();
     },