feat: new project dialog for web

[cguedes]

This closes #446

This PR introduces a new core atom for modals named createModalAtoms.

With that, we can create a modal atoms for the create project model with:

export const createProjectModalAtoms = createModalAtoms<string>();

And then open the modal using:

const modalResult = useSetAtom(createProjectModalAtoms.openAtom);
if (modalResult.status === 'dismissed') {
   // modal closed or canceled
}
const projectName = modalResult.value;
...

That would return a string with the modal return value (a string), or null if the modal was closed/canceled.

The modal code would be something like:

  const isVisible = useAtomValue(createProjectModalAtoms.visibleAtom);
  const closeModal = useSetAtom(createProjectModalAtoms.closeAtom);
  const dismissModal = useSetAtom(createProjectModalAtoms.dismissAtom);
  ...
  const handleFormSubmit: FormEventHandler = (e) => {
    ...
    closeModal(name.trim());
  };
  const handleOnCancel: MouseEventHandler<HTMLButtonElement> = (e) => {
    dismissModal();
  };

[codecov]

Codecov Report

Merging #480 (b56da5b) into main (7792576) will decrease coverage by 0.15%.
The diff coverage is 55.91%.

@@            Coverage Diff             @@
##             main     #480      +/-   ##
==========================================
- Coverage   80.76%   80.62%   -0.15%     
==========================================
  Files         198      201       +3     
  Lines       11856    12025     +169     
  Branches     1141     1161      +20     
==========================================
+ Hits         9576     9695     +119     
- Misses       2266     2315      +49     
- Partials       14       15       +1     

Files Changed	Coverage Δ
src/application/App.tsx	0.00% <0.00%> (ø)
src/application/CreateProjectModal.tsx	0.00% <0.00%> (ø)
src/application/listeners/projectEventListeners.ts	40.39% <32.43%> (+1.50%)	⬆️
src/components/Input.tsx	96.82% <80.00%> (-3.18%)	⬇️
src/atoms/core/createModalAtoms.ts	100.00% <100.00%> (ø)
src/atoms/debugAtom.ts	100.00% <100.00%> (ø)
src/atoms/projectState.ts	71.95% <100.00%> (+29.28%)	⬆️
src/components/Button.tsx	100.00% <100.00%> (ø)
src/io/__mocks__/filesystem.ts	100.00% <100.00%> (ø)

📣 We’re building smart automated test selection to slash your CI/CD build times. Learn more