(
- {user?.display}
+
)}
loading={}
/>
diff --git a/apps/web/src/components/screens/login/form.tsx b/apps/web/src/components/screens/login/form.tsx
index ff76307..c66d5e6 100644
--- a/apps/web/src/components/screens/login/form.tsx
+++ b/apps/web/src/components/screens/login/form.tsx
@@ -190,11 +190,9 @@ export default function Form() {
[save],
);
- const isTauriEnv = isTauri();
-
return (
- {isTauriEnv ? (
+ {isTauri() ? (
<>
{
diff --git a/apps/web/src/index.css b/apps/web/src/index.css
index d243481..7d7bc56 100644
--- a/apps/web/src/index.css
+++ b/apps/web/src/index.css
@@ -17,3 +17,32 @@ body,
#root {
min-height: 0;
}
+
+@layer base {
+ * {
+ scrollbar-width: thin;
+ scrollbar-color: var(--border) transparent;
+ }
+
+ ::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+ }
+
+ ::-webkit-scrollbar-track {
+ background: transparent;
+ }
+
+ ::-webkit-scrollbar-thumb {
+ background-color: var(--border);
+ border-radius: 9999px;
+ }
+
+ ::-webkit-scrollbar-thumb:hover {
+ opacity: 0.8;
+ }
+
+ ::-webkit-scrollbar-corner {
+ background: transparent;
+ }
+}
diff --git a/apps/web/src/routes/settings/security.tsx b/apps/web/src/routes/settings/security.tsx
index 15a6155..86c580e 100644
--- a/apps/web/src/routes/settings/security.tsx
+++ b/apps/web/src/routes/settings/security.tsx
@@ -46,6 +46,7 @@ function QrCodeLogin() {
const [qrCodeBase64, setQrCodeBase64] = useState(
undefined,
);
+ const [connectionString, setConnectionString] = useState(null);
useEffect(() => {
load("private_key").then((value) => {
@@ -58,15 +59,25 @@ 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) {
- generateQR(`tensamin://tu::${userId}::${privateKey}`).then(
- setQrCodeBase64,
- );
+ if (userId && privateKey && connectionString !== null) {
+ generateQR(
+ `tensamin://tu::${userId}${connectionString}::${privateKey}`,
+ ).then(setQrCodeBase64);
}
- }, [userId, privateKey]);
+ }, [userId, privateKey, connectionString]);
const [qrCodeVisible, setQrCodeVisible] = useState(false);
diff --git a/bun.lock b/bun.lock
index ff51499..a15bdbe 100644
--- a/bun.lock
+++ b/bun.lock
@@ -40,6 +40,7 @@
},
"devDependencies": {
"@tauri-apps/cli": "^2",
+ "@types/node": "^25.9.1",
},
},
"apps/web": {
@@ -1661,6 +1662,8 @@
"@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=="],
@@ -1721,6 +1724,8 @@
"@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=="],
diff --git a/package.json b/package.json
index b0dfc08..d408353 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "tensamin",
- "version": "0.0.2",
+ "version": "0.0.3",
"private": true,
"workspaces": [
"packages/*",
diff --git a/packages/call/src/components/sidebarBox.tsx b/packages/call/src/components/sidebarBox.tsx
index 6a850f0..ac715e9 100644
--- a/packages/call/src/components/sidebarBox.tsx
+++ b/packages/call/src/components/sidebarBox.tsx
@@ -1,5 +1,5 @@
import { Lock, LockOpen } from "lucide-react";
-import { openCallPage, useCall } from "../store";
+import { openCallPage, useCall, getRoom } from "../store";
import {
Button,
Card,
@@ -78,7 +78,7 @@ function ConnectionBar() {
}
export function TinyPingGraph() {
- const room = useCall((store) => store.room);
+ const room = getRoom();
const [mapData, setMapData] = useState>(() => new Map());
diff --git a/packages/call/src/components/top.tsx b/packages/call/src/components/top.tsx
index 62e8bfc..610493a 100644
--- a/packages/call/src/components/top.tsx
+++ b/packages/call/src/components/top.tsx
@@ -1,5 +1,5 @@
import { useUser, type User } from "@tensamin/user/context";
-import { useCall } from "../store";
+import { useCall, getRoom } 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 = useCall((state) => state.room);
+ const room = getRoom();
const screenRef = useCall((state) => state.screenRef);
const [portalContainer, setPortalContainer] = useState();
diff --git a/packages/call/src/components/videoViewer.tsx b/packages/call/src/components/videoViewer.tsx
index 40cf6ac..1268b22 100644
--- a/packages/call/src/components/videoViewer.tsx
+++ b/packages/call/src/components/videoViewer.tsx
@@ -1,6 +1,6 @@
import { VideoTrack, useParticipantTracks } from "@livekit/components-react";
import { TrackPublication } from "livekit-client";
-import { useCall } from "../store";
+import { getRoom } 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 = useCall((state) => state.room);
+ const room = getRoom();
const tracks = useParticipantTracks([publication.source], {
participantIdentity: participantId,
room,
diff --git a/packages/call/src/store.tsx b/packages/call/src/store.tsx
index 3d63963..5b49603 100644
--- a/packages/call/src/store.tsx
+++ b/packages/call/src/store.tsx
@@ -101,27 +101,46 @@ type CallStore = {
callIsPopout: boolean;
layoutVersion: number;
screenRef: React.RefObject | null;
- room: Room;
- keyProvider: ExternalE2EEKeyProvider;
- e2eeWorker: Worker;
runtime: Runtime | null;
speakingParticipantIds: Set;
micGated: boolean;
};
-const keyProvider = new ExternalE2EEKeyProvider();
-const e2eeWorker = new Worker(
- new URL("livekit-client/e2ee-worker", import.meta.url),
-);
-const room = new Room({
- dynacast: true,
- adaptiveStream: true,
- loggerName: "tensamin",
- encryption: {
- keyProvider,
- worker: e2eeWorker,
- },
-});
+let _keyProvider: ExternalE2EEKeyProvider | null = null;
+let _e2eeWorker: Worker | null = null;
+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),
+ );
+ }
+ return _e2eeWorker;
+}
+
+export function getRoom(): Room {
+ if (!_room) {
+ _room = new Room({
+ dynacast: true,
+ adaptiveStream: true,
+ loggerName: "tensamin",
+ encryption: {
+ keyProvider: getKeyProvider(),
+ worker: getE2EEWorker(),
+ },
+ });
+ }
+ return _room;
+}
+
const remoteAudioElements = new Map();
const SCREEN_SHARE_PREVIEW_MAX_WIDTH = 320;
@@ -170,6 +189,7 @@ export function getParticipantId(identity: string | undefined): number | null {
}
function getAllParticipants(): Participant[] {
+ const room = getRoom();
return [...room.remoteParticipants.values(), room.localParticipant];
}
@@ -187,7 +207,7 @@ function getTrackPublicationBySource(
}
function getRemoteParticipant(participantId: number) {
- return [...room.remoteParticipants.values()].find(
+ return [...getRoom().remoteParticipants.values()].find(
(participant) => getParticipantId(participant.identity) === participantId,
);
}
@@ -215,7 +235,7 @@ function syncRemoteParticipantTrackSubscriptions(participantId: number) {
}
function syncAllRemoteTrackSubscriptions() {
- for (const participant of room.remoteParticipants.values()) {
+ for (const participant of getRoom().remoteParticipants.values()) {
const participantId = getParticipantId(participant.identity);
if (participantId != null) {
@@ -256,7 +276,7 @@ function hasParticipant(participantId: number) {
function getLocalScreenShareTrack(): MediaStreamTrack | null {
const track = getTrackPublicationBySource(
- room.localParticipant,
+ getRoom().localParticipant,
Track.Source.ScreenShare,
)?.track;
@@ -275,7 +295,7 @@ async function updateLocalParticipantAttributes(
screenSharePreviewLength: attributes.screenSharePreview?.length ?? 0,
});
- await room.localParticipant.setAttributes(attributes).catch((error) => {
+ await getRoom().localParticipant.setAttributes(attributes).catch((error) => {
log(1, "call", "red", "Failed to update local participant attributes", {
attributes: Object.keys(attributes),
error,
@@ -487,7 +507,7 @@ function requireRuntime(runtime: Runtime | null): Runtime {
}
export function getRoomMetadata() {
- const roomMetadata = room.metadata;
+ const roomMetadata = getRoom().metadata;
try {
const data = JSON.parse(roomMetadata || '{"admins": []}');
return data as { admins: number[] };
@@ -498,7 +518,8 @@ export function getRoomMetadata() {
// Sync local participant flags and screen-share derived state for the active call UI.
export function syncParticipantState() {
- const { room, screenShareSession } = useCall.getState();
+ const { screenShareSession } = useCall.getState();
+ const room = getRoom();
useCall.setState({
micEnabled: room.localParticipant.isMicrophoneEnabled,
@@ -721,7 +742,7 @@ let screenShareController: ReturnType<
function getScreenShareController() {
if (!screenShareController) {
screenShareController = createScreenShareController({
- room,
+ room: getRoom(),
getState: () => ({
screenShareSession: useCall.getState().screenShareSession,
}),
@@ -733,7 +754,7 @@ function getScreenShareController() {
);
},
getLocalParticipantId: () =>
- getParticipantId(room.localParticipant.identity),
+ getParticipantId(getRoom().localParticipant.identity),
startWatching: startWatchingStream,
stopWatching: stopWatchingStream,
syncParticipantState,
@@ -758,7 +779,7 @@ export async function connect(callId: string) {
callSecret: useCall.getState().callSecret,
});
- await room
+ await getRoom()
.connect("wss://call.tensamin.net", token, {
autoSubscribe: false,
})
@@ -774,7 +795,7 @@ export async function connect(callId: string) {
syncAllRemoteTrackSubscriptions();
- await room.localParticipant.setMicrophoneEnabled(true).catch((error) => {
+ await getRoom().localParticipant.setMicrophoneEnabled(true).catch((error) => {
log(1, "call", "red", "Failed to enable microphone", error);
toast("error", "Failed to enable microphone.");
throw error;
@@ -819,12 +840,12 @@ export async function disconnect() {
micGated: false,
});
- room.remoteParticipants.forEach((participant) => {
+ getRoom().remoteParticipants.forEach((participant) => {
participant.setVolume(1);
});
try {
- await room.disconnect();
+ await getRoom().disconnect();
} catch (error) {
log(1, "call", "red", "Failed to disconnect from room", error);
} finally {
@@ -867,8 +888,8 @@ export async function joinCall(
callSecret,
);
- await keyProvider.setKey(decryptedSecret);
- await room.setE2EEEnabled(true);
+ await getKeyProvider().setKey(decryptedSecret);
+ await getRoom().setE2EEEnabled(true);
useCall.setState({ callSecret: decryptedSecret });
} catch (err) {
log(1, "call", "red", "Failed getting call secret", err);
@@ -878,8 +899,8 @@ export async function joinCall(
} else {
const random = crypto.randomUUID();
- await keyProvider.setKey(random);
- await room.setE2EEEnabled(true);
+ await getKeyProvider().setKey(random);
+ await getRoom().setE2EEEnabled(true);
useCall.setState({ callSecret: random });
}
@@ -898,11 +919,11 @@ export async function joinCall(
export async function toggleDeaf() {
const nextDeaf = !useCall.getState().deaf;
- room.remoteParticipants.forEach((participant) => {
+ getRoom().remoteParticipants.forEach((participant) => {
participant.setVolume(nextDeaf ? 0 : 1);
});
- if (nextDeaf && room.localParticipant.isMicrophoneEnabled) {
+ if (nextDeaf && getRoom().localParticipant.isMicrophoneEnabled) {
await toggleMute();
}
@@ -922,7 +943,7 @@ export async function toggleMute() {
await toggleDeaf();
}
- await room.localParticipant.setMicrophoneEnabled(!micEnabled);
+ await getRoom().localParticipant.setMicrophoneEnabled(!micEnabled);
syncParticipantState();
}
@@ -986,7 +1007,7 @@ export function resetCallState() {
async function ensureNoiseFilter(
noiseFilter: DeepFilterNoiseFilterProcessor,
): Promise {
- const microphoneTrack = room.localParticipant.getTrackPublication(
+ const microphoneTrack = getRoom().localParticipant.getTrackPublication(
Track.Source.Microphone,
)?.track;
@@ -1001,7 +1022,7 @@ async function ensureNoiseFilter(
log(1, "call", "red", "Failed to enable noise filter", err);
});
- const participantId = getParticipantId(room.localParticipant.identity);
+ const participantId = getParticipantId(getRoom().localParticipant.identity);
if (participantId != null) {
const processedTrack = microphoneTrack.mediaStreamTrack;
getSpeakingDetector().addTrack(
@@ -1021,8 +1042,8 @@ export const useCall = create(() => ({
livekitToken: null,
currentCallData: null,
deaf: false,
- micEnabled: room.localParticipant.isMicrophoneEnabled,
- screenShareEnabled: room.localParticipant.isScreenShareEnabled,
+ micEnabled: false,
+ screenShareEnabled: false,
screenShareSession: null,
focusedParticipantId: null,
focusedParticipantType: null,
@@ -1030,15 +1051,11 @@ export const useCall = create(() => ({
watchedStreamParticipantIds: [],
pendingWatchedParticipantIds: [],
activeScreenShareParticipantIds: [],
- isEncrypted:
- room.localParticipant.isE2EEEnabled && room.localParticipant.isEncrypted,
+ isEncrypted: false,
callIsFullscreen: false,
callIsPopout: false,
layoutVersion: 0,
screenRef: null,
- room,
- keyProvider,
- e2eeWorker,
runtime: null,
speakingParticipantIds: new Set(),
micGated: false,
@@ -1384,6 +1401,7 @@ export function useInitializeCall() {
syncParticipantState();
};
+ const room = getRoom();
room.on(RoomEvent.Connected, onConnected);
room.on(RoomEvent.Reconnected, onConnected);
room.on(RoomEvent.Disconnected, onDisconnected);
@@ -1424,7 +1442,7 @@ export function useInitializeCall() {
clearRemoteAudio();
listenersRegistered.current = false;
room.disconnect();
- e2eeWorker.terminate();
+ if (_e2eeWorker) _e2eeWorker.terminate();
};
}, [noiseFilter, load]);
diff --git a/packages/call/src/views/main/focused.tsx b/packages/call/src/views/main/focused.tsx
index 78d1740..f8239c5 100644
--- a/packages/call/src/views/main/focused.tsx
+++ b/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 } from "../../store";
+import { useCall, getRoom } 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 = useCall((state) => state.room);
+ const room = getRoom();
const layoutVersion = useCall((state) => state.layoutVersion);
const usersInFocusedViewHidden = useCall(
diff --git a/packages/call/src/views/main/grid.tsx b/packages/call/src/views/main/grid.tsx
index 833d7b5..956842d 100644
--- a/packages/call/src/views/main/grid.tsx
+++ b/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 } from "../../store";
+import { useCall, getRoom } 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 = useCall((state) => state.room);
+ const room = getRoom();
const layoutVersion = useCall((state) => state.layoutVersion);
const activeScreenShareParticipantIds = useCall(
(state) => state.activeScreenShareParticipantIds,
diff --git a/packages/chat/src/components/message.tsx b/packages/chat/src/components/message.tsx
index e85d890..1bb0b43 100644
--- a/packages/chat/src/components/message.tsx
+++ b/packages/chat/src/components/message.tsx
@@ -3,54 +3,97 @@ import type { RawMessage } from "../values";
import Text from "@tensamin/markdown/text";
import { AlertTriangle } from "lucide-react";
-import { cn, Tooltip, TooltipContent, TooltipTrigger } from "@tensamin/ui";
-import { useIsMobile } from "@tensamin/ui";
+import {
+ Avatar,
+ 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 isMobile = useIsMobile();
+ const { userId } = useChat();
const actuallyFailed = message.failed && message.message_state === "awaiting";
return (
- {message.failed && message.message_state === "awaiting" && (
-
-
- Failed to send message
-
- } />
-
- )}
-
+ (
+ <>
+ {grouped ? (
+
+ {new Date(message.send_time).toLocaleString([], {
+ hour: "2-digit",
+ minute: "2-digit",
+ })}
+
+ ) : (
+
+
+
+ {user.display.slice(0, 2).toUpperCase()}
+
+
+ )}
+ {message.failed && message.message_state === "awaiting" && (
+
+
+ Failed to send message
+
+ } />
+
+ )}
+
+ {!grouped && (
+
+
{user.display}
+
+ {new Date(message.send_time).toLocaleString([], {
+ hour: "2-digit",
+ minute: "2-digit",
+ })}
+
+
+ )}
+
+
}
/>
diff --git a/packages/chat/src/screen.tsx b/packages/chat/src/screen.tsx
index a23760d..fe69542 100644
--- a/packages/chat/src/screen.tsx
+++ b/packages/chat/src/screen.tsx
@@ -435,7 +435,7 @@ export default function Screen() {
-
- This is the start of your conversation with{" "}
+
+ Conversation start
@@ -481,6 +481,13 @@ 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 (
-
+
);
})}
@@ -509,17 +515,25 @@ 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) => (
-
{
- setMeasurementRef(message.send_time, element);
- }}
- style={{ padding: "4px 0" }}
- >
-
-
- ))}
+ {messages.map((message, messageIndex) => {
+ 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 (
+
{
+ setMeasurementRef(message.send_time, element);
+ }}
+ >
+
+
+ );
+ })}
+
{block.text.split("\n").map((line, lineIndex) => (
{lineIndex > 0 ?
: null}
@@ -645,7 +645,6 @@ 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; }
diff --git a/packages/ttp/src/context.tsx b/packages/ttp/src/context.tsx
index 0a2ea2c..2f8fc40 100644
--- a/packages/ttp/src/context.tsx
+++ b/packages/ttp/src/context.tsx
@@ -191,6 +191,7 @@ export function Provider(props: {
typeof createTransportClient
> | null>(null);
const identificationStartedRef = useRef(false);
+ const identificationCancelRef = useRef(false);
// Load ttp url
const [ttpUrl, setTtpUrl] = useState(null);
@@ -242,6 +243,23 @@ 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;
@@ -363,6 +381,7 @@ export function Provider(props: {
clearReconnectTimer();
scheduleReconnectReset();
identificationStartedRef.current = false;
+ identificationCancelRef.current = false;
setConnected(true);
setIdentified(false);
setError("");
@@ -483,6 +502,11 @@ export function Provider(props: {
return;
}
+ if (identificationCancelRef.current) {
+ identificationStartedRef.current = false;
+ return;
+ }
+
if (identificationStartedRef.current) {
return;
}
@@ -551,10 +575,12 @@ export function Provider(props: {
const finalResponse = await send("challenge_response", {
challenge: decryptedChallenge,
}).catch((error) => {
- setError("Identification Failed");
- setErrorDescription(
- "Unable to complete secure identification. Please verify your credentials and try again.",
- );
+ if (!identificationCancelRef.current) {
+ setError("Identification Failed");
+ setErrorDescription(
+ "Unable to complete secure identification. Please verify your credentials and try again.",
+ );
+ }
throw error;
});
@@ -562,7 +588,7 @@ export function Provider(props: {
setFreshContacts(finalResponse.data.contacts);
setFreshCommunities(finalResponse.data.communities);
setFreshCalls(finalResponse.data.calls);
- if (cancelled) {
+ if (cancelled || identificationCancelRef.current) {
return;
}
@@ -574,6 +600,10 @@ export function Provider(props: {
return;
}
+ if (identificationCancelRef.current) {
+ return;
+ }
+
if (isStopSendingError(identificationError)) {
setError("Connection closed");
setErrorDescription(
@@ -604,7 +634,7 @@ export function Provider(props: {
: "Unable to complete secure identification because the transport request failed.",
);
} finally {
- if (!cancelled) {
+ if (!cancelled && !identificationCancelRef.current) {
setIdentifying(false);
}
}