✨(sharing) add shared calendars, remove "agenda" wording

src/frontend/apps/calendars/src/features/calendar/components/calendar-list/CalendarList.tsx

@@ -20,7 +20,8 @@ import { extractCaldavPath } from "./utils";
 export const CalendarList = () => {
   const { t } = useTranslation();
   const {
-    davCalendars,
+    ownedCalendars,
+    sharedCalendars,
     visibleCalendarUrls,
     toggleCalendarVisibility,
     createCalendar,
@@ -34,6 +35,7 @@ export const CalendarList = () => {
     deleteState,
     shareModalState,
     isMyCalendarsExpanded,
+    isSharedCalendarsExpanded,
     openMenuUrl,
     handleOpenCreateModal,
     handleOpenEditModal,
@@ -47,6 +49,7 @@ export const CalendarList = () => {
     handleMenuToggle,
     handleCloseMenu,
     handleToggleMyCalendars,
+    handleToggleSharedCalendars,
   } = useCalendarListState({
     createCalendar,
     updateCalendar,
@@ -138,7 +141,7 @@ export const CalendarList = () => {
           </div>
           {isMyCalendarsExpanded && (
             <div className="calendar-list__items">
-              {davCalendars.map((calendar) => (
+              {ownedCalendars.map((calendar) => (
                 <CalendarListItem
                   key={calendar.url}
                   calendar={calendar}
@@ -157,6 +160,50 @@ export const CalendarList = () => {
             </div>
           )}
         </div>
+
+        {sharedCalendars.length > 0 && (
+          <div className="calendar-list__section">
+            <div className="calendar-list__section-header">
+              <button
+                className="calendar-list__toggle-btn"
+                onClick={handleToggleSharedCalendars}
+                aria-expanded={isSharedCalendarsExpanded}
+              >
+                <span
+                  className={`material-icons calendar-list__toggle-icon ${
+                    isSharedCalendarsExpanded
+                      ? 'calendar-list__toggle-icon--expanded'
+                      : ''
+                  }`}
+                >
+                  expand_more
+                </span>
+                <span className="calendar-list__section-title">
+                  {t('calendar.list.sharedCalendars')}
+                </span>
+              </button>
+            </div>
+            {isSharedCalendarsExpanded && (
+              <div className="calendar-list__items">
+                {sharedCalendars.map((calendar) => (
+                  <CalendarListItem
+                    key={calendar.url}
+                    calendar={calendar}
+                    isVisible={visibleCalendarUrls.has(calendar.url)}
+                    isMenuOpen={openMenuUrl === calendar.url}
+                    onToggleVisibility={toggleCalendarVisibility}
+                    onMenuToggle={handleMenuToggle}
+                    onEdit={handleOpenEditModal}
+                    onDelete={handleOpenDeleteModal}
+                    onImport={handleOpenImportModal}
+                    onSubscription={handleOpenSubscriptionModal}
+                    onCloseMenu={handleCloseMenu}
+                  />
+                ))}
+              </div>
+            )}
+          </div>
+        )}
       </div>
 
       <CalendarModal

src/frontend/apps/calendars/src/features/calendar/components/calendar-list/hooks/useCalendarListState.ts

@@ -47,6 +47,7 @@ export const useCalendarListState = ({
   });
 
   const [isMyCalendarsExpanded, setIsMyCalendarsExpanded] = useState(true);
+  const [isSharedCalendarsExpanded, setIsSharedCalendarsExpanded] = useState(true);
   const [openMenuUrl, setOpenMenuUrl] = useState<string | null>(null);
 
   // Modal handlers
@@ -159,6 +160,10 @@ export const useCalendarListState = ({
     setIsMyCalendarsExpanded((prev) => !prev);
   }, []);
 
+  const handleToggleSharedCalendars = useCallback(() => {
+    setIsSharedCalendarsExpanded((prev) => !prev);
+  }, []);
+
   return {
     // Modal state
     modalState,
@@ -167,6 +172,7 @@ export const useCalendarListState = ({
 
     // Expansion state
     isMyCalendarsExpanded,
+    isSharedCalendarsExpanded,
     openMenuUrl,
 
     // Modal handlers
@@ -190,5 +196,6 @@ export const useCalendarListState = ({
 
     // Expansion handlers
     handleToggleMyCalendars,
+    handleToggleSharedCalendars,
   };
 };

src/frontend/apps/calendars/src/features/calendar/contexts/CalendarContext.tsx

@@ -48,6 +48,8 @@ export interface CalendarContextType {
   caldavService: CalDavService;
   adapter: EventCalendarAdapter;
   davCalendars: CalDavCalendar[];
+  ownedCalendars: CalDavCalendar[];
+  sharedCalendars: CalDavCalendar[];
   visibleCalendarUrls: Set<string>;
   isLoading: boolean;
   isConnected: boolean;
@@ -107,6 +109,23 @@ export const CalendarContextProvider = ({
   const [currentDate, setCurrentDate] = useState<Date>(new Date());
   const [selectedDate, setSelectedDate] = useState<Date>(new Date());
 
+  const { ownedCalendars, sharedCalendars } = useMemo(() => {
+    const homeUrl = caldavService.getAccount()?.homeUrl;
+    if (!homeUrl) {
+      return { ownedCalendars: davCalendars, sharedCalendars: [] };
+    }
+    const owned: CalDavCalendar[] = [];
+    const shared: CalDavCalendar[] = [];
+    for (const cal of davCalendars) {
+      if (cal.url.startsWith(homeUrl)) {
+        owned.push(cal);
+      } else {
+        shared.push(cal);
+      }
+    }
+    return { ownedCalendars: owned, sharedCalendars: shared };
+  }, [davCalendars, caldavService]);
+
   const refreshCalendars = useCallback(async () => {
     try {
       setIsLoading(true);
@@ -325,6 +344,8 @@ export const CalendarContextProvider = ({
     caldavService,
     adapter,
     davCalendars,
+    ownedCalendars,
+    sharedCalendars,
     visibleCalendarUrls,
     isLoading,
     isConnected,

src/frontend/apps/calendars/src/features/i18n/translations.json

@@ -804,8 +804,8 @@
           }
         },
         "list": {
-          "myCalendars": "Mes agendas",
+          "myCalendars": "Mes calendriers",
-          "sharedCalendars": "Agendas partagés",
+          "sharedCalendars": "Calendriers partagés",
           "shared": "(partagé)",
           "showCalendar": "Afficher le calendrier",
           "edit": "Modifier",
@@ -906,32 +906,32 @@
           }
         },
         "createCalendar": {
-          "title": "Créer un agenda",
+          "title": "Créer un calendrier",
           "name": "Nom",
-          "namePlaceholder": "Nom de l'agenda",
+          "namePlaceholder": "Nom du calendrier",
           "nameRequired": "Le nom est requis",
           "color": "Couleur",
           "description": "Description",
-          "descriptionPlaceholder": "Description de l'agenda (optionnel)",
+          "descriptionPlaceholder": "Description du calendrier (optionnel)",
           "cancel": "Annuler",
           "create": "Créer"
         },
         "editCalendar": {
-          "title": "Modifier l'agenda",
+          "title": "Modifier le calendrier",
           "save": "Enregistrer"
         },
         "deleteCalendar": {
-          "title": "Supprimer l'agenda",
+          "title": "Supprimer le calendrier",
-          "message": "Êtes-vous sûr de vouloir supprimer l'agenda \"{{name}}\" ? Cette action est irréversible.",
+          "message": "Êtes-vous sûr de vouloir supprimer le calendrier \"{{name}}\" ? Cette action est irréversible.",
           "confirm": "Supprimer"
         },
         "shareCalendar": {
-          "title": "Partager l'agenda",
+          "title": "Partager le calendrier",
           "emailPlaceholder": "Entrez l'adresse email",
           "share": "Partager",
           "hint": "La personne aura les mêmes droits que vous (lecture et écriture).",
-          "success": "Agenda partagé avec {{email}}",
+          "success": "Calendrier partagé avec {{email}}",
-          "error": "Échec du partage de l'agenda",
+          "error": "Échec du partage du calendrier",
           "invalidEmail": "Veuillez entrer une adresse email valide"
         },
         "attendees": {
@@ -1109,7 +1109,7 @@
         "event": {
           "createTitle": "Evenement aanmaken",
           "editTitle": "Evenement bewerken",
-          "calendar": "Agenda",
+          "calendar": "Kalender",
           "title": "Titel",
           "titlePlaceholder": "Evenement titel",
           "location": "Locatie",
@@ -1178,10 +1178,10 @@
           }
         },
         "list": {
-          "myCalendars": "Mijn agenda's",
+          "myCalendars": "Mijn kalenders",
-          "sharedCalendars": "Gedeelde agenda's",
+          "sharedCalendars": "Gedeelde kalenders",
           "shared": "(gedeeld)",
-          "showCalendar": "Agenda tonen",
+          "showCalendar": "Kalender tonen",
           "edit": "Bewerken",
           "delete": "Verwijderen",
           "share": "Delen",
@@ -1202,21 +1202,21 @@
           "errorDetails": "Foutdetails"
         },
         "subscription": {
-          "title": "Agenda-abonnements-URL",
+          "title": "Kalender-abonnements-URL",
-          "description": "Gebruik deze URL om u te abonneren op \"{{name}}\" vanuit externe agendatoepassingen (Apple Calendar, Google Calendar, Outlook, etc.).",
+          "description": "Gebruik deze URL om u te abonneren op \"{{name}}\" vanuit externe kalendertoepassingen (Apple Calendar, Google Calendar, Outlook, etc.).",
           "loading": "Abonnements-URL wordt gegenereerd...",
           "copy": "Kopiëren",
           "copied": "Gekopieerd!",
           "close": "Sluiten",
-          "warning": "Deze URL bevat een privétoken. Iedereen met deze link kan uw agenda-evenementen bekijken.",
+          "warning": "Deze URL bevat een privétoken. Iedereen met deze link kan uw kalender-evenementen bekijken.",
           "regenerate": "URL regenereren",
           "regenerateConfirm": {
             "title": "Abonnements-URL regenereren?",
-            "message": "Dit maakt de huidige URL ongeldig. Externe agenda's die de oude URL gebruiken zullen niet meer synchroniseren.",
+            "message": "Dit maakt de huidige URL ongeldig. Externe kalenders die de oude URL gebruiken zullen niet meer synchroniseren.",
             "confirm": "Regenereren"
           },
           "error": "Genereren van abonnements-URL mislukt. Probeer het opnieuw.",
-          "errorPermission": "U heeft geen toegang tot deze agenda.",
+          "errorPermission": "U heeft geen toegang tot deze kalender.",
           "errorNetwork": "Netwerkfout. Controleer uw verbinding en probeer het opnieuw.",
           "errorServer": "Serverfout. Probeer het later opnieuw."
         },
@@ -1280,32 +1280,32 @@
           }
         },
         "createCalendar": {
-          "title": "Agenda aanmaken",
+          "title": "Kalender aanmaken",
           "name": "Naam",
-          "namePlaceholder": "Agenda naam",
+          "namePlaceholder": "Kalender naam",
           "nameRequired": "Naam is verplicht",
           "color": "Kleur",
           "description": "Beschrijving",
-          "descriptionPlaceholder": "Agenda beschrijving (optioneel)",
+          "descriptionPlaceholder": "Kalender beschrijving (optioneel)",
           "cancel": "Annuleren",
           "create": "Aanmaken"
         },
         "editCalendar": {
-          "title": "Agenda bewerken",
+          "title": "Kalender bewerken",
           "save": "Opslaan"
         },
         "deleteCalendar": {
-          "title": "Agenda verwijderen",
+          "title": "Kalender verwijderen",
-          "message": "Weet u zeker dat u de agenda \"{{name}}\" wilt verwijderen? Deze actie kan niet ongedaan worden gemaakt.",
+          "message": "Weet u zeker dat u de kalender \"{{name}}\" wilt verwijderen? Deze actie kan niet ongedaan worden gemaakt.",
           "confirm": "Verwijderen"
         },
         "shareCalendar": {
-          "title": "Agenda delen",
+          "title": "Kalender delen",
           "emailPlaceholder": "Voer e-mailadres in",
           "share": "Delen",
           "hint": "De persoon krijgt dezelfde rechten als u (lezen en schrijven).",
-          "success": "Agenda gedeeld met {{email}}",
+          "success": "Kalender gedeeld met {{email}}",
-          "error": "Delen van agenda mislukt",
+          "error": "Delen van kalender mislukt",
           "invalidEmail": "Voer een geldig e-mailadres in"
         },
         "attendees": {