Snap to lists while scrolling in kanban view #822

New Issue

OVERLORD · 2026-02-04T21:25:04+03:00

OVERLORD commented

2026-02-04 21:25:04 +03:00

Originally created by @knom on GitHub (Sep 24, 2025).

Is this a feature for the backend or frontend?

Frontend

What would you like?

I'd like to scroll from list to list in kanban view with one swipe.
So that scrolling snaps to each column.

Very useful on mobile devices.

Why is this needed?

I want this so I can quickly move between lists on my mobile device.

Other information

No response

Originally created by @knom on GitHub (Sep 24, 2025). ### Is this a feature for the backend or frontend? Frontend ### What would you like? I'd like to scroll from list to list in kanban view with one swipe. So that scrolling snaps to each column. Very useful on mobile devices. ### Why is this needed? I want this so I can quickly move between lists on my mobile device. ### Other information _No response_

OVERLORD commented

2026-02-04 21:25:13 +03:00

@knom commented on GitHub (Oct 2, 2025):

I'm trying to code it myself.. @meltyshev

KanbanContent.jsx seems to be the right place.

There.. I added:

// Helper to scroll to next/previous list
  const scrollList = useCallback((direction) => {
    window.scrollBy({ left: direction === 'left' ? 280 : -280, behavior: 'smooth' });
  }, []);

  // Use useSwipeable hook for swipe detection
  const handlers = useSwipeable({
    onSwipedLeft: () => scrollList('left'),
    onSwipedRight: () => scrollList('right'),
    preventScrollOnSwipe: true,
    trackTouch: true,
    trackMouse: false,
  });

useSwipeable is from library react-swipeable and the swiping works well.

HOWEVER.. instead of scrolling 280px, I would like to scroll the "next list" into view..

Any idea, how this would work?

@knom commented on GitHub (Oct 2, 2025): I'm trying to code it myself.. @meltyshev KanbanContent.jsx seems to be the right place. There.. I added: ``` // Helper to scroll to next/previous list const scrollList = useCallback((direction) => { window.scrollBy({ left: direction === 'left' ? 280 : -280, behavior: 'smooth' }); }, []); // Use useSwipeable hook for swipe detection const handlers = useSwipeable({ onSwipedLeft: () => scrollList('left'), onSwipedRight: () => scrollList('right'), preventScrollOnSwipe: true, trackTouch: true, trackMouse: false, }); ``` ```useSwipeable``` is from library ```react-swipeable``` and the swiping works well. HOWEVER.. instead of scrolling 280px, I would like to scroll the "next list" into view.. Any idea, how this would work?

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/planka#822