Skip to content

ECHO-571 pre release changes and fixes #371

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
spashii merged 6 commits into from
Nov 26, 2025
Merged

ECHO-571 pre release changes and fixes #371

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
baa0e70
- Updated styles for `ConversationAccordion`, `ConversationEdit`, and…
ussaama Nov 26, 2025
b34d6b2
- minor changes
ussaama Nov 26, 2025
876fb44
- text change
ussaama Nov 26, 2025
2cb32b4
- text changes
ussaama Nov 26, 2025
4d3736f
-minor updates
ussaama Nov 26, 2025
2b885ce
- text fix
ussaama Nov 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion echo/frontend/src/components/chat/TemplatesModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,7 @@ export const TemplatesModal = ({

<Group className="mt-3 border-t pt-3">
<Text size="sm" c="dimmed">
<Trans>Want to add a template to ECHO?</Trans>{" "}
<Trans>Want to add a template to "Dembrane"?</Trans>{" "}
<Anchor
href="https://dembrane.notion.site/Prompt-Bibliotheek-2249cd84270580138d45f0be7a4b4899?source=copy_link "
target="_blank"
Expand Down
10 changes: 9 additions & 1 deletion echo/frontend/src/components/conversation/ConversationAccordion.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -452,7 +452,12 @@ const ConversationProjectTagPill = ({
}

return (
<Pill size="sm" className="font-normal">
<Pill
size="sm"
classNames={{
root: "!bg-[var(--mantine-primary-color-light)] !font-medium",
}}
>
{text}
</Pill>
);
Expand Down Expand Up @@ -1066,6 +1071,9 @@ export const ConversationAccordion = ({
key={tagId}
size="sm"
withRemoveButton
classNames={{
root: "!bg-[var(--mantine-primary-color-light)] !font-medium",
}}
onRemove={() =>
setSelectedTagIds((prev) =>
prev.filter((id) => id !== tagId),
Expand Down
3 changes: 3 additions & 0 deletions echo/frontend/src/components/conversation/ConversationEdit.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,6 +140,9 @@ export const ConversationEdit = ({
isDirty={!!formState.dirtyFields.tagIdList}
/>
}
classNames={{
pill: "!bg-[var(--mantine-primary-color-light)] text-black font-medium",
}}
data={projectTags
.filter((tag) => tag && tag.id != null && tag.text != null)
.map((tag) => ({
Expand Down
2 changes: 1 addition & 1 deletion echo/frontend/src/components/conversation/MoveConversationButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -129,7 +129,7 @@ export const MoveConversationButton = ({
>
<Group>
<Badge>
<Trans>Experimental</Trans>
<Trans>Beta</Trans>
</Badge>
<Trans>Move to Another Project</Trans>
</Group>
Expand Down
2 changes: 1 addition & 1 deletion echo/frontend/src/components/conversation/RetranscribeConversation.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ export const RetranscribeConversationModal = ({
<Group gap="xs">
<Text>{t`Retranscribe Conversation`}</Text>
<Badge color="blue" size="sm">
<Trans>Experimental</Trans>
<Trans>Beta</Trans>
</Badge>
</Group>
}
Expand Down
35 changes: 32 additions & 3 deletions echo/frontend/src/components/conversation/VerifiedArtefactsSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,13 @@ import { IconRosetteDiscountCheckFilled } from "@tabler/icons-react";
import { useQuery } from "@tanstack/react-query";
import { format } from "date-fns";
import { Markdown } from "@/components/common/Markdown";
import { useVerificationTopics } from "@/components/participant/verify/hooks";
import { getVerificationArtefacts } from "@/lib/api";

type VerifiedArtefactsSectionProps = {
conversationId: string;
projectId: string;
projectLanguage?: string | null;
};

const formatArtefactTime = (timestamp: string | null | undefined): string => {
Expand All @@ -29,8 +32,18 @@ const formatArtefactTime = (timestamp: string | null | undefined): string => {
}
};

const LANGUAGE_TO_LOCALE: Record<string, string> = {
de: "de-DE",
en: "en-US",
es: "es-ES",
fr: "fr-FR",
nl: "nl-NL",
};
Comment on lines +35 to +41
Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai bot Nov 26, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick | 🔵 Trivial

Same DRY note as ProjectPortalEditor — LANGUAGE_TO_LOCALE is duplicated.

See earlier comment. Extract to shared util when you get a chance.

🤖 Prompt for AI Agents 
In echo/frontend/src/components/conversation/VerifiedArtefactsSection.tsx around
lines 35 to 41, the LANGUAGE_TO_LOCALE mapping is duplicated elsewhere (see
ProjectPortalEditor); extract this constant into a shared util (e.g.,
echo/frontend/src/utils/locale.ts), export it with the same
Record<string,string> typing, replace the local declaration with an import from
that util in VerifiedArtefactsSection.tsx (and update the other file to import
the same util), and remove the duplicate local definitions; ensure any existing
imports/exports compile and run tests/lint to validate.


export const VerifiedArtefactsSection = ({
conversationId,
projectId,
projectLanguage,
}: VerifiedArtefactsSectionProps) => {
// Fetch all artefacts with content for display
const { data: artefacts, isLoading } = useQuery({
Expand All @@ -39,6 +52,20 @@ export const VerifiedArtefactsSection = ({
queryKey: ["verify", "conversation_artifacts", conversationId],
});

const topicsQuery = useVerificationTopics(projectId);
const locale =
LANGUAGE_TO_LOCALE[projectLanguage ?? "en"] ?? LANGUAGE_TO_LOCALE.en;

const availableTopics = topicsQuery.data?.available_topics ?? [];
const topicLabelMap = new Map(
availableTopics.map((topic) => [
topic.key,
topic.translations?.[locale]?.label ??
topic.translations?.["en-US"]?.label ??
topic.key,
]),
);

if (isLoading) {
return (
<Stack gap="sm">
Expand All @@ -57,12 +84,12 @@ export const VerifiedArtefactsSection = ({
<Stack gap="1.5rem">
<Group>
<Title order={2}>
<Trans>Verified Artefacts</Trans>
<Trans>Artefacts</Trans>
</Title>
<ActionIcon
variant="subtle"
color="blue"
aria-label={t`verified artefact`}
aria-label={t`artefacts`}
size={22}
>
<IconRosetteDiscountCheckFilled />
Expand All @@ -78,7 +105,9 @@ export const VerifiedArtefactsSection = ({
<Accordion.Control>
<Group gap="sm" wrap="nowrap">
<Stack gap={2}>
<Text fw={500}>{artefact.key || ""}</Text>
<Text fw={500}>
{topicLabelMap.get(artefact.key) ?? artefact.key ?? ""}
</Text>
{formattedDate && (
<Text size="xs" c="dimmed">
<Trans id="conversation.verified.approved">
Expand Down
2 changes: 1 addition & 1 deletion echo/frontend/src/components/dropzone/UploadConversationDropzone.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -789,7 +789,7 @@ export const UploadConversationDropzone = (
<Alert
icon={<IconCircleCheck size={16} />}
title={t`Success`}
color="green.2"
color="green"
variant="light"
>
{t`All files were uploaded successfully.`}
Expand Down
2 changes: 1 addition & 1 deletion echo/frontend/src/components/layout/ParticipantHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ export const ParticipantHeader = () => {
className="rounded-full"
onClick={handleCancel}
>
<Trans id="participant.verify.instructions.button.cancel">
<Trans id="participant.concrete.instructions.button.cancel">
Cancel
</Trans>
</Button>
Expand Down
8 changes: 4 additions & 4 deletions echo/frontend/src/components/participant/EchoErrorAlert.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,15 +13,15 @@ export const EchoErrorAlert = ({ error }: { error: Error }) => {
>
<Text size="sm">
{error?.message?.includes("CONTENT_POLICY_VIOLATION") ? (
<Trans id="participant.echo.content.policy.violation.error.message">
<Trans id="participant.go.deeper.content.policy.violation.error.message">
Sorry, we cannot process this request due to an LLM provider's
content policy.
</Trans>
) : (
<Trans id="participant.echo.generic.error.message">
<Trans id="participant.go.deeper.generic.error.message">
Something went wrong. Please try again by pressing the{" "}
<span className="font-bold">ECHO</span> button, or contact support
if the issue continues.
<span className="font-bold">Go deeper</span> button, or contact
support if the issue continues.
</Trans>
)}
</Text>
Expand Down
4 changes: 2 additions & 2 deletions echo/frontend/src/components/participant/ParticipantConversationAudio.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -272,14 +272,14 @@ export const ParticipantConversationAudio = () => {
}
if (showVerify) {
return (
<Trans id="participant.modal.refine.info.title.verify">
<Trans id="participant.modal.refine.info.title.concrete">
"Make it concrete" available soon
</Trans>
);
}
if (showEcho) {
return (
<Trans id="participant.modal.refine.info.title.echo">
<Trans id="participant.modal.refine.info.title.go.deeper">
"Go deeper" available soon
</Trans>
);
Expand Down
1 change: 0 additions & 1 deletion echo/frontend/src/components/participant/ParticipantConversationAudioContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,6 @@ export const ParticipantConversationAudioContent = () => {
const newSearchParams = new URLSearchParams(searchParams);
newSearchParams.delete("echo");
setSearchParams(newSearchParams, { replace: true });
console.log("inside echo: ", hasEchoParam);
}
}, []);

Expand Down
4 changes: 2 additions & 2 deletions echo/frontend/src/components/participant/refine/RefineSelection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { Trans } from "@lingui/react/macro";
import { Box, Group, Progress, Stack, Text, Title } from "@mantine/core";
import { IconArrowDownToArc, IconMessageFilled } from "@tabler/icons-react";
import { IconArrowDownToArc, IconMessage } from "@tabler/icons-react";
import { useParams } from "react-router";
import { useParticipantProjectById } from "@/components/participant/hooks";
import { useI18nNavigate } from "@/hooks/useI18nNavigate";
Expand Down Expand Up @@ -59,7 +59,7 @@ export const RefineSelection = () => {
className="h-full px-2 py-6 justify-center"
>
<Group gap="sm" align="center">
<IconMessageFilled size={32} />
<IconMessage size={32} />
<Title order={2} fw={600}>
<Trans id="participant.refine.make.concrete">
Make it concrete
Expand Down
2 changes: 1 addition & 1 deletion echo/frontend/src/components/participant/verify/VerifiedArtefactItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ export const VerifiedArtefactItem = ({
<ActionIcon
variant="subtle"
color="blue"
aria-label="verified artefact"
aria-label="concrete artefact"
size={22}
>
<IconRosetteDiscountCheckFilled />
Expand Down
76 changes: 24 additions & 52 deletions echo/frontend/src/components/participant/verify/VerifyArtefact.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ import {
ScrollArea,
Stack,
Text,
Title,
} from "@mantine/core";
import { IconPencil, IconPlayerPause, IconVolume } from "@tabler/icons-react";
import { useQueryClient } from "@tanstack/react-query";
Expand All @@ -30,14 +29,6 @@ import {
import { VerifyArtefactError } from "./VerifyArtefactError";
import { VerifyArtefactLoading } from "./VerifyArtefactLoading";

const LANGUAGE_TO_LOCALE: Record<string, string> = {
de: "de-DE",
en: "en-US",
es: "es-ES",
fr: "fr-FR",
nl: "nl-NL",
};

const MemoizedMarkdownWYSIWYG = memo(MarkdownWYSIWYG);

export const VerifyArtefact = () => {
Expand Down Expand Up @@ -76,23 +67,8 @@ export const VerifyArtefact = () => {
const artefactDateUpdated = artefactQuery.data?.date_created ?? null;
const selectedOptionKey = artefactQuery.data?.key ?? null;

const projectLanguage = projectQuery.data?.language ?? "en";
const languageLocale =
LANGUAGE_TO_LOCALE[projectLanguage] ?? LANGUAGE_TO_LOCALE.en;

const availableTopics = topicsQuery.data?.available_topics ?? [];
const selectedTopics = topicsQuery.data?.selected_topics ?? [];

const selectedTopic = availableTopics.find(
(topic) => topic.key === selectedOptionKey,
);

const selectedOptionLabel =
selectedTopic?.translations?.[languageLocale]?.label ??
selectedTopic?.translations?.["en-US"]?.label ??
selectedTopic?.key ??
t`verified`;

// biome-ignore lint/correctness/useExhaustiveDependencies: no need for navigate function in dependency
useEffect(() => {
// Redirect if artifact_id is missing from URL
Expand Down Expand Up @@ -324,41 +300,35 @@ export const VerifyArtefact = () => {
</div>
<Stack gap="sm" align="center">
<Text size="xl" fw={600}>
<Trans id="participant.verify.regenerating.artefact">
<Trans id="participant.concrete.regenerating.artefact">
Regenerating the artefact
</Trans>
</Text>
<Text size="sm" c="dimmed">
<Trans id="participant.verify.regenerating.artefact.description">
<Trans id="participant.concrete.regenerating.artefact.description">
This will just take a few moments
</Trans>
</Text>
</Stack>
</Stack>
) : (
<Stack gap="md" className="py-4">
<Group justify="space-between" align="center" wrap="nowrap">
<Title order={4} className="font-semibold">
<Trans id="participant.verify.artefact.title">
Artefact: {selectedOptionLabel}
</Trans>
</Title>
{readAloudUrl && (
<ActionIcon
size="lg"
variant="subtle"
color="gray"
onClick={handleReadAloud}
aria-label={isPlaying ? t`Pause reading` : t`Read aloud`}
>
{isPlaying ? (
<IconPlayerPause size={20} />
) : (
<IconVolume size={20} />
)}
</ActionIcon>
)}
</Group>
{readAloudUrl && (
<ActionIcon
size="lg"
variant="subtle"
color="gray"
ml="auto"
onClick={handleReadAloud}
aria-label={isPlaying ? t`Pause reading` : t`Read aloud`}
>
{isPlaying ? (
<IconPlayerPause size={20} />
) : (
<IconVolume size={20} />
)}
</ActionIcon>
)}

{isEditing ? (
<MemoizedMarkdownWYSIWYG
Expand Down Expand Up @@ -388,15 +358,17 @@ export const VerifyArtefact = () => {
className="flex-1 shadow-xl"
onClick={handleCancelEdit}
>
<Trans id="participant.verify.action.button.cancel">Cancel</Trans>
<Trans id="participant.concrete.action.button.cancel">
Cancel
</Trans>
</Button>
<Button
size="lg"
radius="md"
className="flex-1 shadow-xl"
onClick={handleSaveEdit}
>
<Trans id="participant.verify.action.button.save">Save</Trans>
<Trans id="participant.concrete.action.button.save">Save</Trans>
</Button>
</>
) : (
Expand All @@ -419,7 +391,7 @@ export const VerifyArtefact = () => {
{reviseCooldown.isOnCooldown ? (
<>{reviseCooldown.timeRemainingSeconds}s</>
) : (
<Trans id="participant.verify.action.button.revise">
<Trans id="participant.concrete.action.button.revise">
Revise
</Trans>
)}
Expand Down Expand Up @@ -452,7 +424,7 @@ export const VerifyArtefact = () => {
!artefactContent
}
>
<Trans id="participant.verify.action.button.approve">
<Trans id="participant.concrete.action.button.approve">
Approve
</Trans>
</Button>
Expand Down
Loading
Loading