Option to Disable Auto-Arrange for Desktop Items

[jelveh]

The current behavior of Puter automatically arranges items on the desktop in a predefined grid pattern. While this ensures a neat and organized appearance, it limits users' ability to personalize their workspace by placing items freely. Implementing an option to disable auto-arrange would allow users to customize their desktop layout to better suit their preferences and workflows.

Expected Behavior:

• Toggle Auto-Arrange: Users should have the option to enable or disable the auto-arrange feature. When disabled, users can place desktop items anywhere on the desktop without being snapped to the grid.
• Manual Arrange Mode: With auto-arrange disabled, users can manually position items on the desktop. The system should remember the positions of these items across sessions.
• Context Menu Option: The ability to toggle auto-arrange on and off should be easily accessible through the desktop context menu (right-click menu), under a "Sort By", "View" or "Arrange Icons" submenu.
• Persisting Custom Layouts: The desktop environment should persist user-defined item positions, ensuring that the custom layout is maintained after logging out, or refreshing the browser. Puter.js's puter.kv module could be used for this (docs)

[vineeth-vk11]

@jelveh I would like to work on this. Can you assign this to me?

[AtkinsSJ]

:thinking: An extra wrinkle with persistence is that we probably want it to work if you have multiple puter.com tabs open at once, so changing the layout on one updates it in the other.

[jelveh]

Syncing across open tabs in the same browser can be handled using localStorage. For example, we could store auto arrange status in key auto_arrange in localStorage and use the storage event across tabs to see if it has changed:

// Add the event listener for the storage event
window.addEventListener('storage', onKeyChange(event) {
  // Check if the changed key is the one we're interested in
  if (event.key === 'auto_arrange') {
    console.log('Value for auto_arrange has changed to:', event.newValue);
    // Perform your actions here based on the new value
  }
});

[vineeth-vk11]

@jelveh when a user toggles auto arrange off, drags an item and toggles the auto arrange back on, the items are sorted back, and now the user toggles it back on, should the item which was dragged go back to the last position?