Merge pull request '(feat): version bump needed for new ttp version' (#4) from dev into main

Reviewed-on: #4

.forgejo/workflows/deploy-prod.yml

@@ -147,7 +147,7 @@ jobs:
         run: |
           VERSION="$(node -p "require('./package.json').version")"
           echo "version=$VERSION" >> "$FORGEJO_OUTPUT"
-          echo "tag=$VERSION" >> "$FORGEJO_OUTPUT"
+          echo "tag=${VERSION}-prod" >> "$FORGEJO_OUTPUT"
 
       - name: Create release and upload files
         env:

.vscode/extensions.json

@@ -2,6 +2,7 @@
   "recommendations": [
     "tauri-apps.tauri-vscode",
     "rust-lang.rust-analyzer",
-    "bradlc.vscode-tailwindcss"
+    "bradlc.vscode-tailwindcss",
+    "antfu.vite"
   ]
 }

apps/tauri/package.json

@@ -25,7 +25,7 @@
     "dev:mobile:raw": "tauri android dev",
     "build:mobile:raw": "tauri android build",
     "dev:mobile": "if command -v nix >/dev/null 2>&1; then nix develop --command bun dev:mobile:raw; else bun dev:mobile:raw; fi",
-    "build:mobile": "bun run render-version.ts && if command -v nix >/dev/null 2>&1; then nix develop --command bun build:mobile:raw; else bun build:mobile:raw; fi && bun run render-version.ts --unrender",
+    "build:mobile": "if command -v nix >/dev/null 2>&1; then nix develop --command bun build:mobile:raw; else bun build:mobile:raw; fi",
     "dev:desktop:raw": "tauri dev",
     "build:desktop:raw": "tauri build",
     "dev:desktop": "if command -v nix >/dev/null 2>&1; then nix develop --command bun dev:desktop:raw; else bun dev:desktop:raw; fi",
@@ -46,7 +46,6 @@
     "react-dom": "^19.2.0"
   },
   "devDependencies": {
-    "@tauri-apps/cli": "^2",
+    "@tauri-apps/cli": "^2"
-    "@types/node": "^25.9.1"
   }
 }

apps/tauri/render-version.ts

@@ -1,75 +0,0 @@
-import fs from "fs";
-import path from "path";
-
-// Config
-const PLACEHOLDER_VERSION = "0.0.0";
-
-const rootPackageJsonPath = path.resolve(__dirname, "../../package.json");
-const cargoTomlPath = path.resolve(__dirname, "./src-tauri/Cargo.toml");
-const tauriConfigPath = path.resolve(__dirname, "./src-tauri/tauri.conf.json");
-
-// Args
-const isUnrender = process.argv.includes("--unrender");
-
-// Version Source
-const packageJson = JSON.parse(
-  fs.readFileSync(rootPackageJsonPath, "utf8")
-);
-
-const packageVersion: string = packageJson.version;
-
-if (!packageVersion && !isUnrender) {
-  throw new Error("No version found in package.json");
-}
-
-const targetVersion = isUnrender
-  ? PLACEHOLDER_VERSION
-  : packageVersion;
-
-// Helpers
-function updateCargoToml(content: string): string {
-  const regex = /^version\s*=\s*".*"$/m;
-
-  if (!regex.test(content)) {
-    throw new Error("Could not find version field in Cargo.toml");
-  }
-
-  return content.replace(
-    regex,
-    `version = "${targetVersion}"`
-  );
-}
-
-function updateTauriConfig(content: string): string {
-  const regex = /"version"\s*:\s*".*"/;
-
-  if (!regex.test(content)) {
-    throw new Error("Could not find version field in tauri.conf.json");
-  }
-
-  return content.replace(
-    regex,
-    `"version": "${targetVersion}"`
-  );
-}
-
-// Update Cargo.toml
-const cargoToml = fs.readFileSync(cargoTomlPath, "utf8");
-
-const updatedCargoToml = updateCargoToml(cargoToml);
-
-fs.writeFileSync(cargoTomlPath, updatedCargoToml, "utf8");
-
-// Update tauri.conf.json
-const tauriConfig = fs.readFileSync(tauriConfigPath, "utf8");
-
-const updatedTauriConfig = updateTauriConfig(tauriConfig);
-
-fs.writeFileSync(tauriConfigPath, updatedTauriConfig, "utf8");
-
-// Finished
-if (isUnrender) {
-  console.log(`Unrendered versions back to ${PLACEHOLDER_VERSION}`);
-} else {
-  console.log(`Rendered version ${targetVersion}`);
-}

