From 4a98030055fb4ec64549ce4fecaa1cd5d656d08c Mon Sep 17 00:00:00 2001
From: luminaryFlowers <71102109+luminaryFlowers@users.noreply.github.com>
Date: Wed, 10 Jul 2024 16:57:07 -0700
Subject: [PATCH] member group pages => voting members, staff & implementing
 partners, board members

---
 .../0006_delete_hotsearchablepage.py          |  16 +++
 app/core/models.py                            |   4 -
 ...04_membergroupownerpage_membergrouppage.py |  52 +++++++
 ...0005_individualmemberpage_member_groups.py |  20 +++
 ...lter_individualmemberpage_member_groups.py |  20 +++
 ...lter_individualmemberpage_member_groups.py |  20 +++
 ...0008_membergrouppage_hub_shown_and_more.py |  23 +++
 ...lter_membergrouppage_hub_shown_and_more.py |  23 +++
 ...010_membergrouppage_show_search_options.py |  18 +++
 ...membergroupownerpage_search_button_text.py |  18 +++
 ...0012_membergroupownerpage_view_all_text.py |  18 +++
 app/members/models.py                         | 133 +++++++++++++++++-
 .../members/components/MembersSortOption.html |   4 +
 .../components/TailwindGridSizeAssurance.html |   9 ++
 .../members/individual_member_page.html       |  22 +--
 .../templates/members/member_group_page.html  | 116 +++++++++++++++
 app/news/models.py                            |  13 +-
 app/projects/models.py                        |   1 -
 .../FooterBannerWithTextAndLink.html          |   5 +
 .../members/MemberPreviewBlock.html           |  24 ++++
 20 files changed, 537 insertions(+), 22 deletions(-)
 create mode 100644 app/core/migrations/0006_delete_hotsearchablepage.py
 create mode 100644 app/members/migrations/0004_membergroupownerpage_membergrouppage.py
 create mode 100644 app/members/migrations/0005_individualmemberpage_member_groups.py
 create mode 100644 app/members/migrations/0006_alter_individualmemberpage_member_groups.py
 create mode 100644 app/members/migrations/0007_alter_individualmemberpage_member_groups.py
 create mode 100644 app/members/migrations/0008_membergrouppage_hub_shown_and_more.py
 create mode 100644 app/members/migrations/0009_alter_membergrouppage_hub_shown_and_more.py
 create mode 100644 app/members/migrations/0010_membergrouppage_show_search_options.py
 create mode 100644 app/members/migrations/0011_membergroupownerpage_search_button_text.py
 create mode 100644 app/members/migrations/0012_membergroupownerpage_view_all_text.py
 create mode 100644 app/members/templates/members/components/MembersSortOption.html
 create mode 100644 app/members/templates/members/components/TailwindGridSizeAssurance.html
 create mode 100644 app/members/templates/members/member_group_page.html
 create mode 100644 app/ui/templates/ui/components/members/MemberPreviewBlock.html

diff --git a/app/core/migrations/0006_delete_hotsearchablepage.py b/app/core/migrations/0006_delete_hotsearchablepage.py
new file mode 100644
index 0000000..052077b
--- /dev/null
+++ b/app/core/migrations/0006_delete_hotsearchablepage.py
@@ -0,0 +1,16 @@
+# Generated by Django 4.2.7 on 2024-07-09 22:09
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('core', '0005_remove_hotsearchablepage_intro_delete_testpagepage'),
+    ]
+
+    operations = [
+        migrations.DeleteModel(
+            name='HOTSearchablePage',
+        ),
+    ]
diff --git a/app/core/models.py b/app/core/models.py
index f5bc52c..cc04e8e 100644
--- a/app/core/models.py
+++ b/app/core/models.py
@@ -29,7 +29,3 @@ def __str__(self):
     
     class Meta:
         verbose_name_plural = "Partners"
