Refactor desktop app into separate client and proxy apps

apps/yaak-client/components/core/tree/TreeIndentGuide.tsx

@@ -0,0 +1,32 @@
+import classNames from 'classnames';
+import { useAtomValue } from 'jotai';
+import { memo } from 'react';
+import { hoveredParentDepthFamily, isAncestorHoveredFamily } from './atoms';
+
+export const TreeIndentGuide = memo(function TreeIndentGuide({
+  treeId,
+  depth,
+  ancestorIds,
+}: {
+  treeId: string;
+  depth: number;
+  ancestorIds: string[];
+}) {
+  const parentDepth = useAtomValue(hoveredParentDepthFamily(treeId));
+  const isHovered = useAtomValue(isAncestorHoveredFamily({ treeId, ancestorIds }));
+
+  return (
+    <div className="flex">
+      {Array.from({ length: depth }).map((_, i) => (
+        <div
+          // biome-ignore lint/suspicious/noArrayIndexKey: none
+          key={i}
+          className={classNames(
+            'w-[calc(1rem+0.5px)] border-r border-r-text-subtlest',
+            !(parentDepth === i + 1 && isHovered) && 'opacity-30',
+          )}
+        />
+      ))}
+    </div>
+  );
+});