feat(protobufs): sync to firmware-current and consume workspace package (#1097)
* feat(protobufs): sync to firmware-current and consume workspace package Sync the vendored .proto sources to firmware-current (v2.7.25+48), regenerate the v2 TS bindings, and consume the workspace @meshtastic/protobufs (workspace:*) in place of the stale JSR 2.7.20 — finishing the monorepo migration (core was already workspace:*). Includes the one required breaking-change fix: admin nodedb_reset changed int32 to bool, so resetNodes() now sends value: true. * build(protobufs): vendor generated bindings for workspace consumers The package is consumed via workspace:* — its exports point at the TS source, which imports ./dist/meshtastic/*_pb.ts — so the generated output must exist at build time. CI builds web/core with no codegen step and the runners have no buf CLI, so the bindings are vendored here (kept gitignored; lint/format skip them). Regenerate with: pnpm --filter @meshtastic/protobufs gen * fix(protobufs): clean script removes the actual generated output dir buf writes bindings to packages/ts/dist, but clean was removing a non-existent root dist — so it never cleaned stale output. Addresses Copilot review feedback. * refactor: move web app packages/web -> apps/web Aligns the web app with the apps/web layout (matching the Vercel web-test Root Directory and the SDK-migration direction). Pure directory move plus root config: pnpm-workspace (adds apps/*), vitest projects, root tsconfig reference, and the pr/release-web/nightly workflows. vercel.json moved with the app. Build + 36 validation tests green. * feat: config fields, module pages, key verification, telemetry capture Incorporates the firmware-current feature work onto the protobuf foundation: new config fields (Display message bubbles; LoRa fem_lna_mode + serial_hal_only; Telemetry air_quality_screen_enabled); 4 new ModuleConfig pages (TrafficManagement, StatusMessage, TAK, RemoteHardware); the manual Key Verification flow (sendKeyVerification + ClientNotificationDialog stages + Verify Key button); live telemetry capture (nodeDB addDeviceMetrics) and admin hardening (toggleMutedNode, graceful PortNum default); plus the sdk-preview ConfigEditor demo and store/config tests. Build + lint + format + 131 tests green. * chore: drop #1062 (unsaved-change-detection) to match upstream revert #1062 was merged to main by accident (per @danditomaso) and is being reverted. Reverse-applied its diff here via 3-way so #1097 stays consistent with where main is headed, while keeping the feature changes layered on the same files (deviceStore/changeRegistry). Build + 131 tests + lint + format green. * fix(nodes): clean up SNR display in node table and map popup SNR is a ratio measured in dB, not dBm (which is absolute power); the node table and map popup both mislabeled it and crammed three values together: '0dBm/50%/50raw'. The trailing '%/raw' pair was the same heuristic ((snr+10)*5) shown twice — once clamped, once not. Render SNR in dB rounded to one decimal, color-coded by a 0-100% signal-quality heuristic (green/yellow/red), with the quality percentage as a muted secondary. Drop the redundant raw value. Adds unit.db; this matches the existing SNRTooltip, which already renders dB.
This commit is contained in:
Ben Meadors
@@ -0,0 +1,160 @@
|
||||
import { MessageItem } from "@components/PageComponents/Messages/MessageItem.tsx";
|
||||
import { Separator } from "@components/UI/Separator";
|
||||
import { Skeleton } from "@components/UI/Skeleton.tsx";
|
||||
import type { Message } from "@core/stores/messageStore/types.ts";
|
||||
import type { TFunction } from "i18next";
|
||||
import { InboxIcon } from "lucide-react";
|
||||
import { Fragment, Suspense, useMemo } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
|
||||
export interface ChannelChatProps {
|
||||
messages?: Message[];
|
||||
}
|
||||
|
||||
function toTs(d: Message["date"]): number {
|
||||
return typeof d === "number" ? d : Date.parse(String(d));
|
||||
}
|
||||
|
||||
function startOfLocalDay(ts: number): number {
|
||||
const d = new Date(ts);
|
||||
d.setHours(0, 0, 0, 0);
|
||||
return d.getTime();
|
||||
}
|
||||
|
||||
function formatDateLabelFromDayKey(
|
||||
dayKey: number,
|
||||
t: TFunction<"common", undefined>,
|
||||
fmt: Intl.DateTimeFormat,
|
||||
): string {
|
||||
const todayKey = startOfLocalDay(Date.now());
|
||||
const yestKey = todayKey - 24 * 60 * 60 * 1000;
|
||||
|
||||
if (dayKey === todayKey) {
|
||||
return t("unit.day.today"); // "Today" from common.json
|
||||
}
|
||||
if (dayKey === yestKey) {
|
||||
return t("unit.day.yesterday"); // "Yesterday" from common.json
|
||||
}
|
||||
return fmt.format(new Date(dayKey));
|
||||
}
|
||||
|
||||
type DayGroup = { dayKey: number; label: string; items: Message[] };
|
||||
|
||||
function groupMessagesByDay(
|
||||
messages: Message[],
|
||||
t: TFunction<"common", undefined>,
|
||||
fmt: Intl.DateTimeFormat,
|
||||
): DayGroup[] {
|
||||
const out: DayGroup[] = [];
|
||||
|
||||
for (const msg of messages) {
|
||||
const ts = toTs(msg.date);
|
||||
const dayKey = startOfLocalDay(ts);
|
||||
const last = out[out.length - 1];
|
||||
if (last && last.dayKey === dayKey) {
|
||||
last.items.push(msg);
|
||||
} else {
|
||||
out.push({
|
||||
dayKey,
|
||||
label: formatDateLabelFromDayKey(dayKey, t, fmt),
|
||||
items: [msg],
|
||||
});
|
||||
}
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
const DateDelimiter = ({ label }: { label: string }) => (
|
||||
<li aria-label={label}>
|
||||
<div className="my-2 flex h-3 items-center justify-center">
|
||||
<Separator className="bg-slate-100 dark:bg-slate-800" />
|
||||
<div className="mx-5 whitespace-nowrap text-center text-xs text-slate-400">{label}</div>
|
||||
<Separator className="bg-slate-100 dark:bg-slate-800" />
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
|
||||
const MessageSkeleton = () => {
|
||||
console.log("[ChannelChat] Showing MessageSkeleton (Suspense fallback)");
|
||||
return (
|
||||
<li className="group w-full py-2 relative list-none rounded-md">
|
||||
<div className="grid grid-cols-[auto_1fr] gap-x-2">
|
||||
<Skeleton className="size-8 rounded-full" />
|
||||
<div className="flex flex-col gap-1.5 min-w-0">
|
||||
<div className="flex items-center gap-1.5">
|
||||
<Skeleton className="h-4 w-24" />
|
||||
<Skeleton className="h-3 w-12" />
|
||||
</div>
|
||||
<Skeleton className="h-4 w-full" />
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
);
|
||||
};
|
||||
|
||||
const EmptyState = () => {
|
||||
const { t } = useTranslation("messages");
|
||||
return (
|
||||
<div className="flex flex-1 flex-col place-content-center place-items-center p-8 text-slate-500 dark:text-slate-400">
|
||||
<InboxIcon className="mb-2 h-8 w-8" />
|
||||
<span className="text-sm">{t("emptyState.text")}</span>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export const ChannelChat = ({ messages = [] }: ChannelChatProps) => {
|
||||
const { i18n, t } = useTranslation();
|
||||
|
||||
const locale = useMemo(
|
||||
() => i18n.language || (typeof navigator !== "undefined" ? navigator.language : "en-US"),
|
||||
[i18n.language],
|
||||
);
|
||||
|
||||
const dayLabelFmt = useMemo(
|
||||
() =>
|
||||
new Intl.DateTimeFormat(locale, {
|
||||
year: "numeric",
|
||||
month: "long",
|
||||
day: "numeric",
|
||||
}),
|
||||
[locale],
|
||||
);
|
||||
|
||||
// Sort messages by date in case they are stored out of order
|
||||
const sorted = useMemo(
|
||||
() => [...messages].sort((a, b) => toTs(b.date) - toTs(a.date)),
|
||||
[messages],
|
||||
);
|
||||
|
||||
const groups = useMemo(
|
||||
() => groupMessagesByDay(sorted, t, dayLabelFmt),
|
||||
[sorted, dayLabelFmt, t],
|
||||
);
|
||||
|
||||
if (!messages.length) {
|
||||
return (
|
||||
<div className="flex flex-1 flex-col items-center justify-center">
|
||||
<EmptyState />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<ul className="flex flex-col-reverse flex-grow overflow-y-auto px-3 py-2">
|
||||
{groups.map(({ dayKey, label, items }) => (
|
||||
<Fragment key={dayKey}>
|
||||
{/* Render messages first, then delimiter — with flex-col-reverse this shows the delimiter above that day's messages */}
|
||||
{items.map((message) => (
|
||||
<Suspense
|
||||
key={message.messageId ?? `${message.from}-${message.date}`}
|
||||
fallback={<MessageSkeleton />}
|
||||
>
|
||||
<MessageItem message={message} />
|
||||
</Suspense>
|
||||
))}
|
||||
<DateDelimiter label={label} />
|
||||
</Fragment>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
};
|
||||
Reference in New Issue
Block a user