-
-
-class HotSearchablePage(Page):
-    pass
diff --git a/app/members/migrations/0004_membergroupownerpage_membergrouppage.py b/app/members/migrations/0004_membergroupownerpage_membergrouppage.py
new file mode 100644
index 0000000..9cb5a03
--- /dev/null
+++ b/app/members/migrations/0004_membergroupownerpage_membergrouppage.py
@@ -0,0 +1,52 @@
+# Generated by Django 4.2.7 on 2024-07-09 21:59
+
+import django.core.validators
+from django.db import migrations, models
+import django.db.models.deletion
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('wagtailcore', '0089_log_entry_data_json_null_to_object'),
+        ('wagtailimages', '0025_alter_image_file_alter_rendition_file'),
+        ('members', '0003_rename_introduction_individualmemberpage_intro'),
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='MemberGroupOwnerPage',
+            fields=[
+                ('page_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, serialize=False, to='wagtailcore.page')),
+                ('search_placeholder', models.CharField(default='Search by name')),
+                ('filter_by_country', models.CharField(default='Filter by Country')),
+                ('sort_by_titlea', models.CharField(default='Sort by Title Alphabetical')),
+                ('sort_by_titlez', models.CharField(default='Sort by Title Reverse Alphabetical')),
+                ('load_more_text', models.CharField(default='Load more', help_text="This will be a prefix to the title of the page; i.e., if the page title is 'Voting members', and this field is 'Load more', this will end up appearing as 'Load more Voting members'.")),
+                ('footer_box_title', models.CharField(default='Work for HOT')),
+                ('footer_box_description', wagtail.fields.RichTextField(blank=True)),
+                ('footer_box_button_text', models.CharField(default='Check our Job Opportunities')),
+                ('footer_box_button_link', models.URLField(blank=True)),
+            ],
+            options={
+                'abstract': False,
+            },
+            bases=('wagtailcore.page',),
+        ),
+        migrations.CreateModel(
+            name='MemberGroupPage',
+            fields=[
+                ('page_ptr', models.OneToOneField(auto_created=True, on_delete=django.db.models.deletion.CASCADE, parent_link=True, primary_key=True, serialize=False, to='wagtailcore.page')),
+                ('intro', wagtail.fields.RichTextField(blank=True, help_text='Appears in the header.')),
+                ('body_intro', wagtail.fields.RichTextField(blank=True)),
+                ('body_description', wagtail.fields.RichTextField(blank=True)),
+                ('desktop_size_items_per_row', models.SmallIntegerField(default=6, help_text='The number of members shown per row on desktop sizes.', validators=[django.core.validators.MinValueValidator(4), django.core.validators.MaxValueValidator(8)])),
+                ('header_image', models.ForeignKey(blank=True, help_text='Header image', null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='+', to='wagtailimages.image')),
+            ],
+            options={
+                'abstract': False,
+            },
+            bases=('wagtailcore.page',),
+        ),
+    ]
diff --git a/app/members/migrations/0005_individualmemberpage_member_groups.py b/app/members/migrations/0005_individualmemberpage_member_groups.py
new file mode 100644
index 0000000..e151dc3
--- /dev/null
+++ b/app/members/migrations/0005_individualmemberpage_member_groups.py
@@ -0,0 +1,20 @@
+# Generated by Django 4.2.7 on 2024-07-09 22:14
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0004_membergroupownerpage_membergrouppage'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='individualmemberpage',
+            name='member_groups',
+            field=wagtail.fields.StreamField([('member_group', wagtail.blocks.PageChooserBlock(page_type=['members.MemberGroupPage']))], blank=True, null=True, use_json_field=True),
+        ),
+    ]
diff --git a/app/members/migrations/0006_alter_individualmemberpage_member_groups.py b/app/members/migrations/0006_alter_individualmemberpage_member_groups.py
new file mode 100644
index 0000000..a981794
--- /dev/null
+++ b/app/members/migrations/0006_alter_individualmemberpage_member_groups.py
@@ -0,0 +1,20 @@
+# Generated by Django 4.2.7 on 2024-07-09 22:45
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0005_individualmemberpage_member_groups'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='individualmemberpage',
+            name='member_groups',
+            field=wagtail.fields.StreamField([('member_group', wagtail.blocks.StructBlock([('group', wagtail.blocks.PageChooserBlock(page_type=['members.MemberGroupPage'])), ('role', wagtail.blocks.CharBlock())]))], blank=True, null=True, use_json_field=True),
+        ),
+    ]
diff --git a/app/members/migrations/0007_alter_individualmemberpage_member_groups.py b/app/members/migrations/0007_alter_individualmemberpage_member_groups.py
new file mode 100644
index 0000000..14c8004
--- /dev/null
+++ b/app/members/migrations/0007_alter_individualmemberpage_member_groups.py
@@ -0,0 +1,20 @@
+# Generated by Django 4.2.7 on 2024-07-09 22:48
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0006_alter_individualmemberpage_member_groups'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='individualmemberpage',
+            name='member_groups',
+            field=wagtail.fields.StreamField([('member_group', wagtail.blocks.StructBlock([('group', wagtail.blocks.PageChooserBlock(page_type=['members.MemberGroupPage'])), ('role', wagtail.blocks.CharBlock(required=False))]))], blank=True, null=True, use_json_field=True),
+        ),
+    ]
diff --git a/app/members/migrations/0008_membergrouppage_hub_shown_and_more.py b/app/members/migrations/0008_membergrouppage_hub_shown_and_more.py
new file mode 100644
index 0000000..b032e78
--- /dev/null
+++ b/app/members/migrations/0008_membergrouppage_hub_shown_and_more.py
@@ -0,0 +1,23 @@
+# Generated by Django 4.2.7 on 2024-07-09 23:03
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0007_alter_individualmemberpage_member_groups'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='membergrouppage',
+            name='hub_shown',
+            field=models.BooleanField(blank=True, default=False, null=True),
+        ),
+        migrations.AddField(
+            model_name='membergrouppage',
+            name='position_shown',
+            field=models.BooleanField(blank=True, default=False, null=True),
+        ),
+    ]
diff --git a/app/members/migrations/0009_alter_membergrouppage_hub_shown_and_more.py b/app/members/migrations/0009_alter_membergrouppage_hub_shown_and_more.py
new file mode 100644
index 0000000..06f523c
--- /dev/null
+++ b/app/members/migrations/0009_alter_membergrouppage_hub_shown_and_more.py
@@ -0,0 +1,23 @@
+# Generated by Django 4.2.7 on 2024-07-09 23:05
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0008_membergrouppage_hub_shown_and_more'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='membergrouppage',
+            name='hub_shown',
+            field=models.BooleanField(default=False),
+        ),
+        migrations.AlterField(
+            model_name='membergrouppage',
+            name='position_shown',
+            field=models.BooleanField(default=False),
+        ),
+    ]
diff --git a/app/members/migrations/0010_membergrouppage_show_search_options.py b/app/members/migrations/0010_membergrouppage_show_search_options.py
new file mode 100644
index 0000000..d3c5861
--- /dev/null
+++ b/app/members/migrations/0010_membergrouppage_show_search_options.py
@@ -0,0 +1,18 @@
+# Generated by Django 4.2.7 on 2024-07-10 17:43
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0009_alter_membergrouppage_hub_shown_and_more'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='membergrouppage',
+            name='show_search_options',
+            field=models.BooleanField(default=True),
+        ),
+    ]
diff --git a/app/members/migrations/0011_membergroupownerpage_search_button_text.py b/app/members/migrations/0011_membergroupownerpage_search_button_text.py
new file mode 100644
index 0000000..60de3dc
--- /dev/null
+++ b/app/members/migrations/0011_membergroupownerpage_search_button_text.py
@@ -0,0 +1,18 @@
+# Generated by Django 4.2.7 on 2024-07-10 17:53
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0010_membergrouppage_show_search_options'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='membergroupownerpage',
+            name='search_button_text',
+            field=models.CharField(default='Search'),
+        ),
+    ]
diff --git a/app/members/migrations/0012_membergroupownerpage_view_all_text.py b/app/members/migrations/0012_membergroupownerpage_view_all_text.py
new file mode 100644
index 0000000..f1c7235
--- /dev/null
+++ b/app/members/migrations/0012_membergroupownerpage_view_all_text.py
@@ -0,0 +1,18 @@
+# Generated by Django 4.2.7 on 2024-07-10 19:21
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('members', '0011_membergroupownerpage_search_button_text'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='membergroupownerpage',
+            name='view_all_text',
+            field=models.CharField(default='View all'),
+        ),
+    ]
diff --git a/app/members/models.py b/app/members/models.py
index 58047ab..7121960 100644
--- a/app/members/models.py
+++ b/app/members/models.py
@@ -1,11 +1,14 @@
 from django.db import models
