diff --git a/web/src/pages/Budgeting.vue b/web/src/pages/Budgeting.vue
index 684d51b..bf00f8c 100644
--- a/web/src/pages/Budgeting.vue
+++ b/web/src/pages/Budgeting.vue
@@ -15,13 +15,15 @@ const budgetsStore = useBudgetsStore();
 const CurrentBudgetID = computed(() => budgetsStore.CurrentBudgetID);
 
 const accountStore = useAccountStore();
-const categoriesForMonth = accountStore.CategoriesForMonth;
-const Categories = computed(() => {
-    return [...categoriesForMonth(selected.value.Year, selected.value.Month)];
-});
-const hiddenCategoriesForMonth = accountStore.HiddenCategoriesForMonth;
-const HiddenCategories = computed(() => {
-    return [...hiddenCategoriesForMonth(selected.value.Year, selected.value.Month)];
+const categoriesForMonth = accountStore.CategoriesForMonthAndGroup;
+
+function GetCategories(group : string) {
+    return [...categoriesForMonth(selected.value.Year, selected.value.Month, group)];
+};
+
+const groupsForMonth = accountStore.CategoryGroupsForMonth;
+const GroupsForMonth = computed(() => {
+    return [...groupsForMonth(selected.value.Year, selected.value.Month)];
 });
 
 
@@ -67,7 +69,6 @@ onMounted(() => {
     </div>
     <table class="container col-lg-12" id="content">
         <tr>
-            <th>Group</th>
             <th>Category</th>
             <th></th>
             <th></th>
@@ -76,41 +77,25 @@ onMounted(() => {
             <th>Activity</th>
             <th>Available</th>
         </tr>
-        <tr v-for="category in Categories">
-            <td>{{ category.Group }}</td>
-            <td>{{ category.Name }}</td>
-            <td></td>
-            <td></td>
-            <td class="text-right">
-                <Currency :value="category.AvailableLastMonth" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Assigned" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Activity" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Available" />
-            </td>
-        </tr>
-        <tr v-for="category in HiddenCategories">
-            <td>{{ category.Group }}</td>
-            <td>{{ category.Name }}</td>
-            <td></td>
-            <td></td>
-            <td class="text-right">
-                <Currency :value="category.AvailableLastMonth" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Assigned" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Activity" />
-            </td>
-            <td class="text-right">
-                <Currency :value="category.Available" />
-            </td>
-        </tr>
+        <tbody v-for="group in GroupsForMonth">
+            <p class="text-lg font-bold">{{ group }}</p>
+            <tr v-for="category in GetCategories(group)">
+                <td>{{ category.Name }}</td>
+                <td></td>
+                <td></td>
+                <td class="text-right">
+                    <Currency :value="category.AvailableLastMonth" />
+                </td>
+                <td class="text-right">
+                    <Currency :value="category.Assigned" />
+                </td>
+                <td class="text-right">
+                    <Currency :value="category.Activity" />
+                </td>
+                <td class="text-right">
+                    <Currency :value="category.Available" />
+                </td>
+            </tr>
+        </tbody>
     </table>
 </template>
diff --git a/web/src/stores/budget-account.ts b/web/src/stores/budget-account.ts
index a265cda..be57f7d 100644
--- a/web/src/stores/budget-account.ts
+++ b/web/src/stores/budget-account.ts
@@ -54,17 +54,29 @@ export const useAccountStore = defineStore("budget/account", {
         AccountsList(state) {
             return [...state.Accounts.values()];
         },
-        CategoriesForMonth: (state) => (year: number, month: number) => {
+        AllCategoriesForMonth: (state) => (year: number, month: number) => {
             const yearMap = state.Months.get(year);
             const monthMap = yearMap?.get(month);
-            console.log("MTH", monthMap)
-            return [...monthMap?.values() || []].filter(x => x.Group != "Hidden Categories");
+            return [...monthMap?.values() || []];
         },
-        HiddenCategoriesForMonth: (state) => (year: number, month: number) => {
-            const yearMap = state.Months.get(year);
-            const monthMap = yearMap?.get(month);
-            console.log("MTH", monthMap)
-            return [...monthMap?.values() || []].filter(x => x.Group == "Hidden Categories");
+        CategoryGroupsForMonth(state) {
+            return (year: number, month: number) => {
+                const categories = this.AllCategoriesForMonth(year, month);
+                const categoryGroups = [];
+                let prev = undefined;
+                for (const category of categories) {
+                    if(category.Group != prev)
+                        categoryGroups.push(category.Group);
+                    prev = category.Group;
+                }
+                return categoryGroups;
+            }
+        },
+        CategoriesForMonthAndGroup(state) {
+            return (year: number, month: number, group : string) => {
+                const categories = this.AllCategoriesForMonth(year, month);
+                return categories.filter(x => x.Group == group);
+            }
         },
         CurrentAccount(state): Account | undefined {
             if (state.CurrentAccountID == null)