feat: show sync provider icon on someday lists

- Add externalProvider to SomedayList interface and fetch mapping
- Display a small provider icon (Microsoft/Google/Apple) next to the
  list title with tooltip showing the sync source
- Icon appears at 50% opacity to stay subtle

v1.2.3

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
mARTin 2026-02-24 00:30:23 +01:00
parent 866f514f10
commit 220015b2b6
2 changed files with 19 additions and 1 deletions

View File

@ -1,6 +1,6 @@
{
"name": "my-weekly-todo-list",
"version": "1.2.2",
"version": "1.2.3",
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
"main": "index.js",
"scripts": {

View File

@ -107,6 +107,7 @@ interface SomedayList {
id: string;
title: string;
tasks: Task[];
externalProvider?: string | null;
}
// Time grid configuration options
@ -1412,6 +1413,7 @@ export default function WeeklyView() {
id: l.id,
title: l.title,
tasks: [],
externalProvider: l.externalProvider || null,
}));
}
@ -4698,6 +4700,22 @@ export default function WeeklyView() {
if (e.key === "Enter") e.currentTarget.blur();
}}
/>
{list.externalProvider && (
<span
title={`Synced with ${list.externalProvider === "outlook" ? "Microsoft" : list.externalProvider === "google" ? "Google" : list.externalProvider === "apple" ? "Apple" : list.externalProvider}`}
style={{ display: "inline-flex", alignItems: "center", marginLeft: "4px", opacity: 0.5, flexShrink: 0 }}
>
{list.externalProvider === "outlook" ? (
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><rect x="2" y="3" width="20" height="18" rx="2"/><path d="M7 3v18"/><path d="M7 8h10"/><path d="M7 13h10"/></svg>
) : list.externalProvider === "google" ? (
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 8v8"/><path d="M8 12h8"/></svg>
) : list.externalProvider === "apple" ? (
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"><path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83"/><path d="M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11"/></svg>
) : (
<RefreshCcw size={12} />
)}
</span>
)}
<button
className="someday-list-delete-btn"
onClick={async (e) => {