Refactor desktop app into separate client and proxy apps

apps/yaak-client/components/DropMarker.tsx

@@ -0,0 +1,34 @@
+import classNames from 'classnames';
+import type { CSSProperties } from 'react';
+import { memo } from 'react';
+
+interface Props {
+  className?: string;
+  style?: CSSProperties;
+  orientation?: 'horizontal' | 'vertical';
+}
+
+export const DropMarker = memo(
+  function DropMarker({ className, style, orientation = 'horizontal' }: Props) {
+    return (
+      <div
+        style={style}
+        className={classNames(
+          className,
+          'absolute pointer-events-none z-50',
+          orientation === 'horizontal' && 'w-full',
+          orientation === 'vertical' && 'w-0 top-0 bottom-0',
+        )}
+      >
+        <div
+          className={classNames(
+            'absolute bg-primary rounded-full',
+            orientation === 'horizontal' && 'left-2 right-2 -bottom-[0.1rem] h-[0.2rem]',
+            orientation === 'vertical' && '-left-[0.1rem] top-0 bottom-0 w-[0.2rem]',
+          )}
+        />
+      </div>
+    );
+  },
+  () => true,
+);