apps/tauri/src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
-name = "Tensamin"
+name = "tensamin"
-version = "0.0.0"
+version = "0.1.0"
 description = "Privacy focused messanger"
 authors = ["methanium"]
 edition = "2021"

apps/tauri/src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://schema.tauri.app/config/2",
   "productName": "Tensamin",
-  "version": "0.0.0",
+  "version": "0.1.0",
   "mainBinaryName": "tensamin",
   "identifier": "net.tensamin.client",
   "build": {

apps/tauri/tsconfig.json

@@ -1,6 +1,5 @@
 {
   "compilerOptions": {
-    "types": ["node"],
     "target": "ES2022",
     "module": "ESNext",
     "moduleResolution": "bundler",
@@ -9,5 +8,5 @@
     "skipLibCheck": true,
     "noEmit": true
   },
-  "include": ["src", "./render-version.ts"]
+  "include": ["src"]
 }

apps/web/src/components/screens/login/form.tsx

@@ -190,9 +190,11 @@ export default function Form() {
     [save],
   );
 
+  const isTauriEnv = isTauri();
+
   return (
     <div className="flex md:flex-row flex-col gap-15">
-      {isTauri() ? (
+      {isTauriEnv ? (
         <>
           <QrCodeScanner
             onData={async (data) => {

apps/web/src/routes/settings/security.tsx

@@ -46,7 +46,6 @@ function QrCodeLogin() {
   const [qrCodeBase64, setQrCodeBase64] = useState<string | undefined>(
     undefined,
   );
-  const [connectionString, setConnectionString] = useState<string | null>(null);
 
   useEffect(() => {
     load("private_key").then((value) => {
@@ -59,25 +58,15 @@ function QrCodeLogin() {
         setUserId(value);
       }
     });
-    load("ttp_url")
-      .then((value) => {
-        if (value) {
-          const url = new URL(value);
-          setConnectionString(`@${url.host}`);
-        } else {
-          setConnectionString("");
-        }
-      })
-      .catch(() => setConnectionString(""));
   }, [load]);
 
   useEffect(() => {
-    if (userId && privateKey && connectionString !== null) {
+    if (userId && privateKey) {
-      generateQR(
+      generateQR(`tensamin://tu::${userId}::${privateKey}`).then(
-        `tensamin://tu::${userId}${connectionString}::${privateKey}`,
+        setQrCodeBase64,
-      ).then(setQrCodeBase64);
+      );
     }
-  }, [userId, privateKey, connectionString]);
+  }, [userId, privateKey]);
 
   const [qrCodeVisible, setQrCodeVisible] = useState(false);
 

bun.lock

@@ -40,7 +40,6 @@
       },
       "devDependencies": {
         "@tauri-apps/cli": "^2",
-        "@types/node": "^25.9.1",
       },
     },
     "apps/web": {
@@ -1662,8 +1661,6 @@
 
     "@tailwindcss/oxide-wasm32-wasi/tslib": ["tslib@2.8.1", "", { "bundled": true }, "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="],
 
-    "@tensamin/tauri/@types/node": ["@types/node@25.9.1", "", { "dependencies": { "undici-types": ">=7.24.0 <7.24.7" } }, "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg=="],
-
     "@tensamin/ui/recharts": ["recharts@3.8.0", "", { "dependencies": { "@reduxjs/toolkit": "^1.9.0 || 2.x.x", "clsx": "^2.1.1", "decimal.js-light": "^2.5.1", "es-toolkit": "^1.39.3", "eventemitter3": "^5.0.1", "immer": "^10.1.1", "react-redux": "8.x.x || 9.x.x", "reselect": "5.1.1", "tiny-invariant": "^1.3.3", "use-sync-external-store": "^1.2.2", "victory-vendor": "^37.0.2" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" } }, "sha512-Z/m38DX3L73ExO4Tpc9/iZWHmHnlzWG4njQbxsF5aSjwqmHNDDIm0rdEBArkwsBvR8U6EirlEHiQNYWCVh9sGQ=="],
 
     "@tensamin/ui/shadcn": ["shadcn@3.8.5", "", { "dependencies": { "@antfu/ni": "^25.0.0", "@babel/core": "^7.28.0", "@babel/parser": "^7.28.0", "@babel/plugin-transform-typescript": "^7.28.0", "@babel/preset-typescript": "^7.27.1", "@dotenvx/dotenvx": "^1.48.4", "@modelcontextprotocol/sdk": "^1.26.0", "@types/validate-npm-package-name": "^4.0.2", "browserslist": "^4.26.2", "commander": "^14.0.0", "cosmiconfig": "^9.0.0", "dedent": "^1.6.0", "deepmerge": "^4.3.1", "diff": "^8.0.2", "execa": "^9.6.0", "fast-glob": "^3.3.3", "fs-extra": "^11.3.1", "fuzzysort": "^3.1.0", "https-proxy-agent": "^7.0.6", "kleur": "^4.1.5", "msw": "^2.10.4", "node-fetch": "^3.3.2", "open": "^11.0.0", "ora": "^8.2.0", "postcss": "^8.5.6", "postcss-selector-parser": "^7.1.0", "prompts": "^2.4.2", "recast": "^0.23.11", "stringify-object": "^5.0.0", "tailwind-merge": "^3.0.1", "ts-morph": "^26.0.0", "tsconfig-paths": "^4.2.0", "validate-npm-package-name": "^7.0.1", "zod": "^3.24.1", "zod-to-json-schema": "^3.24.6" }, "bin": { "shadcn": "dist/index.js" } }, "sha512-jPRx44e+eyeV7xwY3BLJXcfrks00+M0h5BGB9l6DdcBW4BpAj4x3lVmVy0TXPEs2iHEisxejr62sZAAw6B1EVA=="],
@@ -1724,8 +1721,6 @@
 
     "@modelcontextprotocol/sdk/ajv/json-schema-traverse": ["json-schema-traverse@1.0.0", "", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="],
 
-    "@tensamin/tauri/@types/node/undici-types": ["undici-types@7.24.6", "", {}, "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg=="],
-
     "@tensamin/ui/shadcn/zod": ["zod@3.25.76", "", {}, "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ=="],
 
     "ajv-formats/ajv/json-schema-traverse": ["json-schema-traverse@1.0.0", "", {}, "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="],

packages/call/src/components/sidebarBox.tsx

@@ -1,5 +1,5 @@
 import { Lock, LockOpen } from "lucide-react";
-import { openCallPage, useCall, getRoom } from "../store";
+import { openCallPage, useCall } from "../store";
 import {
   Button,
   Card,
@@ -78,7 +78,7 @@ function ConnectionBar() {
 }
 
 export function TinyPingGraph() {
-  const room = getRoom();
+  const room = useCall((store) => store.room);
 
   const [mapData, setMapData] = useState<Map<number, number>>(() => new Map());
 

packages/call/src/components/top.tsx

@@ -1,5 +1,5 @@
 import { useUser, type User } from "@tensamin/user/context";
-import { useCall, getRoom } from "../store";
+import { useCall } from "../store";
 import { useEffect, useState } from "react";
 import { useStorage } from "@tensamin/storage/context";
 import {
@@ -14,7 +14,7 @@ import {
 export default function TopBar() {
   const { get } = useUser();
   const { load } = useStorage();
-  const room = getRoom();
+  const room = useCall((state) => state.room);
   const screenRef = useCall((state) => state.screenRef);
   const [portalContainer, setPortalContainer] = useState<HTMLElement>();
 

packages/call/src/components/videoViewer.tsx

@@ -1,6 +1,6 @@
 import { VideoTrack, useParticipantTracks } from "@livekit/components-react";
 import { TrackPublication } from "livekit-client";
-import { getRoom } from "../store";
+import { useCall } from "../store";
 import { cn } from "@tensamin/ui";
 import { Loader2 } from "lucide-react";
 
@@ -17,7 +17,7 @@ export default function VideoViewer({
   publication: TrackPublication;
   participantId: string;
 }) {
-  const room = getRoom();
+  const room = useCall((state) => state.room);
   const tracks = useParticipantTracks([publication.source], {
     participantIdentity: participantId,
     room,

packages/call/src/store.tsx

@@ -101,46 +101,27 @@ type CallStore = {
   callIsPopout: boolean;
   layoutVersion: number;
   screenRef: React.RefObject<HTMLDivElement | null> | null;
+  room: Room;
+  keyProvider: ExternalE2EEKeyProvider;
+  e2eeWorker: Worker;
   runtime: Runtime | null;
   speakingParticipantIds: Set<number>;
   micGated: boolean;
 };
 
-let _keyProvider: ExternalE2EEKeyProvider | null = null;
+const keyProvider = new ExternalE2EEKeyProvider();
-let _e2eeWorker: Worker | null = null;
+const e2eeWorker = new Worker(
-let _room: Room | null = null;
-
-function getKeyProvider(): ExternalE2EEKeyProvider {
-  if (!_keyProvider) {
-    _keyProvider = new ExternalE2EEKeyProvider();
-  }
-  return _keyProvider;
-}
-
-function getE2EEWorker(): Worker {
-  if (!_e2eeWorker) {
-    _e2eeWorker = new Worker(
   new URL("livekit-client/e2ee-worker", import.meta.url),
-    );
+);
-  }
+const room = new Room({
-  return _e2eeWorker;
-}
-
-export function getRoom(): Room {
-  if (!_room) {
-    _room = new Room({
   dynacast: true,
   adaptiveStream: true,
   loggerName: "tensamin",
   encryption: {
-        keyProvider: getKeyProvider(),
+    keyProvider,
-        worker: getE2EEWorker(),
+    worker: e2eeWorker,
   },
-    });
+});
-  }
-  return _room;
-}
-
 const remoteAudioElements = new Map<string, HTMLMediaElement>();
 
 const SCREEN_SHARE_PREVIEW_MAX_WIDTH = 320;
@@ -189,7 +170,6 @@ export function getParticipantId(identity: string | undefined): number | null {
 }
 
 function getAllParticipants(): Participant[] {
-  const room = getRoom();
   return [...room.remoteParticipants.values(), room.localParticipant];
 }
 
@@ -207,7 +187,7 @@ function getTrackPublicationBySource(
 }
 
 function getRemoteParticipant(participantId: number) {
-  return [...getRoom().remoteParticipants.values()].find(
+  return [...room.remoteParticipants.values()].find(
     (participant) => getParticipantId(participant.identity) === participantId,
   );
 }
@@ -235,7 +215,7 @@ function syncRemoteParticipantTrackSubscriptions(participantId: number) {
 }
 
 function syncAllRemoteTrackSubscriptions() {
-  for (const participant of getRoom().remoteParticipants.values()) {
+  for (const participant of room.remoteParticipants.values()) {
     const participantId = getParticipantId(participant.identity);
 
     if (participantId != null) {
@@ -276,7 +256,7 @@ function hasParticipant(participantId: number) {
 
 function getLocalScreenShareTrack(): MediaStreamTrack | null {
   const track = getTrackPublicationBySource(
-    getRoom().localParticipant,
+    room.localParticipant,
     Track.Source.ScreenShare,
   )?.track;
 
@@ -295,7 +275,7 @@ async function updateLocalParticipantAttributes(
     screenSharePreviewLength: attributes.screenSharePreview?.length ?? 0,
   });
 
-  await getRoom().localParticipant.setAttributes(attributes).catch((error) => {
+  await room.localParticipant.setAttributes(attributes).catch((error) => {
     log(1, "call", "red", "Failed to update local participant attributes", {
       attributes: Object.keys(attributes),
       error,
@@ -507,7 +487,7 @@ function requireRuntime(runtime: Runtime | null): Runtime {
 }
 
 export function getRoomMetadata() {
-  const roomMetadata = getRoom().metadata;
+  const roomMetadata = room.metadata;
   try {
     const data = JSON.parse(roomMetadata || '{"admins": []}');
     return data as { admins: number[] };
@@ -518,8 +498,7 @@ export function getRoomMetadata() {
 
 // Sync local participant flags and screen-share derived state for the active call UI.
 export function syncParticipantState() {
-  const { screenShareSession } = useCall.getState();
+  const { room, screenShareSession } = useCall.getState();
-  const room = getRoom();
 
   useCall.setState({
     micEnabled: room.localParticipant.isMicrophoneEnabled,
@@ -742,7 +721,7 @@ let screenShareController: ReturnType<
 function getScreenShareController() {
   if (!screenShareController) {
     screenShareController = createScreenShareController({
-      room: getRoom(),
+      room,
       getState: () => ({
         screenShareSession: useCall.getState().screenShareSession,
       }),
@@ -754,7 +733,7 @@ function getScreenShareController() {
         );
       },
       getLocalParticipantId: () =>
-        getParticipantId(getRoom().localParticipant.identity),
+        getParticipantId(room.localParticipant.identity),
       startWatching: startWatchingStream,
       stopWatching: stopWatchingStream,
       syncParticipantState,
@@ -779,7 +758,7 @@ export async function connect(callId: string) {
     callSecret: useCall.getState().callSecret,
   });
 
-  await getRoom()
+  await room
     .connect("wss://call.tensamin.net", token, {
       autoSubscribe: false,
     })
@@ -795,7 +774,7 @@ export async function connect(callId: string) {
 
   syncAllRemoteTrackSubscriptions();
 
-  await getRoom().localParticipant.setMicrophoneEnabled(true).catch((error) => {
+  await room.localParticipant.setMicrophoneEnabled(true).catch((error) => {
     log(1, "call", "red", "Failed to enable microphone", error);
     toast("error", "Failed to enable microphone.");
     throw error;
@@ -840,12 +819,12 @@ export async function disconnect() {
     micGated: false,
   });
 
-  getRoom().remoteParticipants.forEach((participant) => {
+  room.remoteParticipants.forEach((participant) => {
     participant.setVolume(1);
   });
 
   try {
-    await getRoom().disconnect();
+    await room.disconnect();
   } catch (error) {
     log(1, "call", "red", "Failed to disconnect from room", error);
   } finally {
@@ -888,8 +867,8 @@ export async function joinCall(
         callSecret,
       );
 
-      await getKeyProvider().setKey(decryptedSecret);
+      await keyProvider.setKey(decryptedSecret);
-      await getRoom().setE2EEEnabled(true);
+      await room.setE2EEEnabled(true);
       useCall.setState({ callSecret: decryptedSecret });
     } catch (err) {
       log(1, "call", "red", "Failed getting call secret", err);
@@ -899,8 +878,8 @@ export async function joinCall(
   } else {
     const random = crypto.randomUUID();
 
-    await getKeyProvider().setKey(random);
+    await keyProvider.setKey(random);
-    await getRoom().setE2EEEnabled(true);
+    await room.setE2EEEnabled(true);
     useCall.setState({ callSecret: random });
   }
 
@@ -919,11 +898,11 @@ export async function joinCall(
 export async function toggleDeaf() {
   const nextDeaf = !useCall.getState().deaf;
 
-  getRoom().remoteParticipants.forEach((participant) => {
+  room.remoteParticipants.forEach((participant) => {
     participant.setVolume(nextDeaf ? 0 : 1);
   });
 
-  if (nextDeaf && getRoom().localParticipant.isMicrophoneEnabled) {
+  if (nextDeaf && room.localParticipant.isMicrophoneEnabled) {
     await toggleMute();
   }
 
@@ -943,7 +922,7 @@ export async function toggleMute() {
     await toggleDeaf();
   }
 
-  await getRoom().localParticipant.setMicrophoneEnabled(!micEnabled);
+  await room.localParticipant.setMicrophoneEnabled(!micEnabled);
   syncParticipantState();
 }
 
@@ -1007,7 +986,7 @@ export function resetCallState() {
 async function ensureNoiseFilter(
   noiseFilter: DeepFilterNoiseFilterProcessor,
 ): Promise<void> {
-  const microphoneTrack = getRoom().localParticipant.getTrackPublication(
+  const microphoneTrack = room.localParticipant.getTrackPublication(
     Track.Source.Microphone,
   )?.track;
 
@@ -1022,7 +1001,7 @@ async function ensureNoiseFilter(
     log(1, "call", "red", "Failed to enable noise filter", err);
   });
 
-  const participantId = getParticipantId(getRoom().localParticipant.identity);
+  const participantId = getParticipantId(room.localParticipant.identity);
   if (participantId != null) {
     const processedTrack = microphoneTrack.mediaStreamTrack;
     getSpeakingDetector().addTrack(
@@ -1042,8 +1021,8 @@ export const useCall = create<CallStore>(() => ({
   livekitToken: null,
   currentCallData: null,
   deaf: false,
-  micEnabled: false,
+  micEnabled: room.localParticipant.isMicrophoneEnabled,
-  screenShareEnabled: false,
+  screenShareEnabled: room.localParticipant.isScreenShareEnabled,
   screenShareSession: null,
   focusedParticipantId: null,
   focusedParticipantType: null,
@@ -1051,11 +1030,15 @@ export const useCall = create<CallStore>(() => ({
   watchedStreamParticipantIds: [],
   pendingWatchedParticipantIds: [],
   activeScreenShareParticipantIds: [],
-  isEncrypted: false,
+  isEncrypted:
+    room.localParticipant.isE2EEEnabled && room.localParticipant.isEncrypted,
   callIsFullscreen: false,
   callIsPopout: false,
   layoutVersion: 0,
   screenRef: null,
+  room,
+  keyProvider,
+  e2eeWorker,
   runtime: null,
   speakingParticipantIds: new Set(),
   micGated: false,
@@ -1401,7 +1384,6 @@ export function useInitializeCall() {
       syncParticipantState();
     };
 
-    const room = getRoom();
     room.on(RoomEvent.Connected, onConnected);
     room.on(RoomEvent.Reconnected, onConnected);
     room.on(RoomEvent.Disconnected, onDisconnected);
@@ -1442,7 +1424,7 @@ export function useInitializeCall() {
       clearRemoteAudio();
       listenersRegistered.current = false;
       room.disconnect();
-      if (_e2eeWorker) _e2eeWorker.terminate();
+      e2eeWorker.terminate();
     };
   }, [noiseFilter, load]);
 

packages/call/src/views/main/focused.tsx

@@ -1,13 +1,13 @@
 import { RoomEvent } from "livekit-client";
 import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { useCall, getRoom } from "../../store";
+import { useCall } from "../../store";
 import Base from "../../components/modals/base";
 
 const SECONDARY_ROW_HEIGHT_PX = 180;
 const STACK_GAP_PX = 12;
 
 export default function View() {
-  const room = getRoom();
+  const room = useCall((state) => state.room);
   const layoutVersion = useCall((state) => state.layoutVersion);
 
   const usersInFocusedViewHidden = useCall(

packages/call/src/views/main/grid.tsx

@@ -1,6 +1,6 @@
 import { RoomEvent } from "livekit-client";
 import { useEffect, useMemo, useRef, useState } from "react";
-import { useCall, getRoom } from "../../store";
+import { useCall } from "../../store";
 import Base from "../../components/modals/base";
 
 const TILE_ASPECT_RATIO = 16 / 9;
@@ -82,7 +82,7 @@ function calculateOptimalGridLayout(
 }
 
 export default function View() {
-  const room = getRoom();
+  const room = useCall((state) => state.room);
   const layoutVersion = useCall((state) => state.layoutVersion);
   const activeScreenShareParticipantIds = useCall(
     (state) => state.activeScreenShareParticipantIds,

packages/chat/src/components/message.tsx

@@ -3,72 +3,45 @@ import type { RawMessage } from "../values";
 import Text from "@tensamin/markdown/text";
 import { AlertTriangle } from "lucide-react";
 
-import {
+import { cn, Tooltip, TooltipContent, TooltipTrigger } from "@tensamin/ui";
-  Avatar,
+import { useIsMobile } from "@tensamin/ui";
-  AvatarFallback,
-  AvatarImage,
-  cn,
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger,
-} from "@tensamin/ui";
 import {
   ContextMenu,
   ContextMenuContent,
   ContextMenuItem,
   ContextMenuTrigger,
 } from "@tensamin/ui";
-import Wrapper from "@tensamin/user/wrapper";
-import { useChat } from "../context";
 
 function MessageComponent({
-  grouped,
   message,
 }: {
-  grouped: boolean;
   message: RawMessage & {
     failed?: boolean;
   };
 }) {
-  const { userId } = useChat();
+  const isMobile = useIsMobile();
   const actuallyFailed = message.failed && message.message_state === "awaiting";
 
   return (
     <div
-      className={`${grouped ? "" : "pt-3"} w-full flex justify-start transition-opacity duration-150 ${actuallyFailed || message.message_state === "awaiting" ? "opacity-50" : ""}`}
+      className={`w-full flex justify-start transition-opacity duration-150 ${actuallyFailed || message.message_state === "awaiting" ? "opacity-50" : ""}`}
     >
       <ContextMenu>
         <ContextMenuTrigger
           render={
             <div
               className={cn(
-                "group hover:bg-muted/50 select-text! justify-start flex gap-1 items-center w-full px-2 whitespace-pre-wrap break-all",
+                "selection-foreground flex gap-1 items-center justify-center max-w-[80%] rounded-lg px-2 py-px whitespace-pre-wrap break-all",
                 {
-                  "bg-(--destructive)/15 text-destructive-foreground":
+                  "bg-(--destructive)/75 text-destructive-foreground":
                     actuallyFailed,
+                  "bg-primary text-primary-foreground":
+                    !actuallyFailed && message.sent_by_self,
+                  "bg-muted": !message.sent_by_self,
+                  "select-none": isMobile,
                 },
               )}
             >
-              <Wrapper
-                loading={"State not achievable"}
-                userId={message.sent_by_self ? "own" : userId}
-                component={(user) => (
-                  <>
-                    {grouped ? (
-                      <p className="w-9 text-xs group-hover:visible invisible text-muted-foreground">
-                        {new Date(message.send_time).toLocaleString([], {
-                          hour: "2-digit",
-                          minute: "2-digit",
-                        })}
-                      </p>
-                    ) : (
-                      <Avatar className="mr-1 mb-auto mt-1 w-10">
-                        <AvatarImage src={user.avatar} />
-                        <AvatarFallback>
-                          {user.display.slice(0, 2).toUpperCase()}
-                        </AvatarFallback>
-                      </Avatar>
-                    )}
               {message.failed && message.message_state === "awaiting" && (
                 <Tooltip>
                   <TooltipContent>
@@ -77,24 +50,8 @@ function MessageComponent({
                   <TooltipTrigger render={<AlertTriangle size={17} />} />
                 </Tooltip>
               )}
-                    <div className="flex flex-col">
-                      {!grouped && (
-                        <div className="flex items-center gap-1">
-                          <p className="font-medium">{user.display}</p>
-                          <p className="text-xs text-muted-foreground">
-                            {new Date(message.send_time).toLocaleString([], {
-                              hour: "2-digit",
-                              minute: "2-digit",
-                            })}
-                          </p>
-                        </div>
-                      )}
               <Text value={message.content} />
             </div>
-                  </>
-                )}
-              />
-            </div>
           }
         />
         <ContextMenuContent>

packages/chat/src/screen.tsx

@@ -435,7 +435,7 @@ export default function Screen() {
       <div
         ref={scrollRef}
         id="chat_container"
-        className="min-h-0 flex-1 overflow-y-auto"
+        className="min-h-0 flex-1 overflow-y-auto px-2.5"
         style={{
           overflowAnchor: "none",
           paddingBottom: "8px",
@@ -465,8 +465,8 @@ export default function Screen() {
                   }}
                 >
                   <div className="w-full flex justify-start">
-                    <div className="text-sm text-foreground/55 px-2.5">
+                    <div className="max-w-[80%] rounded-lg bg-muted px-2 py-px text-sm text-foreground/55 whitespace-pre-wrap break-all">
-                      Conversation start
+                      This is the start of your conversation with{" "}
                     </div>
                   </div>
                 </div>
@@ -481,13 +481,6 @@ export default function Screen() {
               return null;
             }
 
-            const lastMessage = messages[messageIndex - 1];
-            const isGrouped =
-              lastMessage &&
-              lastMessage.sent_by_self === message.sent_by_self &&
-              Math.round(lastMessage.send_time / 10000) ===
-                Math.round(message.send_time / 10000);
-
             return (
               <div
                 key={message.send_time}
@@ -499,9 +492,10 @@ export default function Screen() {
                   left: 0,
                   width: "100%",
                   transform: `translateY(${virtualRow.start + verticalOffset}px)`,
+                  padding: "4px 0",
                 }}
               >
-                <Message grouped={isGrouped} message={message} />
+                <Message message={message} />
               </div>
             );
           })}
@@ -515,25 +509,17 @@ export default function Screen() {
         className="pointer-events-none absolute left-0 top-0 -z-10 overflow-hidden opacity-0"
         style={{ width: scrollWidth > 0 ? `${scrollWidth}px` : "100%" }}
       >
-        {messages.map((message, messageIndex) => {
+        {messages.map((message) => (
-          const lastMessage = messages[messageIndex - 1];
-          const isGrouped =
-            lastMessage &&
-            lastMessage.sent_by_self === message.sent_by_self &&
-            Math.round(lastMessage.send_time / 10000) ===
-              Math.round(message.send_time / 10000);
-
-          return (
           <div
             key={`measure-${message.send_time}`}
             ref={(element) => {
               setMeasurementRef(message.send_time, element);
             }}
+            style={{ padding: "4px 0" }}
           >
-              <Message grouped={isGrouped} message={message} />
+            <Message message={message} />
           </div>
-          );
+        ))}
-        })}
       </div>
     </div>
   );

packages/markdown/src/markdown.tsx

@@ -560,7 +560,7 @@ export function renderBlocks(blocks: MarkdownBlock[]): React.ReactElement {
         }
 
         return (
-          <p key={blockIndex}>
+          <p key={blockIndex} className="tm-md-p">
             {block.text.split("\n").map((line, lineIndex) => (
               <React.Fragment key={lineIndex}>
                 {lineIndex > 0 ? <br /> : null}
@@ -645,6 +645,7 @@ export const markdownStyles = `
 .tm-md-h4 { font-size: 1.1rem; }
 .tm-md-h5 { font-size: 1rem; }
 .tm-md-h6 { font-size: 0.95rem; opacity: 0.9; }
+.tm-md-p { margin: 0.25rem 0; }
 .tm-md-blockquote { margin: 0.45rem 0; padding-left: 0.75rem; opacity: 0.95; }
 .tm-md-blockquote p { margin: 0.2rem 0; }
 .tm-md-pre { margin: 0.45rem 0; padding: 0.65rem 0.75rem; border-radius: 0.5rem; background: hsl(var(--muted)); overflow-x: auto; }

packages/ttp/src/context.tsx

@@ -191,7 +191,6 @@ export function Provider(props: {
     typeof createTransportClient<Schemas>
   > | null>(null);
   const identificationStartedRef = useRef(false);
-  const identificationCancelRef = useRef(false);
 
   // Load ttp url
   const [ttpUrl, setTtpUrl] = useState<string | null>(null);
@@ -243,23 +242,6 @@ export function Provider(props: {
     return client.subscribePush(handler);
   }, []);
 
-  // Check for error_no_iota
-  useEffect(() => {
-    if (!connected) return;
-
-    return subscribePush((message) => {
-      if (message.type !== "error_no_iota") return;
-
-      identificationCancelRef.current = true;
-      setIdentified(false);
-      setIdentifying(false);
-      setError("We couldn't reach your Iota");
-      setErrorDescription(
-        "You could try to restart your Iota, check for updates or check your network connection.",
-      );
-    })
-  }, [connected, subscribePush]);
-
   useEffect(() => {
     if (!connected || !identified) {
       return;
@@ -381,7 +363,6 @@ export function Provider(props: {
               clearReconnectTimer();
               scheduleReconnectReset();
               identificationStartedRef.current = false;
-              identificationCancelRef.current = false;
               setConnected(true);
               setIdentified(false);
               setError("");
@@ -502,11 +483,6 @@ export function Provider(props: {
       return;
     }
 
-    if (identificationCancelRef.current) {
-      identificationStartedRef.current = false;
-      return;
-    }
-
     if (identificationStartedRef.current) {
       return;
     }
@@ -575,12 +551,10 @@ export function Provider(props: {
         const finalResponse = await send("challenge_response", {
           challenge: decryptedChallenge,
         }).catch((error) => {
-          if (!identificationCancelRef.current) {
           setError("Identification Failed");
           setErrorDescription(
             "Unable to complete secure identification. Please verify your credentials and try again.",
           );
-          }
           throw error;
         });
 
@@ -588,7 +562,7 @@ export function Provider(props: {
         setFreshContacts(finalResponse.data.contacts);
         setFreshCommunities(finalResponse.data.communities);
         setFreshCalls(finalResponse.data.calls);
-        if (cancelled || identificationCancelRef.current) {
+        if (cancelled) {
           return;
         }
 
@@ -600,10 +574,6 @@ export function Provider(props: {
           return;
         }
 
-        if (identificationCancelRef.current) {
-          return;
-        }
-
         if (isStopSendingError(identificationError)) {
           setError("Connection closed");
           setErrorDescription(
@@ -634,7 +604,7 @@ export function Provider(props: {
             : "Unable to complete secure identification because the transport request failed.",
         );
       } finally {
-        if (!cancelled && !identificationCancelRef.current) {
+        if (!cancelled) {
           setIdentifying(false);
         }
       }