+from django.core.validators import MinValueValidator, MaxValueValidator
 from wagtail.admin.panels import FieldPanel, MultiFieldPanel
 from wagtail.blocks import CharBlock, StreamBlock, StructBlock, URLBlock, PageChooserBlock
 from wagtail.fields import RichTextField, StreamField
 from wagtail.models import Page
 from django.db.models import Q
+from django.core.paginator import Paginator, EmptyPage, PageNotAnInteger
 from app.projects.models import IndividualProjectPage
 from app.news.models import IndividualNewsPage
+from app.mapping_hubs.models import IndividualMappingHubPage
 from wagtail.search import index
 
 class WebLinkStructBlock(StructBlock):
@@ -17,6 +20,127 @@ class WebLinkBlock(StreamBlock):
     blocks = WebLinkStructBlock()
 
 
+class MemberGroupOwnerPage(Page):
+    max_count = 1
+
+    subpage_types = [
+        'members.MemberGroupPage'
+    ]
+
+    search_placeholder = models.CharField(default="Search by name")
+    filter_by_country = models.CharField(default="Filter by Country")
+    sort_by_titlea = models.CharField(default="Sort by Name Alphabetical")
+    sort_by_titlez = models.CharField(default="Sort by Name Reverse Alphabetical")
+    search_button_text = models.CharField(default="Search")
+
+    load_more_text = models.CharField(default="Load more", help_text="This will be a prefix to the title of the page; i.e., if the page title is 'Voting members', and this field is 'Load more', this will end up appearing as 'Load more Voting members'.")
+
+    view_all_text = models.CharField(default="View all")
+
+    footer_box_title = models.CharField(default="Work for HOT")
+    footer_box_description = RichTextField(blank=True)
+    footer_box_button_text = models.CharField(default="Check our Job Opportunities")
+    footer_box_button_link = models.URLField(blank=True)
+
+    content_panels = Page.content_panels + [
+        MultiFieldPanel([
+            FieldPanel('search_placeholder'),
+            FieldPanel('filter_by_country'),
+            FieldPanel('sort_by_titlea'),
+            FieldPanel('sort_by_titlez'),
+            FieldPanel('search_button_text'),
+        ], heading="Search options"),
+        FieldPanel('load_more_text'),
+        FieldPanel('view_all_text'),
+        MultiFieldPanel([
+            FieldPanel('footer_box_title'),
+            FieldPanel('footer_box_description'),
+            FieldPanel('footer_box_button_text'),
+            FieldPanel('footer_box_button_link'),
+        ], heading="Footer box"),
+    ]
+
+
+class MemberGroupPage(Page):
+    def get_context(self, request, *args, **kwargs):
+        context = super().get_context(request, *args, **kwargs)
+
+        members = IndividualMemberPage.objects.live().filter(
+            Q(member_groups__contains=[{'type': 'member_group', 'value': { 'group': context['page'].id }}])
+        ).filter(locale=context['page'].locale)
+
+        keyword = request.GET.get('keyword', '')
+
+        if keyword:
+            members = members.search(keyword).get_queryset()
+        
+        hubs = IndividualMappingHubPage.objects.live().filter(locale=context['page'].locale)
+        query = Q()
+        for hub in hubs:
+            if request.GET.get(str(hub), ''):
+                query = query | Q(location_hub=hub)
+        members = members.filter(query).distinct()
+
+        match request.GET.get('sort', ''):
+            case 'sort.titlea':
+                members = members.order_by('title')
+            case 'sort.titlez':
+                members = members.order_by('-title')
+            case _:
+                members = members.order_by('title')
+
+        page = request.GET.get('page', 1)
+        paginator = Paginator(members, 12)  # if you want more/less items per page (i.e., per load), change the number here to something else
+        try:
+            members = paginator.page(page)
+        except PageNotAnInteger:
+            members = paginator.page(1)
+        except EmptyPage:
+            members = paginator.page(paginator.num_pages)
+
+        context['members'] = members
+        context['hubs'] = hubs
+        context['groups'] = MemberGroupPage.objects.live().filter(locale=context['page'].locale).exclude(id=context['page'].id)
+
+        return context
+    
+    parent_page_type = [
+        'members.MemberGroupOwnerPage'
+    ]
+
+    header_image = models.ForeignKey(
+        "wagtailimages.Image",
+        null=True,
+        blank=True,
+        on_delete=models.SET_NULL,
+        related_name="+",
+        help_text="Header image"
+    )
+    intro = RichTextField(blank=True, help_text="Appears in the header.")
+
+    body_intro = RichTextField(blank=True)
+    body_description = RichTextField(blank=True)
+
+    show_search_options = models.BooleanField(default=True)
+    desktop_size_items_per_row = models.SmallIntegerField(default=6, help_text="The number of members shown per row on desktop sizes.", validators=[
+        MinValueValidator(4),
+        MaxValueValidator(8),
+    ])
+    position_shown = models.BooleanField(default=False)
+    hub_shown = models.BooleanField(default=False)
+
+    content_panels = Page.content_panels + [
+        FieldPanel('header_image'),
+        FieldPanel('intro'),
+        FieldPanel('body_intro'),
+        FieldPanel('body_description'),
+        FieldPanel('show_search_options'),
+        FieldPanel('desktop_size_items_per_row'),
+        FieldPanel('position_shown'),
+        FieldPanel('hub_shown'),
+    ]
+
+
 class MemberOwnerPage(Page):
     max_count = 1
 
