Web version (#43)

* Create client package
* Create the UI package
* Init web app
* Use isomorphic 'ws' for web sockets
* File and asset implementations
* Use Opfs SAH version of sqlite in browser
* Generate Svg sprites for emojis and icons
* Include emojis sprite
* Improve and refactor assets
* More assets improvements
* Implement emoji and icons db import as readonly
* Improve import paths
* Handle concurrency limits for sqlite
* Fix event broadcast in web
* Pass windowId for subscribe and unsubscribe queries in desktop
* Remove asset context
* Implement avatar upload/download with the new structure
* Improve file handlings
* Move the necessary dependencies to client and ui packages
* Update packages
* Improve open file dialog
* Make sure database files are deleted in browser
* Improve avatar loading
* Improve file loading
* Fix some assets
* Implement asset caching for offline access
* Small fixes and improvements
* Use server instead of pre signed urls for file upload/download
* Cleanup some client related metadata
* Switch Axios with ky
* Refactor mutation results
* Minor concurrency fix
* Refactor web sockets
* Improve file uploading
* Handle connection close on server
* Use stream for downloading the file
* Add config options for cors
* Update document in all tabs on local change
* Include necessary icons for web
* Update docker compose
* Implement server upgrade required component
* Use correct client type and platform in web and desktop
* Improve service worker
* Improve versioning
* Fix an import
* Minor fixes
* Update some user endpoints
* Minor endpoint changes
* Enable app badge for desktop
* Add error handling in some database operations
* Update mutation naming convention
* Update query naming convention
* Update event and some metadata naming conventions
* Update event and job naming conventions in server
* Update Github workflow files
* Restructure assets directory
* Update packages
* Upgrade to Zod v4
* Upgrade to react 19
* Upgrade to tailwind v4
* Minor ui improvements
* Fix some cursor pointers
* Add browser not supported message in web
* Enhance server create flow, allow insecure connections and custom api paths
* Execute electron-rebuild as postinstall command
* Update docker compose

packages/ui/src/components/messages/message-reference.tsx

@@ -0,0 +1,46 @@
+import { LocalMessageNode } from '@colanode/client/types';
+import { MessageAuthorAvatar } from '@colanode/ui/components/messages/message-author-avatar';
+import { MessageAuthorName } from '@colanode/ui/components/messages/message-author-name';
+import { MessageContent } from '@colanode/ui/components/messages/message-content';
+import { useWorkspace } from '@colanode/ui/contexts/workspace';
+import { useQuery } from '@colanode/ui/hooks/use-query';
+
+interface MessageReferenceProps {
+  messageId: string;
+}
+
+export const MessageReference = ({ messageId }: MessageReferenceProps) => {
+  const workspace = useWorkspace();
+  const nodeGetQuery = useQuery({
+    type: 'node.get',
+    nodeId: messageId,
+    accountId: workspace.accountId,
+    workspaceId: workspace.id,
+  });
+
+  if (nodeGetQuery.isPending) {
+    return null;
+  }
+
+  const message = nodeGetQuery.data as LocalMessageNode;
+
+  if (!message) {
+    return (
+      <div className="flex flex-row gap-2 border-l-4 p-2">
+        <span className="text-sm text-muted-foreground">
+          Message not found or has been deleted
+        </span>
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-row gap-2 border-l-4 p-2">
+      <MessageAuthorAvatar message={message} className="size-5 mt-1" />
+      <div className='"flex-grow flex-col gap-1'>
+        <MessageAuthorName message={message} />
+        <MessageContent message={message} />
+      </div>
+    </div>
+  );
+};