From 15c7212031fe6f3243f499b200fa65a86662c5d5 Mon Sep 17 00:00:00 2001
From: JonnyWong16 <9099342+JonnyWong16@users.noreply.github.com>
Date: Wed, 30 Jun 2021 17:43:48 -0700
Subject: [PATCH] Add option group type to notifier and newsletter config modal

---
 data/interfaces/default/newsletter_config.html | 10 +++++++---
 data/interfaces/default/notifier_config.html   | 10 +++++++---
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/data/interfaces/default/newsletter_config.html b/data/interfaces/default/newsletter_config.html
index 88e2590f..9ee1e96d 100644
--- a/data/interfaces/default/newsletter_config.html
+++ b/data/interfaces/default/newsletter_config.html
@@ -326,10 +326,14 @@
                                                 <div class="col-md-12">
                                                     <select class="form-control" id="${item['name']}" name="${item['name']}">
                                                         % for key, value in sorted(item['select_options'].items()):
-                                                        % if key == item['value']:
-                                                        <option value="${key}" selected>${value}</option>
+                                                        % if isinstance(value, list):
+                                                        <optgroup label="${key}">
+                                                            % for option in sorted(value, key=lambda x: x['text'].lower()):
+                                                                <option value="${option['value']}" ${'selected' if option['value'] == item['value'] else ''}>${option['text']}</option>
+                                                            % endfor
+                                                        </optgroup>
                                                         % else:
-                                                        <option value="${key}">${value}</option>
+                                                        <option value="${key}" ${'selected' if key == item['value'] else ''}>${value}</option>
                                                         % endif
                                                         % endfor
                                                     </select>
diff --git a/data/interfaces/default/notifier_config.html b/data/interfaces/default/notifier_config.html
index 573ca3c8..3fff8ca0 100644
--- a/data/interfaces/default/notifier_config.html
+++ b/data/interfaces/default/notifier_config.html
@@ -113,10 +113,14 @@
                                             <div class="col-md-12">
                                                 <select class="form-control" id="${item['name']}" name="${item['name']}">
                                                     % for key, value in sorted(item['select_options'].items()):
-                                                    % if key == item['value']:
-                                                    <option value="${key}" selected>${value}</option>
+                                                    % if isinstance(value, list):
+                                                    <optgroup label="${key}">
+                                                        % for option in sorted(value, key=lambda x: x['text'].lower()):
+                                                            <option value="${option['value']}" ${'selected' if option['value'] == item['value'] else ''}>${option['text']}</option>
+                                                        % endfor
+                                                    </optgroup>
                                                     % else:
-                                                    <option value="${key}">${value}</option>
+                                                    <option value="${key}" ${'selected' if key == item['value'] else ''}>${value}</option>
                                                     % endif
                                                     % endfor
                                                 </select>