@@ -30,6 +154,12 @@ class MemberOwnerPage(Page):
         FieldPanel('project_contribution_title'),
     ]
 
+
+class MemberGroupBlock(StructBlock):
+    group = PageChooserBlock(page_type="members.MemberGroupPage")
+    role = CharBlock(required=False)
+
+
 """
 This page should only be created as a child of a MemberOwnerPage!
 Its template depends on fields from the MemberOwnerPage in order
@@ -63,6 +193,7 @@ def get_context(self, request, *args, **kwargs):
         related_name="+",
         help_text="An image of the member",
     )
+    member_groups = StreamField([('member_group', MemberGroupBlock())], use_json_field=True, null=True, blank=True)
     position = models.CharField()
     location_hub = models.ForeignKey(
         'mapping_hubs.IndividualMappingHubPage',
@@ -73,7 +204,6 @@ def get_context(self, request, *args, **kwargs):
     )
     intro = RichTextField()
     on_the_web_links = StreamField(WebLinkBlock(), blank=True, use_json_field=True)
-
     
     search_fields = Page.search_fields + [
         index.SearchField('title'),
@@ -83,6 +213,7 @@ def get_context(self, request, *args, **kwargs):
 
     content_panels = Page.content_panels + [
         FieldPanel('image'),
+        FieldPanel('member_groups'),
         FieldPanel('position'),
         FieldPanel('location_hub'),
         FieldPanel('intro'),
diff --git a/app/members/templates/members/components/MembersSortOption.html b/app/members/templates/members/components/MembersSortOption.html
new file mode 100644
index 0000000..8e3320f
--- /dev/null
+++ b/app/members/templates/members/components/MembersSortOption.html
@@ -0,0 +1,4 @@
+<div class="mt-4 flex items-center w-fit h-fit" @click="hit()" x-data="{ sort: '{{sort_id}}', hit() {setSortType('{{sort_by}}')} }" x-init="if(sort == params.get('sort')) hit()">
+    <input class="checked:bg-hot-red checked:hover:bg-hot-red checked:focus:bg-hot-red" type="radio" name="sort" :id="sort" :value="sort" :checked="(params.get('sort') == sort || (!params.get('sort')) && sort == 'sort.titlea') ? 'on' : ''">
+    <label class="pl-2" :for="sort">{{sort_by}}</label>
+</div>
\ No newline at end of file
diff --git a/app/members/templates/members/components/TailwindGridSizeAssurance.html b/app/members/templates/members/components/TailwindGridSizeAssurance.html
new file mode 100644
index 0000000..09e7b65
--- /dev/null
+++ b/app/members/templates/members/components/TailwindGridSizeAssurance.html
@@ -0,0 +1,9 @@
+{% comment %}
+
+This file is just for making sure that the member_group_page's grid columns work right! 
+This ensures that all possible values for the grid column field will have its Tailwind
+class built.
+
+{% endcomment %}
+<div class="lg:grid-cols-4 lg:grid-cols-5 lg:grid-cols-6 lg:grid-cols-7 lg:grid-cols-8">
+</div>
\ No newline at end of file
diff --git a/app/members/templates/members/individual_member_page.html b/app/members/templates/members/individual_member_page.html
index ccd2c59..c090bfe 100644
--- a/app/members/templates/members/individual_member_page.html
+++ b/app/members/templates/members/individual_member_page.html
@@ -3,7 +3,7 @@
 {% load wagtailcore_tags %}
 {% load wagtailimages_tags %}
 {% load compress %}
-{% block body_class %}template-individualmappinghubpage{% endblock %}
+{% block body_class %}template-individualmemberpage{% endblock %}
 {% block extra_css %}
     {% compress css %}
     {% endcompress css %}
@@ -19,14 +19,14 @@
                 {% endif %}
             </div>
             <div class="col-span-2">
-                {% comment %} TODO: REMOVE PLACEHOLDER AND IMPLEMENT PROPER (BASICALLY REQUIRES OTHER PAGES COMPLETION) {% endcomment %}
-                <p class="text-intro font-medium">
-                    <span class="text-hot-red">Board</span>
-                    /
-                    <span class="text-hot-red">Voting Member</span>
-                    /
-                    <span class="text-hot-red">Staff</span>
-                </p>
+                {% if page.member_groups %}
+                    <p class="text-intro font-medium">
+                        {% for group in page.member_groups %}
+                            <a href="{{group.value.group.url}}" class="text-hot-red">{{group.value.role}}</a>
+                            {% if not forloop.last %} / {% endif %}
+                        {% endfor %}
+                    </p>
+                {% endif %}
                 <h1 class="text-h1 font-semibold my-2">{{page.title}}</h1>
                 <p class="text-intro font-medium my-4">
                     <span>{{page.position}}</span>
@@ -34,14 +34,14 @@ <h1 class="text-h1 font-semibold my-2">{{page.title}}</h1>
                     <a href="{{page.location_hub.url}}" class="text-hot-red">{{page.location_hub.title}}</a>
                 </p>
                 <div class="base-article-m">
-                    {{page.introduction|safe}}
+                    {{page.intro|safe}}
                 </div>
             </div>
         </div>
 
         {% comment %} ON THE WEB LINKS {% endcomment %}
         {% if page.on_the_web_links %}
-            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-8">
+            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-8 lg:gap-y-16">
                 <div></div>
                 <div class="col-span-2">
                     <h1 class="text-h2 font-bold my-2">{{page.get_parent.specific.on_the_web_title}}</h1>
diff --git a/app/members/templates/members/member_group_page.html b/app/members/templates/members/member_group_page.html
new file mode 100644
index 0000000..3910f80
--- /dev/null
+++ b/app/members/templates/members/member_group_page.html
@@ -0,0 +1,116 @@
+{% extends "base.html" %}
+{% load static %}
+{% load wagtailcore_tags %}
+{% load wagtailimages_tags %}
+{% load compress %}
+{% block body_class %}template-membergrouppage{% endblock %}
+{% block extra_css %}
+    {% compress css %}
+    {% endcompress css %}
+{% endblock extra_css %}
+
+{% block content %}
+    {% include "ui/components/PageHeaderWithBlur.html" with title=page.title subtitle=page.intro image=page.header_image %}
+
+    <div class="max-w-7xl mx-auto px-6 md:px-10 my-10" x-data="{ params: new URLSearchParams((new URL(window.location.href)).search) }">
+        <div class="max-w-3xl">
+            <div class="text-intro">
+                {{page.body_intro|safe}}
+            </div>
+            <div class="base-article-m">
+                {{page.body_description|safe}}
+            </div>
+        </div>
+
+        {% if page.show_search_options %}
+            <form class="mt-20 mb-10">
+                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+                    {% comment %} KEYWORD SEARCH {% endcomment %}
+                    <div class="bg-hot-off-white flex items-center">
+                        <input class="w-full bg-transparent border-none" placeholder="{{page.get_parent.specific.search_placeholder}}" type="text" name="keyword" :value="params.get('keyword')">
+                        {% include "ui/components/icon_svgs/SearchIcon.html" with class="text-hot-red mx-3" %}
+                    </div>
+
+                    {% comment %} COUNTRY {% endcomment %}
+                    <div class="relative" x-data="{ show: false }" @click.away="show = false">
+                        <div class="w-full h-full flex justify-between py-2 px-3 bg-hot-off-white items-center cursor-pointer" @click="show = !show">
+                            <p class="pointer-events-none">
+                                {{page.get_parent.specific.filter_by_country}}
+                            </p>
+                            {% include "ui/components/icon_svgs/LinkCaret.html" with class="rotate-90 text-hot-red" %}
+                        </div>
+                        <div class="absolute z-20 bg-hot-off-white p-4 w-full" x-show="show">
+                            <hr class="border-b-2">
+                            {% for hub in hubs %}
+                                <div class="mt-4 flex">
+                                    <label for="cat-{{forloop.counter}}">{{hub.title}}</label>
+                                    <input class="ml-auto checked:bg-hot-red checked:hover:bg-hot-red checked:focus:bg-hot-red" id="cat-{{forloop.counter}}" type="checkbox" name="{{hub.title}}" :checked="params.get('{{hub.title}}')">
+                                </div>
+                            {% endfor %}
+                        </div>
+                    </div>
+
+                    {% comment %} SORT {% endcomment %}
+                    <div class="relative" x-data="{ show: false, setSortType(text) {$refs.sorttype.innerText = text} }" @click.away="show = false">
+                        <div class="w-full h-full flex justify-between py-2 px-3 bg-hot-off-white items-center cursor-pointer" @click="show = !show">
+                            <p class="pointer-events-none" x-ref="sorttype">
+                                {{page.get_parent.specific.sort_by_titlea}}
+                            </p>
+                        {% include "ui/components/icon_svgs/LinkCaret.html" with class="rotate-90 text-hot-red" %}
+                        </div>
+                        <div class="absolute z-20 bg-hot-off-white p-4 w-full" x-show="show">
+                            <hr class="border-b-2">
+                            {% include "./components/MembersSortOption.html" with sort_by=page.get_parent.specific.sort_by_titlea sort_id="sort.titlea" %}
+                            {% include "./components/MembersSortOption.html" with sort_by=page.get_parent.specific.sort_by_titlez sort_id="sort.titlez" %}
+                        </div>
+                    </div>
+
+                    <div class="bg-hot-red text-white font-semibold">
+                        <input type="submit" value="{{page.get_parent.specific.search_button_text}}" class="bg-transparent w-full h-full cursor-pointer py-2">
+                    </div>
+                </div>
+            </form>
+        {% endif %}
+
+        {% comment %} MEMBERS LIST {% endcomment %}
+        <div class="grid grid-cols-1 md:grid-cols-3 lg:grid-cols-{{page.desktop_size_items_per_row}} gap-8 lg:gap-y-16 mb-10" id="members-list">
+            {% for member in members %}
+                {% include "ui/components/members/MemberPreviewBlock.html" with member=member position_shown=page.position_shown hub_shown=page.hub_shown %}
+            {% endfor %}
+        </div>
+        <p class="text-center mt-10 mb-20" id="next-member" class="{% if not members.has_next %}hidden{% endif %}">
+            {% if members.has_next %}
+                    {% comment %} <a href="?page={{ projects.next_page_number }}"></a> {% endcomment %}
+                    <button hx-get="?page={{ members.next_page_number }}"
+                        hx-trigger="click"
+                        hx-select="#members-list, #next-project"
+                        hx-swap="beforeend"
+                        hx-select-oob="#members-list:beforeend, #next-member:outerHTML"
+                    >
+                        <span class="border-b-hot-red border-b-2 pb-1 font-medium mr-4 text-intro">
+                            {{page.get_parent.specific.load_more_text}} {{page.title}}
+                        </span>
+                        {% include "ui/components/icon_svgs/LinkCaret.html" with class="rotate-90 text-hot-red" %}
+                    </button>
+            {% endif %}
+        </p>
+
+        {% comment %} BOTTOM AREA {% endcomment %}
+        <div class="grid grid-cols-1 md:grid-cols-2 text-white gap-8 mt-20">
+            {% for group in groups %}
+                {% if forloop.counter0|divisibleby:2 %}
+                    <div>
+                        {% include "ui/components/dogear_boxes/DogearRed.html" with title=group.title linktext=page.get_parent.specific.view_all_text|add:' '|add:group.title linkurl=group.url %}
+                    </div>
+                    {% else %}
+                    <div>
+                        {% include "ui/components/dogear_boxes/DogearBlack.html" with title=group.title linktext=page.get_parent.specific.view_all_text|add:' '|add:group.title linkurl=group.url %}
+                    </div>
+                {% endif %}
+            {% endfor %}
+        </div>
+        <div class="my-10">
+            {% include "ui/components/FooterBannerWithTextAndLink.html" with text=page.get_parent.specific.footer_box_title url=page.get_parent.specific.footer_box_button_link buttontext=page.get_parent.specific.footer_box_button_text description=page.get_parent.specific.footer_box_description %}
+        </div>
+    </div>
+{% endblock %}
diff --git a/app/news/models.py b/app/news/models.py
index 4b65d47..c0887ae 100644
--- a/app/news/models.py
+++ b/app/news/models.py
@@ -21,6 +21,9 @@ def get_context(self, request, *args, **kwargs):
 
         keyword = request.GET.get('keyword', '')
         news_list = IndividualNewsPage.objects.live().filter(locale=context['page'].locale)
+        
+        if keyword:
+            news_list = news_list.search(keyword).get_queryset()
 
         categories = NewsCategory.objects.all()
         tags = [x[4:] for x in request.GET.keys() if x.startswith("tag.")]
@@ -28,13 +31,13 @@ def get_context(self, request, *args, **kwargs):
         for category in categories:
             if request.GET.get(str(category), ''):
                 query = query | Q(categories=category)
+        news_list = news_list.filter(query).distinct()
+        
+        query = Q()
         for tag in tags:
             query = query | Q(tags__name=tag)
         news_list = news_list.filter(query).distinct()
 
-        if keyword:
-            news_list = news_list.search(keyword).get_queryset()
-
         match request.GET.get('sort', ''):
             case 'sort.new':
                 news_list = news_list.order_by('-date')
@@ -184,8 +187,8 @@ class IndividualNewsPage(Page):
     search_fields = Page.search_fields + [
         index.SearchField('title'),
         index.SearchField('intro'),
-        index.FilterField('newscategory_id'),  # the console warns you about this but if you don't have this then category search doesn't work
-        index.FilterField('name'),
+        # index.FilterField('newscategory_id'),  # the console warns you about this but if you don't have this then category search doesn't work
+        # index.FilterField('name'),
         index.SearchField('search_description'),
     ]
 
diff --git a/app/projects/models.py b/app/projects/models.py
index 8ab849b..ea22cf0 100644
--- a/app/projects/models.py
+++ b/app/projects/models.py
@@ -9,7 +9,6 @@
 from wagtail.blocks import CharBlock, StreamBlock, StructBlock, URLBlock, RichTextBlock, PageChooserBlock
 from wagtail.search import index
 from modelcluster.fields import ParentalKey, ParentalManyToManyField
-from app.core.models import HotSearchablePage
 
 
 """
