fix: speed variability adjusted

packages/editor/src/core/plugins/drag-handle.ts

@@ -168,32 +168,59 @@ export const DragHandlePlugin = (options: SideMenuPluginProps): SideMenuHandleOp
     const scrollableParent = getScrollParent(dragHandleElement);
     if (!scrollableParent) return;
 
+    const viewportHeight = window.innerHeight;
     const scrollRegionUp = options.scrollThreshold.up;
     const scrollRegionDown = window.innerHeight - options.scrollThreshold.down;
 
+    const baseSpeed = maxScrollSpeed;
+    const viewportSpeedMultiplier = Math.log10(viewportHeight / 500) + 1;
+    const adjustedMaxSpeed = (baseSpeed / viewportSpeedMultiplier) * 0.8;
+
     let targetScrollAmount = 0;
 
+    const customEasing = (t: number) => t * t * t;
     if (isDraggedOutsideWindow === "top") {
-      targetScrollAmount = -maxScrollSpeed * 5;
+      // reduce multiplier for outside window scrolling
+      targetScrollAmount = -adjustedMaxSpeed * 3;
     } else if (isDraggedOutsideWindow === "bottom") {
-      targetScrollAmount = maxScrollSpeed * 5;
+      targetScrollAmount = adjustedMaxSpeed * 3;
     } else if (lastClientY < scrollRegionUp) {
-      const ratio = easeOutQuadAnimation((scrollRegionUp - lastClientY) / options.scrollThreshold.up);
-      targetScrollAmount = -maxScrollSpeed * ratio;
+      const distance = scrollRegionUp - lastClientY;
+      const normalizedDistance = distance / scrollRegionUp;
+
+      // apply multiple easing functions for more control
+      const easedRatio = customEasing(normalizedDistance);
+      const smoothedRatio = easeOutQuadAnimation(easedRatio);
+
+      targetScrollAmount = -adjustedMaxSpeed * smoothedRatio;
     } else if (lastClientY > scrollRegionDown) {
-      const ratio = easeOutQuadAnimation((lastClientY - scrollRegionDown) / options.scrollThreshold.down);
-      targetScrollAmount = maxScrollSpeed * ratio;
+      const distance = lastClientY - scrollRegionDown;
+      const normalizedDistance = distance / (viewportHeight - scrollRegionDown);
+
+      // apply multiple easing functions for more control
+      const easedRatio = customEasing(normalizedDistance);
+      const smoothedRatio = easeOutQuadAnimation(easedRatio);
+
+      targetScrollAmount = adjustedMaxSpeed * smoothedRatio;
     }
 
-    currentScrollSpeed += (targetScrollAmount - currentScrollSpeed) * acceleration;
+    // dampening the speed based on screen size
+    const dampeningFactor = Math.max(0.3, Math.min(1, viewportHeight / 1000));
+    targetScrollAmount *= dampeningFactor;
 
-    if (Math.abs(currentScrollSpeed) > 0.1) {
-      scrollableParent.scrollBy({ top: currentScrollSpeed });
+    // reduce acceleration for smoother ramping
+    const reducedAcceleration = acceleration * 0.75;
+    currentScrollSpeed += (targetScrollAmount - currentScrollSpeed) * reducedAcceleration;
+
+    // Add minimum threshold for very slow speeds
+    if (Math.abs(currentScrollSpeed) > 0.05) {
+      // Apply additional smoothing to the final scroll amount
+      const smoothedSpeed = Math.sign(currentScrollSpeed) * Math.pow(Math.abs(currentScrollSpeed), 1.2);
+      scrollableParent.scrollBy({ top: smoothedSpeed });
     }
 
     scrollAnimationFrame = requestAnimationFrame(scroll);
   }
-
   let dragHandleElement: HTMLElement | null = null;
   // drag handle view actions
   const showDragHandle = () => dragHandleElement?.classList.remove("drag-handle-hidden");

packages/services/src/api.service.ts

