Not sure how to reproduce exactly beyond just dragging a bunch of random items. It doesn't happen on every drag, but frequently enough to be an issue.

The blank page is un-refreshable, so the only way to get back to the previous state is to copy/paste the URL into a new tab.

https://user-images.githubusercontent.com/47898552/194713185-05b6d390-d879-44cb-8e82-fbdd839eff6f.mp4

Hi, I saw someone asked for import/export functionality, and so I tried my hand at implementing them (got it all functional but the UX is sorely lacking at the moment). Never really contributed to an 'open source' project and was wondering if someone here could guide me as to good etiquette when it comes to forks/PRs.

I've currently made a fork of the project with a feature branch containing what I would like. Where should I PR to when I'm ready?

The copy button just places the item at the top-left corner, it'd be nice if you could press Ctrl while starting to drag an item to create a copy (leaving the original behind instead of the normal move).

This would make it pretty quick to put a bunch of tables or counters in a row.

(The orientation should also be copied.)

1. I don't see any chairs in the right side menu. Having them as an item would help with planning tight table arrangements.

2. Whether or not the chairs are listed in the inventory list wouldn't matter to me, but not including them in the list is probably ideal.

3. A bonus would be a feature that notices when chairs are pointing at adjacent tables and adds a tally number over the tables like in the game, but that isn't necessary for basic planning. Just a chair item that can be rotated like everything else would be enough. (If the tally were implemented, the numbers should probably be "transparent" to mouse clicks so interacting with the table underneath isn't affected.)

When using a very small restaurant size, the appliance panel disappears and doesn't appear to be able to be brought back.

Using Firefox 103 on OSX, using a full-screen (1920x1080) browser layout.

It would be great if it was possible to place notes on appliances. For example, if I wanted to mark a number for a teleporter, or specify what a smart grabber is filtered for, I currently can't do that, but this is very important for planning large automations.

Serializing multiple walls as a single alpha-numeral. Includes a deserializer map to different versions of the deserializer for backwards compatibility. Only supports serializing in the current version as changes between version shouldn't result in issues.

Serializes 3 walls into each byte: using the characterset (regex notation) [a-zA-Z_\-] Implemented backwards compatibility with previous encoding.

Always exports to most recent version.

Here's a first attempt at adding mobile support by allowing users to move items with 2 taps.

Tap to select and then tap again on the same item to unselect or tap somewhere else to move the item. Moving with taps also unselects the item as it seemed counterintuitive to have to unselect it after moving.

If no one finds any bugs with this, I think this basic implementation is a good start for now and we can improve it later.

Known opportunities for improvement (but may not be blockers to moving forward with this PR):

• Multi-touch events and gestures may cause unexpected behaviors. Can be avoided by not starting gestures on the grid.
• Tap outside the grid to deselect or other QOL ideas might be nice.

Other notes:

• I created a Cell type to represent [number, number] and put it in src/types/project.d.ts. Let me know if there's a better place.
• I created a helper function called areSameCell to compare cells. It could be used in a lot of the places where we're currently doing things like clickedCell[0] !== selectedCell[0] || clickedCell[1] !== selectedCell[1] as !areSameCell(selectedCell, clickedCell) to simplify and clarify.

Created a little feature to allow users to quickly duplicate whatever they have selected to either wherever the user is hovering or the first available empty square. Hotkey is currently 'ctrl+d'.

Added styled-components Styled components is uses to replace the existing CSS and Antd with component based CSS-in-JS style. THEME is now also introduced, this makes it easier to reuse colors and styling throughout development. Currently Antd is also causing some problems with the original styling.

Added react-router-dom The homepage or layout width form is now on a separate route from the workspace content. This makes it easier to differentiate between what to render instead of an if statement in root. Currently, it will break original links, but back port functionality will be implemented.

Added zustand Zustand is uses as a global state management system, it is there to keep data in sync across components without the need of prop drilling.

Code wise, nothing changed, I only fixed some prettier / ESLint problems and moved code around.

Dependencies are now also better split in dependencies and devDependencies

Maximum grid size would be 40 width x 20 height, while default still remains at 16x12.

Since URLs have a maximum length of 2048 characters, URL sharing will be disabled if the hash exceeds 1800 characters (with ~300 characters left for some leeway... hopefully enough?)

A warning shows up if the user tries to put in a layout that is larger than 16x12.