From c89646ef8d00d23cd9914f457ee5114900307a3e Mon Sep 17 00:00:00 2001
From: Matthew Holloway <matthew@staff.ietf.org>
Date: Thu, 14 Nov 2024 22:59:05 +0000
Subject: [PATCH] feat: Agenda proposed badge (#8164)

---
 client/agenda/AgendaScheduleList.vue | 28 ++++++++++++++++++++++++++--
 ietf/meeting/views.py                |  1 +
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/client/agenda/AgendaScheduleList.vue b/client/agenda/AgendaScheduleList.vue
index 286999257..0cac7e39e 100644
--- a/client/agenda/AgendaScheduleList.vue
+++ b/client/agenda/AgendaScheduleList.vue
@@ -83,6 +83,14 @@
                 template(#trigger)
                   span.badge.is-bof BoF
                 span #[a(href='https://www.ietf.org/how/bofs/', target='_blank') Birds of a Feather] sessions (BoFs) are initial discussions about a particular topic of interest to the IETF community.
+              n-popover(
+                v-if='item.isProposed'
+                trigger='hover'
+                :width='250'
+                )
+                template(#trigger)
+                  span.badge.is-proposed Proposed
+                span #[a(href='https://www.ietf.org/process/wgs/', target='_blank') Proposed WGs] are groups in the process of being chartered. If the charter is not approved by the IESG before the IETF meeting, the session may be canceled.
               .agenda-table-note(v-if='item.note')
                 i.bi.bi-arrow-return-right.me-1
                 span {{item.note}}
@@ -468,6 +476,7 @@ const meetingEvents = computed(() => {
       // groupParentName: item.groupParent?.name,
       icon,
       isBoF: item.isBoF,
+      isProposed: item.isProposed,
       isSessionEvent: item.type === 'regular',
       links,
       location: item.location,
@@ -1012,10 +1021,25 @@ onBeforeUnmount(() => {
         word-wrap: break-word;
       }
 
-      .badge.is-bof {
-        background-color: $teal-500;
+      .badge {
         margin: 0 8px;
 
+        &.is-bof {
+          background-color: $teal-500;
+
+          @at-root .theme-dark & {
+            background-color: $teal-700;
+          }
+        }
+
+        &.is-proposed {
+          background-color: $gray-500;
+
+          @at-root .theme-dark & {
+            background-color: $gray-700;
+          }
+        }
+
         @media screen and (max-width: $bs5-break-md) {
           width: 30px;
           display: block;
diff --git a/ietf/meeting/views.py b/ietf/meeting/views.py
index 628125776..a195e74ce 100644
--- a/ietf/meeting/views.py
+++ b/ietf/meeting/views.py
@@ -1786,6 +1786,7 @@ def agenda_extract_schedule (item):
         "type": item.session.type.slug,
         "purpose": item.session.purpose.slug,
         "isBoF": item.session.group_at_the_time().state_id == "bof",
+        "isProposed": item.session.group_at_the_time().state_id == "proposed",
         "filterKeywords": item.filter_keywords,
         "groupAcronym": item.session.group_at_the_time().acronym,
         "groupName": item.session.group_at_the_time().name,