@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import axios, { AxiosInstance, AxiosRequestConfig } from "axios";
-import { IndexedDBService } from "./indexedDB.service";
 
 /**
  * Abstract base class for making HTTP requests using axios

packages/services/src/indexedDB.service.ts

@@ -1,62 +0,0 @@
-export abstract class IndexedDBService {
-  private dbName: string;
-  private version: number;
-  private db: IDBDatabase | null = null;
-
-  constructor(dbName: string, version: number) {
-    this.dbName = dbName;
-    this.version = version;
-  }
-
-  async init(): Promise<void> {
-    return new Promise((resolve, reject) => {
-      const request = indexedDB.open(this.dbName, this.version);
-
-      request.onerror = () => reject(request.error);
-      request.onsuccess = () => {
-        this.db = request.result;
-        resolve();
-      };
-
-      request.onupgradeneeded = (event) => {
-        const db = (event.target as IDBOpenDBRequest).result;
-        if (!db.objectStoreNames.contains("workspaces")) {
-          db.createObjectStore("workspaces", { keyPath: "id" });
-        }
-      };
-    });
-  }
-
-  async save(workspaces: any[]): Promise<void> {
-    if (!this.db) throw new Error("Database not initialized");
-
-    const transaction = this.db.transaction("workspaces", "readwrite");
-    const store = transaction.objectStore("workspaces");
-
-    return new Promise((resolve, reject) => {
-      // Clear existing data
-      store.clear();
-
-      // Add new workspaces
-      workspaces.forEach((workspace) => {
-        store.add(workspace);
-      });
-
-      transaction.oncomplete = () => resolve();
-      transaction.onerror = () => reject(transaction.error);
-    });
-  }
-
-  async query(): Promise<any[]> {
-    if (!this.db) throw new Error("Database not initialized");
-
-    const transaction = this.db.transaction("workspaces", "readonly");
-    const store = transaction.objectStore("workspaces");
-
-    return new Promise((resolve, reject) => {
-      const request = store.getAll();
-      request.onsuccess = () => resolve(request.result);
-      request.onerror = () => reject(request.error);
-    });
-  }
-}

packages/shared-state/.eslintignore

@@ -1,3 +0,0 @@
-build/*
-dist/*
-out/*

packages/shared-state/.eslintrc.js

@@ -1,9 +0,0 @@
-/** @type {import("eslint").Linter.Config} */
-module.exports = {
-  root: true,
-  extends: ["@plane/eslint-config/library.js"],
-  parser: "@typescript-eslint/parser",
-  parserOptions: {
-    project: true,
-  },
-};

packages/shared-state/.prettierrc

@@ -1,5 +0,0 @@
-{
-  "printWidth": 120,
-  "tabWidth": 2,
-  "trailingComma": "es5"
-}

packages/shared-state/package.json

@@ -1,20 +0,0 @@
-{
-  "name": "@plane/shared-state",
-  "version": "0.24.1",
-  "description": "Shared state shared across multiple apps internally",
-  "private": true,
-  "main": "./src/index.ts",
-  "types": "./src/index.ts",
-  "scripts": {
-    "lint": "eslint src --ext .ts,.tsx",
-    "lint:errors": "eslint src --ext .ts,.tsx --quiet"
-  },
-  "dependencies": {
-    "zod": "^3.22.2"
-  },
-  "devDependencies": {
-    "@plane/eslint-config": "*",
-    "@types/node": "^22.5.4",
-    "typescript": "^5.3.3"
-  }
-}

packages/shared-state/src/store/user.store.ts

