feat: filter inspected data

yjs · Aug 11, 2024 · 0a90569 · 0a90569
1 parent e77f107
commit 0a90569
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 3 deletions.
diff --git a/src/data-types.tsx b/src/data-types.tsx
@@ -8,7 +8,8 @@ import { ComponentType } from "react";
 import * as Y from "yjs";
 import { Badge } from "./components/ui/badge";
 import { toast } from "./components/ui/use-toast";
-import { useConfig } from "./state";
+import { removeMismatchedValues } from "./filter-set";
+import { useConfig, useFilterSet } from "./state";
 import { getYTypeName, isYShape, parseYShape } from "./y-shape";
 
 const TypeLabel = ({ value }: { value: unknown }) => {
@@ -19,6 +20,8 @@ const TypeLabel = ({ value }: { value: unknown }) => {
       className="mr-1 cursor-pointer"
       onClick={(e) => {
         e.stopPropagation();
+        // This logs is expected to be used for user debugging
+        // Do not remove this log!
         console.log(value);
         toast({
           duration: 2000,
@@ -82,6 +85,7 @@ const YTypeComponent: ComponentType<DataItemProps<any>> = ({
   const StrComponent = stringType.Component!;
   const ObjComponent = objectType.Component!;
   const [config] = useConfig();
+  const [filterSet] = useFilterSet();
 
   if (!config.parseYDoc) {
     if (typeof value === "string") {
@@ -112,9 +116,11 @@ const YTypeComponent: ComponentType<DataItemProps<any>> = ({
     );
   }
 
+  const filteredValue = removeMismatchedValues(parsedValue, filterSet);
+
   return (
     <ObjComponent
-      value={parsedValue}
+      value={filteredValue}
       prevValue={parsedPrevValue as object}
       {...props}
     ></ObjComponent>

diff --git a/src/state.ts b/src/state.ts
@@ -103,3 +103,16 @@ const configAtom = atomWithStorage<Config>(
 export const useConfig = () => {
   return useAtom(configAtom);
 };
+
+const filterSetAtom = atom<Set<Y.AbstractType<unknown> | Y.Doc>>(
+  new Set<Y.AbstractType<unknown> | Y.Doc>(),
+);
+
+// const filterPredicateAtom = atom((get) => {
+//   const rule = get(filterRuleAtom);
+//   return rule;
+// });
+
+export const useFilterSet = () => {
+  return useAtom(filterSetAtom);
+};
diff --git a/src/y-shape.ts b/src/y-shape.ts
@@ -123,7 +123,7 @@ export function isYShape(
 export function parseYShape(
   value: Y.AbstractType<unknown> | Y.Doc,
   { showDelta }: { showDelta: boolean } = { showDelta: true },
-): object | string {
+): unknown[] | Record<string, unknown> | string | Y.AbstractType<unknown> {
   if (isYDoc(value)) {
     const yDoc = value;
     const keys = Array.from(yDoc.share.keys());