diff --git a/app/src/renderer/apps/Notes/components/Editor/Editor.tsx b/app/src/renderer/apps/Notes/components/Editor/Editor.tsx
index add35f5547..7e5b97b4fd 100644
--- a/app/src/renderer/apps/Notes/components/Editor/Editor.tsx
+++ b/app/src/renderer/apps/Notes/components/Editor/Editor.tsx
@@ -1,7 +1,8 @@
import debounce from 'lodash/debounce';
import { observer } from 'mobx-react';
-import { Flex, Spinner, Text } from '@holium/design-system/general';
+import { Button, Flex, Spinner, Text } from '@holium/design-system/general';
+import { useToggle } from '@holium/design-system/util';
import { PresenceBroadcast } from '@holium/realm-presence';
import { DataPacketKind } from 'renderer/apps/Rooms/store/room.types';
@@ -33,11 +34,14 @@ const EditorPresenter = () => {
const { loggedInAccount } = useAppState();
const { notesStore, spacesStore } = useShipStore();
+ const reconnecting = useToggle(false);
+
const selectedSpace = spacesStore.selected;
const {
selectedNote,
selectedAwareness,
initializing,
+ connectingToNoteRoom,
createNoteUpdateLocally,
saveNoteUpdates,
} = notesStore;
@@ -93,24 +97,71 @@ const EditorPresenter = () => {
return null;
}
- const isPersonalNote =
- selectedNote.space === `/${loggedInAccount.serverId}/our`;
- const alreadyInRoom =
- roomsStore.currentRoom?.path === selectedSpace.path + selectedNote.id;
-
- if (initializing || (!isPersonalNote && !alreadyInRoom)) {
+ if (initializing) {
return (
-
- {initializing ? 'Syncing updates' : 'Connecting to peers'}
-
+ Syncing updates
);
}
+ const isSpaceNote = selectedNote.space !== `/${loggedInAccount.serverId}/our`;
+ const roomPath = selectedSpace.path + selectedNote.id;
+ const existingRoom = roomsStore.getRoomByPath(roomPath);
+
+ const onClickReconnect = async () => {
+ reconnecting.toggleOn();
+
+ await roomsStore.createRoom(
+ `Notes: ${selectedNote.title}`,
+ 'public',
+ roomPath
+ );
+
+ reconnecting.toggleOff();
+ };
+
+ if (isSpaceNote && !existingRoom) {
+ if (connectingToNoteRoom) {
+ return (
+
+
+
+ Connecting to peers
+
+
+ );
+ } else {
+ return (
+
+
+ Room Closed
+ {reconnecting.isOn ? (
+
+ ) : (
+
+ Reconnect
+
+ )}
+
+
+ );
+ }
+ }
+
return (
{
searchQuery,
searchedNotes,
initializing,
+ setConnectingToNoteRoom,
setSelectedNoteId,
setSearchquery,
getNotePreview,
@@ -74,6 +75,8 @@ const NotesSidebarPresenter = () => {
roomsStore.currentRoom && roomsStore.currentRoom?.path === noteRoomPath;
if (areWeAlreadyInTheRoom) return;
+ setConnectingToNoteRoom(true);
+
// DELETE/LEAVE CURRENT ROOM
roomsStore.cleanUpCurrentRoom();
@@ -96,6 +99,8 @@ const NotesSidebarPresenter = () => {
await roomsStore.joinRoom(newRoomRid);
}
+ setConnectingToNoteRoom(false);
+
// In Notes rooms everyone should be muted by default.
roomsStore.ourPeer.mute();
};
diff --git a/app/src/renderer/stores/notes/notes.store.ts b/app/src/renderer/stores/notes/notes.store.ts
index fb139a92ee..1270c0e81d 100644
--- a/app/src/renderer/stores/notes/notes.store.ts
+++ b/app/src/renderer/stores/notes/notes.store.ts
@@ -35,6 +35,7 @@ export const NotesStore = types
searchQuery: types.optional(types.string, ''),
saving: types.optional(types.boolean, false),
initializing: types.optional(types.boolean, false),
+ connectingToNoteRoom: types.optional(types.boolean, false),
})
.volatile(() => ({
awarenesses: new Map(),
@@ -260,6 +261,10 @@ export const NotesStore = types
self.searchQuery = query;
},
+ setConnectingToNoteRoom: (connecting: boolean) => {
+ self.connectingToNoteRoom = connecting;
+ },
+
applyBroadcastedYdocUpdate(from: string, edit: string) {
if (!self.selectedNoteId) return;
@@ -352,6 +357,7 @@ export const notesStore = NotesStore.create({
selectedNoteId: null,
saving: false,
initializing: false,
+ connectingToNoteRoom: false,
});
// -------------------------------