@@ -1,136 +0,0 @@
-import { makeObservable, observable } from "mobx";
-import { IWorkspaceStore } from "./workspace.store";
-
-export interface IUserStore {
-  user: any;
-  workspaces: Map<string, IWorkspaceStore>;
-  isLoading: boolean;
-  error: any;
-}
-
-export class UserStore implements IUserStore {
-  user: any = null;
-  workspaces: Map<string, IWorkspaceStore> = new Map();
-  isLoading: boolean = false;
-  error: any = null;
-
-  constructor() {
-    makeObservable(this, {
-      user: observable.ref,
-      workspaces: observable,
-      isLoading: observable.ref,
-      error: observable.ref,
-    });
-  }
-}
-
-// userStore.ts
-
-// class UserStore {
-//   user: User | null = null;
-//   workspaces: Workspace[] = [];
-//   isLoading = false;
-//   error: string | null = null;
-//   private indexedDBService: IndexedDBService;
-
-//   constructor() {
-//     makeAutoObservable(this);
-//     this.indexedDBService = new IndexedDBService();
-//     this.init();
-//   }
-
-//   private async init() {
-//     try {
-//       await this.indexedDBService.init();
-//       await this.loadWorkspacesFromIndexedDB();
-//     } catch (error) {
-//       runInAction(() => {
-//         this.error = "Failed to initialize store";
-//         console.error("Store initialization error:", error);
-//       });
-//     }
-//   }
-
-//   setUser(user: User | null) {
-//     this.user = user;
-//   }
-
-//   async loadWorkspacesFromIndexedDB() {
-//     try {
-//       const workspaces = await this.indexedDBService.getWorkspaces();
-//       runInAction(() => {
-//         this.workspaces = workspaces;
-//       });
-//     } catch (error) {
-//       runInAction(() => {
-//         this.error = "Failed to load workspaces from IndexedDB";
-//         console.error("Load workspaces error:", error);
-//       });
-//     }
-//   }
-
-//   async fetchAndSyncWorkspaces() {
-//     this.isLoading = true;
-//     this.error = null;
-
-//     try {
-//       // Simulate API call to fetch workspaces
-//       const response = await fetch("/api/workspaces");
-//       const workspaces = await response.json();
-
-//       // Save to IndexedDB
-//       await this.indexedDBService.saveWorkspaces(workspaces);
-
-//       // Update MobX store
-//       runInAction(() => {
-//         this.workspaces = workspaces;
-//         this.isLoading = false;
-//       });
-//     } catch (error) {
-//       runInAction(() => {
-//         this.error = "Failed to fetch workspaces";
-//         this.isLoading = false;
-//         console.error("Fetch workspaces error:", error);
-//       });
-//     }
-//   }
-
-//   // Additional methods for workspace management
-//   async addWorkspace(workspace: Omit<Workspace, "id" | "createdAt" | "updatedAt">) {
-//     this.isLoading = true;
-//     this.error = null;
-
-//     try {
-//       // Simulate API call to create workspace
-//       const response = await fetch("/api/workspaces", {
-//         method: "POST",
-//         body: JSON.stringify(workspace),
-//       });
-//       const newWorkspace = await response.json();
-
-//       // Update local storage and state
-//       const updatedWorkspaces = [...this.workspaces, newWorkspace];
-//       await this.indexedDBService.saveWorkspaces(updatedWorkspaces);
-
-//       runInAction(() => {
-//         this.workspaces.push(newWorkspace);
-//         this.isLoading = false;
-//       });
-//     } catch (error) {
-//       runInAction(() => {
-//         this.error = "Failed to add workspace";
-//         this.isLoading = false;
-//         console.error("Add workspace error:", error);
-//       });
-//     }
-//   }
-
-//   logout() {
-//     this.user = null;
-//     this.workspaces = [];
-//     // Optionally clear IndexedDB data
-//     this.indexedDBService.init().then(() => {
-//       this.indexedDBService.saveWorkspaces([]);
-//     });
-//   }
-// }

packages/shared-state/src/store/workspace.store.ts

@@ -1,28 +0,0 @@
-import { makeObservable, observable } from "mobx";
-
-export interface IWorkspaceStore {
-  id: string;
-  name: string;
-  createdAt: string;
-  updatedAt: string;
-}
-
-export class WorkspaceStore implements IWorkspaceStore {
-  id: string;
-  name: string;
-  createdAt: string;
-  updatedAt: string;
-
-  constructor(data: IWorkspaceStore) {
-    makeObservable(this, {
-      id: observable.ref,
-      name: observable.ref,
-      createdAt: observable.ref,
-      updatedAt: observable.ref,
-    });
-    this.id = data.id;
-    this.name = data.name;
-    this.createdAt = data.createdAt;
-    this.updatedAt = data.updatedAt;
-  }
-}

packages/shared-state/tsconfig.json

@@ -1,12 +0,0 @@
-{
-  "extends": "@plane/typescript-config/react-library.json",
-  "compilerOptions": {
-    "jsx": "react",
-    "lib": ["esnext", "dom"],
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "include": ["./src"],
-  "exclude": ["dist", "build", "node_modules"]
-}