Pan the viewport by dragging/clicking inside workflow minimap

[JokerQyou]

Self Checks

• I have searched for existing issues search for existing issues, including closed ones.
• I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
• [FOR CHINESE USERS] 请务必使用英文提交 Issue，否则会被关闭。谢谢！:）
• Please do not modify this template :) and fill in all the required fields.

1. Is this request related to a challenge you're experiencing? Tell me about your story.

If a workflow gets too complicated, e.g. too much nodes / iteration blocks, it becomes hard to navigate between nodes. When the user wants to pan to a certain node, he must zoom out, otherwise each mouse drag would not move the viewport too much. But zomming out means small and unreadable text, so it's harder to check where the target node is.

I noticed there is a minimap component on the bottom left, but it's only used to show where the current viewport is, it is not interactable. I suggest adding dragging/clicking to this minimap so we can easily pan the viewport by dragging/clicking inside it.

2. Additional context or comments

IIRC dify is using React Flow, its builtin minimap supports pannable and zoomable options so hopefully this should not be too hard: https://reactflow.dev/api-reference/components/minimap .

3. Can you help us with this feature?

• I am interested in contributing to this feature.