diff --git a/app/ui/templates/ui/components/FooterBannerWithTextAndLink.html b/app/ui/templates/ui/components/FooterBannerWithTextAndLink.html
index b93d3e9..7b9cdf1 100644
--- a/app/ui/templates/ui/components/FooterBannerWithTextAndLink.html
+++ b/app/ui/templates/ui/components/FooterBannerWithTextAndLink.html
@@ -10,6 +10,11 @@
         <h1 class="text-h2 font-bold mb-8">
             {{ text }}
         </h1>
+        {% if description %}
+            <div class="my-6">
+                {{description|safe}}
+            </div>
+        {% endif %}
         <a href="{{ url }}">
             {% include "components/branded_elements/button.html" with text=buttontext %}
         </a>
diff --git a/app/ui/templates/ui/components/members/MemberPreviewBlock.html b/app/ui/templates/ui/components/members/MemberPreviewBlock.html
new file mode 100644
index 0000000..a1a5bbd
--- /dev/null
+++ b/app/ui/templates/ui/components/members/MemberPreviewBlock.html
@@ -0,0 +1,24 @@
+{% load wagtailimages_tags %}
+
+<div class="grid grid-cols-3 gap-4 md:block">
+    <a href="{{member.url}}">
+        {% image member.image original class="aspect-[4/5] object-cover w-full col-span-1" %}
+    </a>
+    <div class="col-span-2 flex md:block flex-col justify-center">
+        <a href="{{member.url}}">
+        <h2 class="text-intro md:text-h5 font-bold leading-snug mt-2 mb-1">{{member.title}}</h2>
+        {% if position_shown %}
+            <p class="text-small mt-1">
+                {{member.position}}
+            </p>
+        {% endif %}
+        </a>
+        {% if hub_shown and member.location_hub %}
+            <p class="mt-0.5">
+                <a href="{{member.location_hub.url}}" class="text-hot-red text-small">
+                    {{member.location_hub.title}}
+                </a>
+            </p>
+        {% endif %}
+    </div>
+</div>
\ No newline at end of file