diff --git a/addon/components/modals/create-food-truck.hbs b/addon/components/modals/create-food-truck.hbs
index 3332b6b6..cfc3e543 100644
--- a/addon/components/modals/create-food-truck.hbs
+++ b/addon/components/modals/create-food-truck.hbs
@@ -1,11 +1,11 @@
 <Modal::Default @modalIsOpened={{@modalIsOpened}} @options={{@options}} @confirm={{@onConfirm}} @decline={{@onDecline}}>
     <div class="modal-body-container">
-        <InputGroup @name="Assign Food Truck Vehicle">
+        <InputGroup @name="Vehicle">
             <ModelSelect
                 @modelName="vehicle"
                 @selectedItemComponent={{component "select-option/vehicle" compact=true}}
                 @selectedModel={{@options.foodTruck.vehicle}}
-                @placeholder="Assign Food Truck Vehicle"
+                @placeholder="Select the vehicle for this truck"
                 @triggerClass="form-select form-input"
                 @infiniteScroll={{false}}
                 @renderInPlace={{true}}
@@ -19,7 +19,7 @@
             <ModelSelect
                 @modelName="service-area"
                 @selectedModel={{@options.foodTruck.service_area}}
-                @placeholder="Assign Food Truck to Service Area"
+                @placeholder="Assign the truck to a service area"
                 @triggerClass="form-select form-input"
                 @infiniteScroll={{false}}
                 @renderInPlace={{true}}
@@ -36,7 +36,7 @@
                     @modelName="zone"
                     @selectedModel={{@options.foodTruck.zone}}
                     @query={{hash service_area_uuid=@options.foodTruck.service_area.id}}
-                    @placeholder="Assign Food Truck to Zone"
+                    @placeholder="Assign the truck to a zone"
                     @triggerClass="form-select form-input"
                     @infiniteScroll={{false}}
                     @renderInPlace={{true}}
@@ -48,11 +48,11 @@
                 </ModelSelect>
             </InputGroup>
         {{/if}}
-        <InputGroup @name="Food Truck Status">
+        <InputGroup @name="Truck Status">
             <Select
                 class="w-full"
                 @value={{@options.foodTruck.status}}
-                @placeholder="Select food truck status"
+                @placeholder="Select truck status"
                 @options={{@options.statusOptions}}
                 @onSelect={{fn (mut @options.foodTruck.status)}}
                 @humanize={{true}}
diff --git a/addon/components/select-option/store.hbs b/addon/components/select-option/store.hbs
new file mode 100644
index 00000000..20fe3866
--- /dev/null
+++ b/addon/components/select-option/store.hbs
@@ -0,0 +1,12 @@
+<Resource::SelectOption
+    @option={{or @option @model @store}}
+    @resourceType="store"
+    @compact={{@compact}}
+    @title={{@title}}
+    @details={{@details}}
+    @photo={{@photo}}
+    @fallbackPhoto={{@fallbackPhoto}}
+    @icon={{@icon}}
+    @shape={{@shape}}
+    ...attributes
+/>
diff --git a/addon/components/store-selector.hbs b/addon/components/store-selector.hbs
index 4b349eac..85d5f9f2 100644
--- a/addon/components/store-selector.hbs
+++ b/addon/components/store-selector.hbs
@@ -1,17 +1,23 @@
-{{#if @activeStore}}
-    <div class={{@wrapperClass}} {{did-insert this.setupTrigger}} {{will-destroy this.close}} ...attributes>
-        <Button
-            title={{@activeStore.name}}
-            class="{{concat "w-full " @buttonClass}} {{if this.isOpen "dd-is-open"}}"
-            @wrapperClass={{concat "w-full " @buttonWrapperClass}}
-            @size="xs"
-            @type="primary"
-            @icon="store"
-            @iconSize="sm"
-            @text={{@activeStore.name}}
-            @textClass="truncate"
-            @onClick={{this.toggle}}
-        />
+{{#if this.activeContext}}
+    <div class="storefront-switcher {{@wrapperClass}}" {{did-insert this.setupTrigger}} {{will-destroy this.close}} ...attributes>
+        <button
+            type="button"
+            class="storefront-switcher__trigger storefront-switcher__trigger--{{if this.isNetworkContext 'network' 'store'}} {{if this.isOpen 'is-open'}} {{@buttonClass}}"
+            title={{concat this.contextLabel ": " this.activeContext.name}}
+            aria-haspopup="menu"
+            aria-expanded={{if this.isOpen "true" "false"}}
+            data-test-store-selector-trigger
+            data-context={{if this.isNetworkContext "network" "store"}}
+            {{on "click" this.toggle}}
+        >
+            <span class="storefront-switcher__icon"><FaIcon @icon={{if this.isNetworkContext "network-wired" "store"}} @size="sm" /></span>
+            <span class="storefront-switcher__name">{{this.activeContext.name}}</span>
+            <span class="storefront-switcher__kind">{{this.contextLabel}}</span>
+            <span class="storefront-switcher__caret"><FaIcon @icon="chevron-down" @size="xs" /></span>
+            {{#if this.badge}}
+                <span class="storefront-switcher__badge" title={{t "storefront.component.store-selector.badge-title" count=this.badge}} data-test-store-selector-badge>{{this.badge}}</span>
+            {{/if}}
+        </button>
     </div>
 {{else if (has-block)}}
     {{yield}}
diff --git a/addon/components/store-selector.js b/addon/components/store-selector.js
index bed362ec..eb43e141 100644
--- a/addon/components/store-selector.js
+++ b/addon/components/store-selector.js
@@ -3,6 +3,13 @@ import { tracked } from '@glimmer/tracking';
 import { action } from '@ember/object';
 import { inject as service } from '@ember/service';
 
+/**
+ * The context switcher at the top of the sidebar: stores and networks as peers. The
+ * chosen one owns the navigation, the dashboard and the data scope.
+ *
+ * The menu is built in the DOM and positioned fixed so the sidebar's overflow clipping
+ * cannot cut it off.
+ */
 export default class StoreSelectorComponent extends Component {
     @service intl;
     @tracked isOpen = false;
@@ -15,10 +22,44 @@ export default class StoreSelectorComponent extends Component {
         return Array.from(this.args.stores ?? []);
     }
 
+    get networks() {
+        return Array.from(this.args.networks ?? []);
+    }
+
     get hasStores() {
         return this.stores.length > 0;
     }
 
+    get hasNetworks() {
+        return this.networks.length > 0;
+    }
+
+    /**
+     * The networks group appears once there is something to put in it: a user with one
+     * store and no networks sees the plain store menu.
+     */
+    get showNetworks() {
+        return this.hasNetworks || typeof this.args.onCreateNetwork === 'function';
+    }
+
+    get isNetworkContext() {
+        return Boolean(this.args.activeNetwork);
+    }
+
+    get activeContext() {
+        return this.args.activeNetwork ?? this.args.activeStore;
+    }
+
+    get contextLabel() {
+        return this.intl.t(`storefront.component.store-selector.${this.isNetworkContext ? 'network' : 'store'}`);
+    }
+
+    get badge() {
+        const badge = Number(this.args.badge ?? 0);
+
+        return Number.isFinite(badge) && badge > 0 ? badge : null;
+    }
+
     willDestroy() {
         super.willDestroy(...arguments);
         this.close();
@@ -64,68 +105,160 @@ export default class StoreSelectorComponent extends Component {
     }
 
     createMenuElement() {
+        const t = (key) => this.intl.t(`storefront.component.store-selector.${key}`);
         const menu = document.createElement('div');
         menu.setAttribute('role', 'menu');
-        menu.className = 'store-selector-dropdown-menu next-dd-menu py-1';
-        menu.style.position = 'fixed';
-        menu.style.zIndex = '900';
-        menu.style.margin = '0';
-        menu.style.height = 'auto';
-        menu.style.minHeight = '0';
-        menu.style.maxHeight = 'calc(100vh - 16px)';
-        menu.style.overflowX = 'hidden';
-        menu.style.overflowY = 'visible';
-
-        const storeList = document.createElement('div');
-        storeList.setAttribute('role', 'group');
-        storeList.className = 'px-1';
-        storeList.style.maxHeight = '18rem';
-        storeList.style.overflowY = 'auto';
+        menu.className = 'store-selector-dropdown-menu storefront-switcher-menu';
+        menu.setAttribute('data-theme', document.body.dataset.theme ?? 'light');
+
+        const storeList = this.createGroup('stores', this.showNetworks ? t('stores') : null);
 
         if (this.hasStores) {
             this.stores.forEach((store) => {
-                storeList.appendChild(this.createMenuItem(store?.name || '-', () => this.onSwitchStore(store)));
+                storeList.appendChild(
+                    this.createMenuItem({
+                        label: store?.name || '—',
+                        meta: store?.currency ?? null,
+                        icon: 'store',
+                        tone: 'store',
+                        isActive: !this.isNetworkContext && store?.id === this.args.activeStore?.id,
+                        onClick: () => this.onSwitchStore(store),
+                    })
+                );
             });
         } else {
-            const emptyItem = document.createElement('div');
-            emptyItem.className = 'next-dd-item';
-            emptyItem.setAttribute('role', 'menuitem');
-            emptyItem.textContent = this.intl.t('storefront.component.store-selector.no-stores');
-            storeList.appendChild(emptyItem);
+            storeList.appendChild(this.createEmptyItem(t('no-stores')));
         }
 
-        const footer = document.createElement('div');
-        footer.className = 'px-1';
+        menu.appendChild(storeList);
+
+        if (this.showNetworks) {
+            const networkList = this.createGroup('networks', t('networks'));
+
+            if (this.hasNetworks) {
+                this.networks.forEach((network) => {
+                    const count = network?.stores_count ?? network?.stores?.length ?? null;
+
+                    networkList.appendChild(
+                        this.createMenuItem({
+                            label: network?.name || '—',
+                            meta: count === null ? null : this.intl.t('storefront.networks.card.stores-count', { count }),
+                            icon: 'network-wired',
+                            tone: 'network',
+                            isActive: this.isNetworkContext && network?.id === this.args.activeNetwork?.id,
+                            onClick: () => this.onSwitchNetwork(network),
+                        })
+                    );
+                });
+            } else {
+                networkList.appendChild(this.createEmptyItem(t('no-networks')));
+            }
+
+            menu.appendChild(networkList);
+        }
+
+        const footer = this.createGroup('actions', null);
+        footer.classList.add('storefront-switcher-menu__footer');
 
-        const separator = document.createElement('div');
-        separator.className = 'next-dd-menu-seperator';
+        if (typeof this.args.onCreateStore === 'function') {
+            footer.appendChild(this.createMenuItem({ label: t('new-store'), icon: 'plus', tone: 'muted', onClick: () => this.onCreateStore() }));
+        }
 
-        const footerGroup = document.createElement('div');
-        footerGroup.setAttribute('role', 'group');
-        footerGroup.className = 'px-1';
-        footerGroup.appendChild(this.createMenuItem(this.intl.t('storefront.component.store-selector.create-storefront'), () => this.onCreateStore()));
+        if (typeof this.args.onCreateNetwork === 'function') {
+            footer.appendChild(this.createMenuItem({ label: t('new-network'), icon: 'plus', tone: 'muted', onClick: () => this.onCreateNetwork() }));
+        }
 
-        footer.append(separator, footerGroup);
-        menu.append(storeList, footer);
+        if (footer.childElementCount) {
+            menu.appendChild(footer);
+        }
 
         return menu;
     }
 
-    createMenuItem(label, callback) {
-        const item = document.createElement('a');
-        item.href = 'javascript:;';
-        item.className = 'next-dd-item';
+    createGroup(name, heading) {
+        const group = document.createElement('div');
+        group.setAttribute('role', 'group');
+        group.setAttribute(`data-test-store-selector-${name}`, '');
+        group.className = 'storefront-switcher-menu__group';
+
+        if (heading) {
+            const head = document.createElement('div');
+            head.className = 'storefront-switcher-menu__head';
+            head.setAttribute('role', 'presentation');
+            head.textContent = heading;
+            group.appendChild(head);
+        }
+
+        return group;
+    }
+
+    createMenuItem({ label, meta = null, icon, tone = 'store', isActive = false, onClick }) {
+        const item = document.createElement('button');
+        item.type = 'button';
+        item.className = `storefront-switcher-menu__item${isActive ? ' is-active' : ''}`;
         item.setAttribute('role', 'menuitem');
-        item.textContent = label;
+
+        if (isActive) {
+            item.setAttribute('aria-current', 'true');
+        }
+
+        const tile = document.createElement('span');
+        tile.className = `storefront-switcher-tile storefront-switcher-tile--${tone}`;
+        tile.innerHTML = this.iconMarkup(icon);
+
+        const text = document.createElement('span');
+        text.className = 'storefront-switcher-menu__label';
+        text.textContent = label;
+
+        item.append(tile, text);
+
+        if (meta) {
+            const metaElement = document.createElement('span');
+            metaElement.className = 'storefront-switcher-menu__meta';
+            metaElement.textContent = meta;
+            item.appendChild(metaElement);
+        }
+
+        if (isActive) {
+            const check = document.createElement('span');
+            check.className = 'storefront-switcher-menu__check';
+            check.innerHTML = this.iconMarkup('check');
+            item.appendChild(check);
+        }
+
         item.addEventListener('click', (event) => {
             event.preventDefault();
             event.stopPropagation();
-            callback();
+            onClick();
         });
 
         return item;
     }
 
+    createEmptyItem(text) {
+        const item = document.createElement('div');
+        item.className = 'storefront-switcher-menu__empty';
+        item.setAttribute('role', 'presentation');
+        item.textContent = text;
+
+        return item;
+    }
+
+    /**
+     * Inline SVG for the few icons the menu needs; the menu lives outside the component tree,
+     * so it cannot use the FaIcon component.
+     */
+    iconMarkup(name) {
+        const paths = {
+            store: '<path d="M3 9l1-5h16l1 5M3 9v11h18V9M3 9h18M9 20v-6h6v6"/>',
+            'network-wired': '<rect x="9" y="2" width="6" height="5" rx="1"/><rect x="2" y="17" width="6" height="5" rx="1"/><rect x="16" y="17" width="6" height="5" rx="1"/><path d="M12 7v5M5 17v-3h14v3"/>',
+            plus: '<path d="M12 5v14M5 12h14"/>',
+            check: '<path d="M5 12l5 5L20 7"/>',
+        };
+
+        return `<svg viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">${paths[name] ?? ''}</svg>`;
+    }
+
     addListeners() {
         this.addManagedListener(document, 'mousedown', this.handleDocumentMouseDown, true);
         this.addManagedListener(document, 'keydown', this.handleDocumentKeydown);
@@ -175,16 +308,16 @@ export default class StoreSelectorComponent extends Component {
 
         const rect = this.triggerElement.getBoundingClientRect();
         const viewportPadding = 8;
-        const width = Math.max(rect.width, 220);
+        const width = Math.max(rect.width, 260);
         const maxLeft = window.innerWidth - width - viewportPadding;
         const left = Math.max(viewportPadding, Math.min(rect.left, maxLeft));
-        let top = rect.bottom + 4;
+        let top = rect.bottom + 6;
 
         this.menuElement.style.width = `${width}px`;
 
         const menuHeight = this.menuElement.offsetHeight;
-        if (top + menuHeight > window.innerHeight - viewportPadding && rect.top - menuHeight - 4 > viewportPadding) {
-            top = rect.top - menuHeight - 4;
+        if (top + menuHeight > window.innerHeight - viewportPadding && rect.top - menuHeight - 6 > viewportPadding) {
+            top = rect.top - menuHeight - 6;
         }
 
         this.menuElement.style.left = `${left}px`;
@@ -192,22 +325,22 @@ export default class StoreSelectorComponent extends Component {
     };
 
     @action onSwitchStore(store) {
-        const { onSwitchStore } = this.args;
-
-        if (typeof onSwitchStore === 'function') {
-            onSwitchStore(store);
-        }
+        this.args.onSwitchStore?.(store);
+        this.close();
+    }
 
+    @action onSwitchNetwork(network) {
+        this.args.onSwitchNetwork?.(network);
         this.close();
     }
 
     @action onCreateStore() {
-        const { onCreateStore } = this.args;
-
-        if (typeof onCreateStore === 'function') {
-            onCreateStore();
-        }
+        this.args.onCreateStore?.();
+        this.close();
+    }
 
+    @action onCreateNetwork() {
+        this.args.onCreateNetwork?.();
         this.close();
     }
 }
diff --git a/addon/components/storefront/catalog/card.hbs b/addon/components/storefront/catalog/card.hbs
new file mode 100644
index 00000000..acd68751
--- /dev/null
+++ b/addon/components/storefront/catalog/card.hbs
@@ -0,0 +1,53 @@
+<Layout::Resource::Card class="storefront-card storefront-catalog-card {{if this.isDraft 'is-draft'}}" data-test-storefront-catalog-card ...attributes as |Card|>
+    <Card.header class={{@headerClass}}>
+        <RegistryYield @registry="storefront:component:catalog:card:header:start" as |RegistryComponent|>
+            <RegistryComponent @catalog={{this.catalog}} @resource={{this.catalog}} />
+        </RegistryYield>
+        <div class="storefront-card__title">
+            {{#if @onEdit}}
+                <a href="javascript:;" class="storefront-card__title-text" {{on "click" (fn @onEdit this.catalog)}} data-test-catalog-name>{{n-a this.catalog.name}}</a>
+            {{else}}
+                <span class="storefront-card__title-text" data-test-catalog-name>{{n-a this.catalog.name}}</span>
+            {{/if}}
+            <Badge @status={{this.status}} @size="xs" @hideStatusDot={{true}} data-test-catalog-status />
+        </div>
+        <div class="storefront-card__subtitle">{{n-a this.catalog.description (t "storefront.catalogs.card.no-description")}}</div>
+        <RegistryYield @registry="storefront:component:catalog:card:header:end" as |RegistryComponent|>
+            <RegistryComponent @catalog={{this.catalog}} @resource={{this.catalog}} />
+        </RegistryYield>
+    </Card.header>
+    <Card.body class="storefront-card__body {{@bodyClass}}">
+        {{#if this.isEmpty}}
+            <div class="storefront-card__empty" data-test-catalog-empty>{{t "storefront.catalogs.card.no-categories"}}</div>
+        {{else}}
+            <div class="storefront-card__chips" data-test-catalog-categories>
+                {{#each this.categorySummaries as |category|}}
+                    <span class="storefront-card__chip" data-test-catalog-category>{{category.name}} <span class="storefront-card__chip-count">{{category.count}}</span></span>
+                {{/each}}
+            </div>
+        {{/if}}
+        <Storefront::HoursStrip @hours={{this.hours}} class="storefront-card__hours" />
+    </Card.body>
+    <Card.footer class={{@footerClass}}>
+        <RegistryYield @registry="storefront:component:catalog:card:footer:start" as |RegistryComponent|>
+            <RegistryComponent @catalog={{this.catalog}} @resource={{this.catalog}} />
+        </RegistryYield>
+        <div class="storefront-card__actions">
+            <span class="storefront-card__count" data-test-catalog-products-count>{{t "storefront.catalogs.card.products-count" count=this.productsCount}}</span>
+            <div class="storefront-card__buttons">
+                {{#if @onEdit}}
+                    <Button @icon="pencil" @size="xs" @helpText={{t "storefront.common.edit"}} @onClick={{fn @onEdit this.catalog}} @permission="storefront update catalog" data-test-catalog-edit />
+                {{/if}}
+                {{#if @onDelete}}
+                    <Button @icon="trash" @size="xs" @type="danger" @helpText={{t "storefront.common.delete"}} @onClick={{fn @onDelete this.catalog}} @permission="storefront delete catalog" data-test-catalog-delete />
+                {{/if}}
+            </div>
+        </div>
+        <div class="storefront-card__meta">
+            <span>{{t "storefront.common.last-modified"}}: {{this.catalog.updatedAgo}}</span>
+        </div>
+        <RegistryYield @registry="storefront:component:catalog:card:footer:end" as |RegistryComponent|>
+            <RegistryComponent @catalog={{this.catalog}} @resource={{this.catalog}} />
+        </RegistryYield>
+    </Card.footer>
+</Layout::Resource::Card>
diff --git a/addon/components/storefront/catalog/card.js b/addon/components/storefront/catalog/card.js
new file mode 100644
index 00000000..9cc4721d
--- /dev/null
+++ b/addon/components/storefront/catalog/card.js
@@ -0,0 +1,48 @@
+import Component from '@glimmer/component';
+import { get } from '@ember/object';
+
+/**
+ * A catalog on the shared card anatomy: name and status in the header, the
+ * categories it contains with their product counts in the body, its hours
+ * strip, and the status, actions and counts in the footer.
+ */
+export default class StorefrontCatalogCardComponent extends Component {
+    get catalog() {
+        return this.args.catalog ?? this.args.resource;
+    }
+
+    get categories() {
+        const categories = get(this.catalog, 'categories');
+
+        return categories ? categories.slice() : [];
+    }
+
+    get categorySummaries() {
+        return this.categories.map((category) => ({
+            name: get(category, 'name'),
+            count: (get(category, 'products') ?? []).length,
+        }));
+    }
+
+    get productsCount() {
+        return this.categorySummaries.reduce((total, category) => total + category.count, 0);
+    }
+
+    get hours() {
+        const hours = get(this.catalog, 'hours');
+
+        return hours ? hours.slice() : [];
+    }
+
+    get status() {
+        return get(this.catalog, 'status') ?? 'draft';
+    }
+
+    get isDraft() {
+        return this.status === 'draft';
+    }
+
+    get isEmpty() {
+        return this.categories.length === 0;
+    }
+}
diff --git a/addon/components/storefront/hours-strip.hbs b/addon/components/storefront/hours-strip.hbs
new file mode 100644
index 00000000..e9b01a40
--- /dev/null
+++ b/addon/components/storefront/hours-strip.hbs
@@ -0,0 +1,8 @@
+<div class="storefront-hours-strip {{@class}}" role="img" aria-label="{{this.openDays}} of 7 days" data-test-hours-strip ...attributes>
+    {{#each this.days as |day|}}
+        <span class="storefront-hours-strip__day {{if day.open 'is-open' 'is-closed'}}" title={{day.title}} data-test-hours-day={{day.key}} data-open={{if day.open "true" "false"}}>
+            <span class="storefront-hours-strip__label">{{day.label}}</span>
+            <span class="storefront-hours-strip__bar"></span>
+        </span>
+    {{/each}}
+</div>
diff --git a/addon/components/storefront/hours-strip.js b/addon/components/storefront/hours-strip.js
new file mode 100644
index 00000000..8f7e3c41
--- /dev/null
+++ b/addon/components/storefront/hours-strip.js
@@ -0,0 +1,34 @@
+import Component from '@glimmer/component';
+
+const DAYS = ['monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'];
+
+/**
+ * A seven-cell strip that shows which days a schedule covers, from a list of
+ * hour records (`day_of_week`, `start`, `end`) the way catalog, store and
+ * product hours are stored. Each cell carries the day's hours as its title.
+ */
+export default class StorefrontHoursStripComponent extends Component {
+    get days() {
+        const hours = (this.args.hours ?? []).filter(Boolean);
+
+        return DAYS.map((day) => {
+            const matches = hours.filter((hour) =>
+                String(hour.day_of_week ?? '')
+                    .toLowerCase()
+                    .startsWith(day.slice(0, 3))
+            );
+            const ranges = matches.map((hour) => [hour.start, hour.end].filter(Boolean).join(' to ')).filter(Boolean);
+
+            return {
+                key: day,
+                label: day.charAt(0).toUpperCase() + day.slice(1, 3),
+                open: matches.length > 0,
+                title: ranges.length ? `${day.charAt(0).toUpperCase() + day.slice(1)}: ${ranges.join(', ')}` : `${day.charAt(0).toUpperCase() + day.slice(1)}: closed`,
+            };
+        });
+    }
+
+    get openDays() {
+        return this.days.filter((day) => day.open).length;
+    }
+}
diff --git a/addon/components/storefront/network/card.hbs b/addon/components/storefront/network/card.hbs
new file mode 100644
index 00000000..c0350f59
--- /dev/null
+++ b/addon/components/storefront/network/card.hbs
@@ -0,0 +1,44 @@
+<Layout::Resource::Card class="storefront-card storefront-network-card" data-test-storefront-network-card ...attributes as |Card|>
+    <Card.header class={{@headerClass}}>
+        <RegistryYield @registry="storefront:component:network:card:header:start" as |RegistryComponent|>
+            <RegistryComponent @network={{this.network}} @resource={{this.network}} />
+        </RegistryYield>
+        <div class="storefront-card__title">
+            {{#if @onOpen}}
+                <a href="javascript:;" class="storefront-card__title-text" {{on "click" (fn @onOpen this.network)}} data-test-network-name>{{n-a this.network.name}}</a>
+            {{else}}
+                <span class="storefront-card__title-text" data-test-network-name>{{n-a this.network.name}}</span>
+            {{/if}}
+            <FaIcon @icon="circle" @size="xs" class="storefront-card__indicator {{if this.isOnline 'text-green-500' 'text-gray-400'}}" title={{if this.isOnline (t "storefront.common.online") (t "storefront.common.offline")}} data-test-network-indicator />
+        </div>
+        <div class="storefront-card__subtitle">{{n-a this.network.currency}} · {{t "storefront.networks.card.stores-count" count=this.storesCount}}</div>
+        <RegistryYield @registry="storefront:component:network:card:header:end" as |RegistryComponent|>
+            <RegistryComponent @network={{this.network}} @resource={{this.network}} />
+        </RegistryYield>
+    </Card.header>
+    <Card.body class="storefront-card__media-body storefront-network-card__backdrop {{@bodyClass}}" {{background-url this.network.backdrop_url overlay=true}}>
+        <Image src={{this.network.logo_url}} @fallbackSrc={{config "defaultValues.placeholderImage"}} alt={{n-a this.network.name ""}} class="storefront-network-card__logo" data-test-network-logo />
+    </Card.body>
+    <Card.footer class={{@footerClass}}>
+        <RegistryYield @registry="storefront:component:network:card:footer:start" as |RegistryComponent|>
+            <RegistryComponent @network={{this.network}} @resource={{this.network}} />
+        </RegistryYield>
+        <div class="storefront-card__actions">
+            <Badge @status={{if this.isOnline "online" "offline"}} @text={{if this.isOnline (t "storefront.common.online") (t "storefront.common.offline")}} @size="xs" data-test-network-status />
+            <div class="storefront-card__buttons">
+                {{#if @onOpen}}
+                    <Button @icon="network-wired" @size="xs" @helpText={{t "storefront.networks.index.manage-network"}} @onClick={{fn @onOpen this.network}} @permission="storefront view network" data-test-network-open />
+                {{/if}}
+                {{#if @onInvite}}
+                    <Button @icon="envelope-open-text" @size="xs" @helpText={{t "storefront.networks.index.send-invite"}} @onClick={{fn @onInvite this.network}} @permission="storefront update network" data-test-network-invite />
+                {{/if}}
+                {{#if @onDelete}}
+                    <Button @icon="trash" @size="xs" @type="danger" @helpText={{t "storefront.networks.index.delete-network"}} @onClick={{fn @onDelete this.network}} @permission="storefront delete network" data-test-network-delete />
+                {{/if}}
+            </div>
+        </div>
+        <RegistryYield @registry="storefront:component:network:card:footer:end" as |RegistryComponent|>
+            <RegistryComponent @network={{this.network}} @resource={{this.network}} />
+        </RegistryYield>
+    </Card.footer>
+</Layout::Resource::Card>
diff --git a/addon/components/storefront/network/card.js b/addon/components/storefront/network/card.js
new file mode 100644
index 00000000..42e326d1
--- /dev/null
+++ b/addon/components/storefront/network/card.js
@@ -0,0 +1,29 @@
+import Component from '@glimmer/component';
+import { get } from '@ember/object';
+
+/**
+ * A network on the shared card anatomy: name and online state in the header,
+ * the logo on its backdrop as media, and the member count, currency and
+ * actions in the footer.
+ */
+export default class StorefrontNetworkCardComponent extends Component {
+    get network() {
+        return this.args.network ?? this.args.resource;
+    }
+
+    get isOnline() {
+        return Boolean(get(this.network, 'online'));
+    }
+
+    get storesCount() {
+        const count = get(this.network, 'stores_count');
+
+        if (typeof count === 'number') {
+            return count;
+        }
+
+        const stores = get(this.network, 'stores');
+
+        return stores ? stores.length : 0;
+    }
+}
diff --git a/addon/components/storefront/network/invite-panel.hbs b/addon/components/storefront/network/invite-panel.hbs
new file mode 100644
index 00000000..8b5b5db1
--- /dev/null
+++ b/addon/components/storefront/network/invite-panel.hbs
@@ -0,0 +1,83 @@
+<Overlay @position="right" @isResizable={{true}} @noBackdrop={{false}} @width="600px" @minResizeWidth={{480}} @fullHeight={{true}} @isOpen={{true}}>
+    <Overlay::Header @title={{t "storefront.networks.invitations.panel-title" network=this.network.name}} @onPressCancel={{this.close}} />
+    <Overlay::Body class="p-0i" @wrapperClass="storefront-invite-panel" data-test-invite-panel>
+        <p class="storefront-invite-panel__lede">{{t "storefront.networks.invitations.panel-lede"}}</p>
+
+        <div class="storefront-invite-panel__tabs" role="tablist">
+            {{#each this.tabItems as |tab|}}
+                <button type="button" role="tab" aria-selected={{if tab.isActive "true" "false"}} class="storefront-invite-panel__tab {{if tab.isActive 'is-active'}}" {{on "click" (fn this.selectTab tab)}} data-test-invite-tab={{tab.id}}>
+                    {{tab.label}}
+                </button>
+            {{/each}}
+        </div>
+
+        {{#if (eq this.activeTab "email")}}
+            <div class="storefront-invite-panel__section space-y-4">
+                <InputGroup @name={{t "storefront.networks.invitations.email-addresses"}} @helpText={{t "storefront.networks.invitations.email-help"}}>
+                    <TagInput class="form-input" @placeholder={{t "storefront.component.modals.share-network.add-email"}} @tags={{this.recipients}} @addTag={{this.addRecipient}} @removeTagAtIndex={{this.removeRecipient}} as |tag|>
+                        <span class={{if (in-array tag this.flaggedRecipients) "line-through opacity-60"}}>{{tag}}</span>
+                    </TagInput>
+                    {{#if this.flaggedRecipients.length}}
+                        <div class="storefront-invite-panel__flag">{{t "storefront.networks.invitations.already-flagged" count=this.flaggedRecipients.length}}</div>
+                    {{/if}}
+                    {{#if this.invalidRecipients.length}}
+                        <div class="storefront-invite-panel__flag storefront-invite-panel__flag--error">{{t "storefront.networks.invitations.invalid-flagged" count=this.invalidRecipients.length}}</div>
+                    {{/if}}
+                </InputGroup>
+
+                <InputGroup @name={{t "storefront.networks.invitations.category-on-joining"}}>
+                    <PowerSelect @options={{this.categories}} @selected={{this.category}} @searchEnabled={{true}} @searchField="name" @allowClear={{true}} @placeholder={{t "storefront.networks.invitations.let-store-choose"}} @onChange={{this.setCategory}} @triggerClass="form-select form-input" as |category|>
+                        {{category.name}}
+                    </PowerSelect>
+                </InputGroup>
+
+                <InputGroup @name={{t "storefront.networks.invitations.expires"}}>
+                    <PowerSelect @options={{this.expiryItems}} @selected={{this.selectedExpiry}} @onChange={{this.setExpiry}} @triggerClass="form-select form-input" as |option|>
+                        {{option.label}}
+                    </PowerSelect>
+                </InputGroup>
+
+                <InputGroup @name={{t "storefront.networks.invitations.message"}}>
+                    <Textarea class="form-input w-full" rows="3" @value={{this.message}} placeholder={{t "storefront.networks.invitations.message-placeholder" network=this.network.name}} />
+                </InputGroup>
+
+                <Toggle @isToggled={{this.requireApproval}} @onToggle={{this.setRequireApproval}} @label={{t "storefront.networks.invitations.require-approval"}} @helpText={{t "storefront.networks.invitations.require-approval-help"}} />
+
+                <div class="storefront-invite-panel__footer">
+                    <Button @text={{t "common.cancel"}} @onClick={{this.close}} />
+                    <Button @type="primary" @icon="paper-plane" @text={{t "storefront.networks.invitations.send-count" count=this.sendableRecipients.length}} @disabled={{not this.canSend}} @isLoading={{this.send.isRunning}} @onClick={{perform this.send}} data-test-invite-send />
+                </div>
+            </div>
+        {{else if (eq this.activeTab "link")}}
+            <div class="storefront-invite-panel__section space-y-4">
+                <Toggle @isToggled={{this.shareableLinkEnabled}} @onToggle={{perform this.toggleShareableLink}} @label={{t "storefront.component.modals.share-network.enable-shareable-link"}} @helpText={{t "storefront.component.modals.share-network.anyone-with-this-link-able-to-join-your-network"}} />
+                {{#if this.shareableLinkEnabled}}
+                    <InputGroup @name={{t "storefront.networks.invitations.link"}}>
+                        <ClickToCopy @value={{this.shareableLink}} class="rounded-md border dark:border-gray-900 dark:bg-gray-900 truncate px-4 py-2.5 text-sm text-green-500 dark:text-green-300" />
+                    </InputGroup>
+                    <p class="storefront-invite-panel__hint">{{t "storefront.networks.invitations.link-hint"}}</p>
+                {{/if}}
+                <div class="storefront-invite-panel__footer">
+                    <Button @type="primary" @text={{t "storefront.networks.index.network.stores.done"}} @onClick={{this.close}} />
+                </div>
+            </div>
+        {{else}}
+            <div class="storefront-invite-panel__section space-y-4">
+                <InputGroup @name={{t "storefront.networks.invitations.own-stores"}} @helpText={{t "storefront.networks.invitations.own-stores-help"}}>
+                    <PowerSelectMultiple @options={{this.availableOwnStores}} @selected={{this.selectedStores}} @searchEnabled={{true}} @searchField="name" @placeholder={{t "storefront.networks.invitations.pick-stores"}} @onChange={{this.setSelectedStores}} @triggerClass="form-select form-input" as |store|>
+                        <SelectOption::Store @model={{store}} />
+                    </PowerSelectMultiple>
+                </InputGroup>
+                <InputGroup @name={{t "storefront.common.category"}}>
+                    <PowerSelect @options={{this.categories}} @selected={{this.ownStoreCategory}} @searchEnabled={{true}} @searchField="name" @allowClear={{true}} @placeholder={{t "storefront.networks.invitations.let-store-choose"}} @onChange={{this.setOwnStoreCategory}} @triggerClass="form-select form-input" as |category|>
+                        {{category.name}}
+                    </PowerSelect>
+                </InputGroup>
+                <div class="storefront-invite-panel__footer">
+                    <Button @text={{t "common.cancel"}} @onClick={{this.close}} />
+                    <Button @type="primary" @icon="plus" @text={{t "storefront.networks.invitations.add-to-network"}} @disabled={{not this.canAddOwnStores}} @isLoading={{this.addOwnStores.isRunning}} @onClick={{perform this.addOwnStores}} data-test-invite-add-own />
+                </div>
+            </div>
+        {{/if}}
+    </Overlay::Body>
+</Overlay>
diff --git a/addon/components/storefront/network/invite-panel.js b/addon/components/storefront/network/invite-panel.js
new file mode 100644
index 00000000..20731e1a
--- /dev/null
+++ b/addon/components/storefront/network/invite-panel.js
@@ -0,0 +1,220 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
+import { task } from 'ember-concurrency';
+import isEmail from '@fleetbase/ember-core/utils/is-email';
+import createShareableLink from '../../../utils/create-shareable-link';
+
+/**
+ * Invite stores to a network: by email, with a shareable link, or by adding a store the
+ * user already administers. Replaces the share-network and add-stores-to-network modals.
+ */
+export default class StorefrontNetworkInvitePanelComponent extends Component {
+    @service store;
+    @service fetch;
+    @service intl;
+    @service notifications;
+    @service currentUser;
+    @tracked activeTab = this.args.activeTab ?? 'email';
+    @tracked recipients = [];
+    @tracked category = null;
+    @tracked expiresInDays = 14;
+    @tracked message = '';
+    @tracked requireApproval = false;
+    @tracked categories = [];
+    @tracked members = [];
+    @tracked ownStores = [];
+    @tracked selectedStores = [];
+    @tracked ownStoreCategory = null;
+
+    tabs = ['email', 'link', 'own'];
+    expiryOptions = [
+        { value: 14, labelKey: 'storefront.networks.invitations.expires-14' },
+        { value: 7, labelKey: 'storefront.networks.invitations.expires-7' },
+        { value: 30, labelKey: 'storefront.networks.invitations.expires-30' },
+        { value: 0, labelKey: 'storefront.networks.invitations.expires-never' },
+    ];
+
+    constructor() {
+        super(...arguments);
+        this.load.perform();
+    }
+
+    get network() {
+        return this.args.network;
+    }
+
+    get tabItems() {
+        return this.tabs.map((id) => ({ id, label: this.intl.t(`storefront.networks.invitations.tab-${id}`), isActive: id === this.activeTab }));
+    }
+
+    get expiryItems() {
+        return this.expiryOptions.map((option) => ({ ...option, label: this.intl.t(option.labelKey) }));
+    }
+
+    get selectedExpiry() {
+        return this.expiryItems.find((option) => option.value === this.expiresInDays) ?? this.expiryItems[0];
+    }
+
+    get validRecipients() {
+        return this.recipients.filter((email) => isEmail(email));
+    }
+
+    get invalidRecipients() {
+        return this.recipients.filter((email) => !isEmail(email));
+    }
+
+    get knownEmails() {
+        const memberEmails = this.members.map((store) => store.email).filter(Boolean);
+        const invitedEmails = (this.network.invitations ?? []).filter((invitation) => invitation.status === 'pending').map((invitation) => invitation.email);
+
+        return new Set([...memberEmails, ...invitedEmails].map((email) => String(email).toLowerCase()));
+    }
+
+    get flaggedRecipients() {
+        return this.recipients.filter((email) => this.knownEmails.has(String(email).toLowerCase()));
+    }
+
+    get sendableRecipients() {
+        return this.validRecipients.filter((email) => !this.knownEmails.has(String(email).toLowerCase()));
+    }
+
+    get canSend() {
+        return this.sendableRecipients.length > 0 && !this.send.isRunning;
+    }
+
+    get shareableLink() {
+        return createShareableLink(`join/network/${this.network.public_id}`);
+    }
+
+    get shareableLinkEnabled() {
+        return Boolean(this.network.options?.shareable_link_enabled);
+    }
+
+    get availableOwnStores() {
+        const memberIds = new Set(this.members.map((store) => store.id));
+
+        return this.ownStores.filter((store) => !memberIds.has(store.id));
+    }
+
+    get canAddOwnStores() {
+        return this.selectedStores.length > 0 && !this.addOwnStores.isRunning;
+    }
+
+    @task *load() {
+        try {
+            const [categories, members, ownStores] = yield Promise.all([
+                this.store.query('category', { owner_uuid: this.network.id, for: 'storefront_network', parents_only: true }),
+                this.store.query('store', { network: this.network.id }),
+                this.store.query('store', { limit: 300 }),
+            ]);
+            this.categories = categories?.toArray?.() ?? Array.from(categories ?? []);
+            this.members = members?.toArray?.() ?? Array.from(members ?? []);
+            this.ownStores = ownStores?.toArray?.() ?? Array.from(ownStores ?? []);
+            if (!this.network.invitations) {
+                yield this.network.loadInvitations();
+            }
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *send() {
+        try {
+            yield this.network.sendInvites({
+                recipients: this.sendableRecipients,
+                category_uuid: this.category?.id ?? null,
+                expires_in_days: this.expiresInDays || null,
+                message: this.message || null,
+                require_approval: this.requireApproval,
+            });
+            this.notifications.success(this.intl.t('storefront.networks.invitations.sent', { count: this.sendableRecipients.length }));
+            this.recipients = [];
+            this.message = '';
+            yield this.network.loadInvitations();
+            this.args.onSent?.();
+            this.args.onClose?.();
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *addOwnStores() {
+        try {
+            yield this.network.addStores(this.selectedStores);
+            if (this.ownStoreCategory) {
+                for (const store of this.selectedStores) {
+                    yield this.fetch.post(`networks/${this.network.id}/set-store-category`, { store: store.id, category: this.ownStoreCategory.id }, { namespace: 'storefront/int/v1' });
+                }
+            }
+            this.notifications.success(this.intl.t('storefront.networks.invitations.own-stores-added', { count: this.selectedStores.length }));
+            this.selectedStores = [];
+            this.args.onSent?.();
+            this.args.onClose?.();
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *toggleShareableLink(enabled) {
+        try {
+            this.network.set('options', { ...(this.network.options ?? {}), shareable_link_enabled: enabled });
+            yield this.network.save();
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @action selectTab(tab) {
+        this.activeTab = tab.id ?? tab;
+    }
+
+    @action addRecipient(value) {
+        const emails = String(value ?? '')
+            .split(/[\s,;]+/)
+            .map((email) => email.trim())
+            .filter(Boolean);
+        const next = [...this.recipients];
+
+        emails.forEach((email) => {
+            if (!next.includes(email)) {
+                next.push(email);
+            }
+        });
+
+        this.recipients = next;
+    }
+
+    @action removeRecipient(index) {
+        this.recipients = this.recipients.filter((_, i) => i !== index);
+    }
+
+    @action setCategory(category) {
+        this.category = category;
+    }
+
+    @action setOwnStoreCategory(category) {
+        this.ownStoreCategory = category;
+    }
+
+    @action setExpiry(option) {
+        this.expiresInDays = option?.value ?? 0;
+    }
+
+    @action setMessage(event) {
+        this.message = event.target.value;
+    }
+
+    @action setRequireApproval(enabled) {
+        this.requireApproval = enabled;
+    }
+
+    @action setSelectedStores(stores) {
+        this.selectedStores = Array.from(stores ?? []);
+    }
+
+    @action close() {
+        this.args.onClose?.();
+    }
+}
diff --git a/addon/components/storefront/network/orders/cell/actions.hbs b/addon/components/storefront/network/orders/cell/actions.hbs
new file mode 100644
index 00000000..83051540
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/actions.hbs
@@ -0,0 +1,25 @@
+<div class="storefront-order-actions" data-test-order-actions>
+    {{#if @row.isGroup}}
+        <span class="storefront-order-driver__muted">{{t "storefront.networks.orders.expand-hint"}}</span>
+    {{else}}
+        {{#if this.primary}}
+            <Button @size="xs" @type={{or this.primary.type "primary"}} @icon={{this.primary.icon}} @text={{this.primary.text}} @onClick={{fn this.run this.primary}} @permission="storefront update order" />
+        {{/if}}
+        <DropdownButton @icon="ellipsis-h" @size="xs" @iconPrefix="fas" @text={{false}} @renderInPlace={{false}} as |dd|>
+            <div class="next-dd-menu mt-1 mx-0" aria-labelledby="order-actions">
+                <div class="px-1">
+                    {{#each this.secondary as |item|}}
+                        {{#if item.separator}}
+                            <div class="next-dd-menu-seperator"></div>
+                        {{else}}
+                            <a href="javascript:;" class="next-dd-item {{item.class}} {{if item.disabled 'opacity-50 pointer-events-none'}}" {{on "click" (dropdown-fn dd this.run item)}}>
+                                {{#if item.icon}}<FaIcon @icon={{item.icon}} class="mr-1" />{{/if}}
+                                {{item.text}}
+                            </a>
+                        {{/if}}
+                    {{/each}}
+                </div>
+            </div>
+        </DropdownButton>
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/actions.js b/addon/components/storefront/network/orders/cell/actions.js
new file mode 100644
index 00000000..b5ad6334
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/actions.js
@@ -0,0 +1,44 @@
+import Component from '@glimmer/component';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
+
+/**
+ * The next action for an order promoted to a button, the rest behind an ellipsis.
+ * A checkout group has no action of its own; its orders do.
+ */
+export default class StorefrontNetworkOrdersCellActionsComponent extends Component {
+    @service storefrontOrderActions;
+
+    get items() {
+        const { row, column } = this.args;
+
+        if (row?.isGroup) {
+            return [];
+        }
+
+        return this.storefrontOrderActions.actionItemsFor(row, column?.onChange);
+    }
+
+    get primary() {
+        return this.items.find((item) => item.id === 'perform-workflow-action') ?? null;
+    }
+
+    get secondary() {
+        const primary = this.primary;
+        const rest = this.items.filter((item) => item !== primary);
+        const { row, column } = this.args;
+
+        return [
+            { text: 'View order', icon: 'eye', fn: () => column?.onView?.(row) },
+            ...rest,
+            { separator: true },
+            { text: 'Delete order', icon: 'trash', class: 'text-danger', fn: () => column?.onDelete?.(row) },
+        ];
+    }
+
+    @action run(item) {
+        if (typeof item?.fn === 'function') {
+            item.fn();
+        }
+    }
+}
diff --git a/addon/components/storefront/network/orders/cell/driver.hbs b/addon/components/storefront/network/orders/cell/driver.hbs
new file mode 100644
index 00000000..18595d37
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/driver.hbs
@@ -0,0 +1,16 @@
+<div class="storefront-order-driver" data-test-order-driver>
+    {{#if this.driver}}
+        <Resource::Pill @resourceType="driver" @resource={{this.driver}} @size="xs" />
+        {{#if (and @row.isGroup (gt @row.orderCount 1))}}
+            <span class="storefront-order-driver__note">{{t "storefront.networks.orders.driver-shared" count=@row.orderCount}}</span>
+        {{/if}}
+    {{else if this.isPickup}}
+        <span class="storefront-order-driver__muted">{{t "storefront.networks.orders.no-driver-needed"}}</span>
+    {{else if (gt this.driverCount 1)}}
+        <span class="storefront-order-driver__muted">{{t "storefront.networks.orders.drivers-count" count=this.driverCount}}</span>
+    {{else if this.canAssign}}
+        <Button @size="xs" @icon="id-card" @text={{t "storefront.networks.orders.assign-driver"}} @onClick={{fn @column.onAssign @row}} @permission="storefront update order" />
+    {{else}}
+        <span class="storefront-order-driver__muted">{{t "storefront.networks.orders.unassigned"}}</span>
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/driver.js b/addon/components/storefront/network/orders/cell/driver.js
new file mode 100644
index 00000000..c0420634
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/driver.js
@@ -0,0 +1,34 @@
+import Component from '@glimmer/component';
+import { get } from '@ember/object';
+import { relationValue } from '@fleetbase/ember-ui/utils/resource-registry';
+import { rankOf } from '../../../../../utils/order-groups';
+
+export default class StorefrontNetworkOrdersCellDriverComponent extends Component {
+    get row() {
+        return this.args.row;
+    }
+
+    get driver() {
+        if (this.row?.isGroup) {
+            return this.row.driver;
+        }
+
+        return relationValue(this.row, 'driver_assigned') ?? null;
+    }
+
+    get isPickup() {
+        return Boolean(this.row?.isGroup ? this.row.is_pickup : get(this.row, 'meta.is_pickup'));
+    }
+
+    get driverCount() {
+        return this.row?.isGroup ? this.row.driverCount : this.driver ? 1 : 0;
+    }
+
+    get isTerminal() {
+        return this.row?.isGroup ? this.row.allTerminal : rankOf(this.row?.status) >= 4;
+    }
+
+    get canAssign() {
+        return !this.row?.isGroup && !this.isPickup && !this.driver && !this.isTerminal && typeof this.args.column?.onAssign === 'function';
+    }
+}
diff --git a/addon/components/storefront/network/orders/cell/fulfillment.hbs b/addon/components/storefront/network/orders/cell/fulfillment.hbs
new file mode 100644
index 00000000..b170ef10
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/fulfillment.hbs
@@ -0,0 +1,6 @@
+{{#let (if @row.isGroup @row.is_pickup @row.meta.is_pickup) as |isPickup|}}
+    <span class="storefront-fulfillment {{if isPickup 'storefront-fulfillment--pickup' 'storefront-fulfillment--delivery'}}" data-test-order-fulfillment>
+        <FaIcon @icon={{if isPickup "store" "truck"}} @size="xs" class="mr-1" />
+        {{if isPickup (t "storefront.common.pickup") (t "storefront.networks.orders.delivery")}}
+    </span>
+{{/let}}
diff --git a/addon/components/storefront/network/orders/cell/placed.hbs b/addon/components/storefront/network/orders/cell/placed.hbs
new file mode 100644
index 00000000..cfcd22f6
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/placed.hbs
@@ -0,0 +1 @@
+<span class="storefront-order-placed" title={{@row.createdAt}} data-test-order-placed>{{if @row.isGroup @row.createdAtShort @row.createdAtShort}}</span>
diff --git a/addon/components/storefront/network/orders/cell/reference.hbs b/addon/components/storefront/network/orders/cell/reference.hbs
new file mode 100644
index 00000000..6217e173
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/reference.hbs
@@ -0,0 +1,13 @@
+<div class="storefront-order-ref" data-test-order-reference>
+    {{#if @row.isGroup}}
+        <span class="storefront-order-ref__id">{{@row.id}}</span>
+        <span class="storefront-order-ref__meta">{{t "storefront.networks.orders.group-summary" orders=@row.orderCount items=@row.itemCount}}</span>
+    {{else}}
+        <a href="javascript:;" class="storefront-order-ref__id storefront-order-ref__id--link" {{on "click" (fn @column.onView @row)}}>{{@row.public_id}}</a>
+        {{#if @row.meta.checkout_id}}
+            <span class="storefront-order-ref__meta">{{t "storefront.networks.orders.part-of" checkout=@row.meta.checkout_id}}</span>
+        {{else if @row.item_count}}
+            <span class="storefront-order-ref__meta">{{t "storefront.networks.orders.items-count" count=@row.item_count}}</span>
+        {{/if}}
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/status.hbs b/addon/components/storefront/network/orders/cell/status.hbs
new file mode 100644
index 00000000..79def0bd
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/status.hbs
@@ -0,0 +1,7 @@
+<div class="storefront-order-status" data-test-order-status>
+    {{#if @row.isGroup}}
+        <Badge @status={{@row.status}} @size="xs" @text={{t "storefront.networks.orders.group-status" count=@row.statusSummary.count total=@row.statusSummary.total status=(smart-humanize @row.status)}} />
+    {{else}}
+        <Badge @status={{@row.status}} @size="xs" />
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/stores.hbs b/addon/components/storefront/network/orders/cell/stores.hbs
new file mode 100644
index 00000000..1214a70b
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/stores.hbs
@@ -0,0 +1,14 @@
+<div class="storefront-identity-stack" data-test-order-stores>
+    {{#each this.visible as |entry|}}
+        {{#if entry.store}}
+            <Resource::Pill @resourceType="store" @resource={{entry.store}} @size="xs" @class="storefront-identity-stack__pill" />
+        {{else}}
+            <span class="storefront-identity-stack__text" title={{entry.name}}>{{entry.name}}</span>
+        {{/if}}
+    {{else}}
+        <span class="text-gray-400">{{t "storefront.networks.orders.no-store"}}</span>
+    {{/each}}
+    {{#if this.overflow}}
+        <span class="storefront-identity-stack__overflow" title={{this.overflowTitle}}>+{{this.overflow}}</span>
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/stores.js b/addon/components/storefront/network/orders/cell/stores.js
new file mode 100644
index 00000000..5b06f590
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/stores.js
@@ -0,0 +1,33 @@
+import Component from '@glimmer/component';
+import { orderStoreId, orderStoreName } from '../../../../../utils/order-groups';
+
+const MAX_VISIBLE = 4;
+
+/**
+ * The stores behind a row: one for an order, up to four tiles plus an overflow count for a checkout group.
+ */
+export default class StorefrontNetworkOrdersCellStoresComponent extends Component {
+    get entries() {
+        const { row, column } = this.args;
+        const storesById = column?.storesById ?? {};
+        const ids = row?.isGroup ? (row.storeIds ?? []) : [orderStoreId(row)].filter(Boolean);
+        const names = row?.isGroup ? (row.storeNames ?? []) : [orderStoreName(row)].filter(Boolean);
+
+        return ids.map((id, index) => ({ id, store: storesById[id] ?? null, name: storesById[id]?.name ?? names[index] ?? names[0] ?? id }));
+    }
+
+    get visible() {
+        return this.entries.slice(0, MAX_VISIBLE);
+    }
+
+    get overflow() {
+        return Math.max(0, this.entries.length - MAX_VISIBLE);
+    }
+
+    get overflowTitle() {
+        return this.entries
+            .slice(MAX_VISIBLE)
+            .map((entry) => entry.name)
+            .join(', ');
+    }
+}
diff --git a/addon/components/storefront/network/orders/cell/total.hbs b/addon/components/storefront/network/orders/cell/total.hbs
new file mode 100644
index 00000000..7f44032e
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/total.hbs
@@ -0,0 +1,14 @@
+<div class="storefront-order-total" data-test-order-total>
+    <span class="storefront-order-total__amount">{{format-currency this.total this.currency}}</span>
+    {{#if this.tip}}
+        <span class="storefront-order-total__tip">
+            {{#if (eq this.tipLabel "split")}}
+                {{t "storefront.networks.orders.tip-split" tip=(format-currency this.tip this.currency) count=@row.orderCount}}
+            {{else if (eq this.tipLabel "shared")}}
+                {{t "storefront.networks.orders.tip-shared" tip=(format-currency this.tip this.currency)}}
+            {{else}}
+                {{t "storefront.networks.orders.tip-to-store" tip=(format-currency this.tip this.currency)}}
+            {{/if}}
+        </span>
+    {{/if}}
+</div>
diff --git a/addon/components/storefront/network/orders/cell/total.js b/addon/components/storefront/network/orders/cell/total.js
new file mode 100644
index 00000000..6f6769a4
--- /dev/null
+++ b/addon/components/storefront/network/orders/cell/total.js
@@ -0,0 +1,42 @@
+import Component from '@glimmer/component';
+import { get } from '@ember/object';
+
+function number(value) {
+    const parsed = parseFloat(value);
+
+    return Number.isFinite(parsed) ? parsed : 0;
+}
+
+export default class StorefrontNetworkOrdersCellTotalComponent extends Component {
+    get total() {
+        const { row } = this.args;
+
+        return row?.isGroup ? row.total : number(get(row, 'meta.total') ?? row?.transaction_amount);
+    }
+
+    get tip() {
+        const { row } = this.args;
+
+        return row?.isGroup ? row.tip : number(get(row, 'meta.tip')) + number(get(row, 'meta.delivery_tip'));
+    }
+
+    get currency() {
+        const { row } = this.args;
+
+        return (row?.isGroup ? row.currency : get(row, 'meta.currency') ?? row?.currency) ?? 'USD';
+    }
+
+    get tipLabel() {
+        if (!this.tip) {
+            return null;
+        }
+
+        const { row } = this.args;
+
+        if (row?.isGroup) {
+            return row.orderCount > 1 ? 'split' : 'network';
+        }
+
+        return get(row, 'meta.checkout_id') ? 'shared' : 'store';
+    }
+}
diff --git a/addon/components/storefront/truck/card.hbs b/addon/components/storefront/truck/card.hbs
new file mode 100644
index 00000000..84bbab1d
--- /dev/null
+++ b/addon/components/storefront/truck/card.hbs
@@ -0,0 +1,49 @@
+<Layout::Resource::Card class="storefront-card storefront-truck-card" data-test-storefront-truck-card ...attributes as |Card|>
+    <Card.header class={{@headerClass}}>
+        <RegistryYield @registry="storefront:component:truck:card:header:start" as |RegistryComponent|>
+            <RegistryComponent @truck={{this.truck}} @resource={{this.truck}} />
+        </RegistryYield>
+        <Vehicle::Pill @vehicle={{this.vehicle}} @titleFallback={{t "storefront.trucks.card.no-vehicle"}} @showOnlineIndicator={{true}} @static={{not this.vehicle.id}} class="storefront-card__identity" data-test-truck-vehicle />
+        <div class="storefront-card__subtitle" data-test-truck-area>
+            {{#if this.serviceAreaName}}
+                {{this.serviceAreaName}}{{#if this.zoneName}} · {{this.zoneName}}{{/if}}
+            {{else}}
+                {{t "storefront.trucks.card.no-service-area"}}
+            {{/if}}
+        </div>
+        <RegistryYield @registry="storefront:component:truck:card:header:end" as |RegistryComponent|>
+            <RegistryComponent @truck={{this.truck}} @resource={{this.truck}} />
+        </RegistryYield>
+    </Card.header>
+    <Card.body class="storefront-card__media-body {{@bodyClass}}">
+        <Image src={{this.photoUrl}} @fallbackSrc={{this.placeholder}} alt={{n-a this.vehicle.display_name ""}} class="storefront-card__media" data-test-truck-photo />
+    </Card.body>
+    <Card.footer class={{@footerClass}}>
+        <RegistryYield @registry="storefront:component:truck:card:footer:start" as |RegistryComponent|>
+            <RegistryComponent @truck={{this.truck}} @resource={{this.truck}} />
+        </RegistryYield>
+        <div class="storefront-card__actions">
+            <Badge @status={{this.presence.status}} @text={{t this.presence.labelKey}} @size="xs" data-test-truck-presence />
+            <div class="storefront-card__buttons">
+                {{#if @onEdit}}
+                    <Button @icon="pencil" @size="xs" @helpText={{t "storefront.common.edit"}} @onClick={{fn @onEdit this.truck}} @permission="storefront update food-truck" data-test-truck-edit />
+                {{/if}}
+                {{#if @onAssignCatalogs}}
+                    <Button @icon="book-open" @size="xs" @helpText={{t "storefront.trucks.card.assign-catalogs"}} @onClick={{fn @onAssignCatalogs this.truck}} @permission="storefront update food-truck" data-test-truck-catalogs />
+                {{/if}}
+                {{#if @onDelete}}
+                    <Button @icon="trash" @size="xs" @type="danger" @helpText={{t "storefront.common.delete"}} @onClick={{fn @onDelete this.truck}} @permission="storefront delete food-truck" data-test-truck-delete />
+                {{/if}}
+            </div>
+        </div>
+        <div class="storefront-card__meta">
+            <span data-test-truck-catalogs-count>{{t "storefront.trucks.card.catalogs-count" count=this.catalogs.length}}</span>
+            {{#if this.storeName}}
+                <span data-test-truck-store>{{t "storefront.trucks.card.owned-by" name=this.storeName}}</span>
+            {{/if}}
+        </div>
+        <RegistryYield @registry="storefront:component:truck:card:footer:end" as |RegistryComponent|>
+            <RegistryComponent @truck={{this.truck}} @resource={{this.truck}} />
+        </RegistryYield>
+    </Card.footer>
+</Layout::Resource::Card>
diff --git a/addon/components/storefront/truck/card.js b/addon/components/storefront/truck/card.js
new file mode 100644
index 00000000..3527d9ec
--- /dev/null
+++ b/addon/components/storefront/truck/card.js
@@ -0,0 +1,80 @@
+import Component from '@glimmer/component';
+import { get } from '@ember/object';
+import { resolveResourceImage, getPlaceholderImage } from '@fleetbase/fleetops-data/utils/placeholder-images';
+
+/**
+ * A truck (the `food-truck` resource) on the shared card anatomy: the vehicle
+ * pill as its identity, the vehicle photo as media, and what matters to a
+ * store in the footer: whether it is online, where it serves, and which
+ * catalogs it carries.
+ */
+export default class StorefrontTruckCardComponent extends Component {
+    get truck() {
+        return this.args.truck ?? this.args.foodTruck ?? this.args.resource;
+    }
+
+    get vehicle() {
+        return get(this.truck, 'vehicle');
+    }
+
+    get isOnline() {
+        const online = get(this.truck, 'online');
+
+        if (typeof online === 'boolean') {
+            return online;
+        }
+
+        return Boolean(this.vehicle && get(this.vehicle, 'online'));
+    }
+
+    get status() {
+        return get(this.truck, 'status') ?? 'inactive';
+    }
+
+    get isActive() {
+        return this.status === 'active';
+    }
+
+    get photoUrl() {
+        return resolveResourceImage(this.vehicle ? get(this.vehicle, 'photo_url') : null, 'vehicle');
+    }
+
+    get placeholder() {
+        return getPlaceholderImage('vehicle');
+    }
+
+    get serviceAreaName() {
+        return get(this.truck, 'service_area.name');
+    }
+
+    get zoneName() {
+        return get(this.truck, 'zone.name');
+    }
+
+    get catalogs() {
+        const catalogs = get(this.truck, 'catalogs');
+
+        return catalogs ? catalogs.slice() : [];
+    }
+
+    get storeName() {
+        return get(this.truck, 'store_summary.name');
+    }
+
+    /** What the store needs to know at a glance: serving, online with nothing to sell, or offline. */
+    get presence() {
+        if (!this.isActive) {
+            return { status: 'inactive', labelKey: 'storefront.trucks.card.inactive' };
+        }
+
+        if (!this.isOnline) {
+            return { status: 'offline', labelKey: 'storefront.trucks.card.offline' };
+        }
+
+        if (this.catalogs.length === 0) {
+            return { status: 'warning', labelKey: 'storefront.trucks.card.no-catalog' };
+        }
+
+        return { status: 'online', labelKey: 'storefront.trucks.card.online' };
+    }
+}
diff --git a/addon/controllers/application.js b/addon/controllers/application.js
index 82fca604..d0135b3a 100644
--- a/addon/controllers/application.js
+++ b/addon/controllers/application.js
@@ -1,7 +1,6 @@
 import Controller from '@ember/controller';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
-import { alias } from '@ember/object/computed';
 import { tracked } from '@glimmer/tracking';
 
 export default class ApplicationController extends Controller {
@@ -12,11 +11,96 @@ export default class ApplicationController extends Controller {
     @service intl;
     @service abilities;
     @service store;
-    @alias('storefront.activeStore') activeStore;
+    /**
+     * Native getters so the sidebar re-renders when the service's tracked ids change;
+     * a computed alias onto a native getter never invalidates.
+     */
+    get activeStore() {
+        return this.storefront.activeStore;
+    }
+
+    get activeNetwork() {
+        return this.storefront.activeNetwork;
+    }
     @tracked productCategories = [];
     categoryLoadStoreUuid;
 
+    get isNetworkContext() {
+        return Boolean(this.activeNetwork?.id);
+    }
+
+    /**
+     * The sidebar is rewritten for the active context: a network gets its own
+     * navigation, everything else is scoped to the active store.
+     */
     get navigationItems() {
+        return this.isNetworkContext ? this.networkNavigationItems : this.storeNavigationItems;
+    }
+
+    get networkNavigationItems() {
+        const publicId = this.activeNetwork.public_id;
+        const networkItem = (key, item) => {
+            const route = `console.storefront.networks.index.network.${key}`;
+
+            return {
+                id: `network:${publicId}:${key}`,
+                ...item,
+                // These routes share one dynamic segment, so route-name matching alone cannot tell networks apart.
+                activeWhen: () => this.hostRouter.isActive(route, publicId),
+                onClick: () => this.hostRouter.transitionTo(route, publicId),
+            };
+        };
+
+        return [
+            networkItem('index', {
+                label: this.intl.t('storefront.networks.index.network.overview'),
+                description: 'Members, invitations, orders and revenue across the network.',
+                icon: 'gauge-high',
+                permission: 'storefront view network',
+                keywords: ['overview', 'dashboard', 'network'],
+            }),
+            networkItem('stores', {
+                label: this.intl.t('storefront.networks.index.network.stores.store'),
+                description: 'Stores selling through this network, their categories and invitations.',
+                icon: 'store',
+                permission: 'storefront view network',
+                keywords: ['stores', 'members', 'invite', 'categories'],
+            }),
+            networkItem('trucks', {
+                label: this.intl.t('storefront.common.food-trucks'),
+                description: 'Trucks run by the stores in this network.',
+                icon: 'truck',
+                permission: 'storefront list food-truck',
+                visible: this.can('storefront see food-truck'),
+                keywords: ['vehicles', 'mobile store', 'truck'],
+            }),
+            networkItem('orders', {
+                label: this.intl.t('storefront.networks.index.network.orders'),
+                description: 'Orders placed through this network.',
+                icon: 'file-invoice-dollar',
+                permission: 'storefront list order',
+                visible: this.can('storefront see order'),
+                keywords: ['fulfillment', 'deliveries', 'checkout orders'],
+            }),
+            networkItem('customers', {
+                label: this.intl.t('storefront.networks.index.network.customers'),
+                description: 'Customers who ordered through this network.',
+                icon: 'users',
+                permission: 'storefront list user',
+                visible: this.can('storefront see user'),
+                keywords: ['contacts', 'buyers', 'users'],
+            }),
+            networkItem('settings', {
+                label: this.intl.t('storefront.networks.index.network.settings'),
+                description: 'Network details, gateways and notification channels.',
+                icon: 'cog',
+                permission: 'storefront update network',
+                keywords: ['settings', 'general', 'gateways', 'notifications'],
+            }),
+        ];
+    }
+
+    get storeNavigationItems() {
         const hasActiveStore = Boolean(this.activeStore?.id);
 
         return [
@@ -27,6 +111,16 @@ export default class ApplicationController extends Controller {
                 route: 'console.storefront.home',
                 keywords: ['dashboard', 'overview', 'metrics', 'sales'],
             },
+            {
+                label: this.intl.t('storefront.sidebar.orders'),
+                description: 'Manage incoming storefront orders.',
+                icon: 'file-invoice-dollar',
+                route: 'console.storefront.orders',
+                permission: 'storefront list order',
+                visible: this.can('storefront see order'),
+                disabled: !hasActiveStore,
+                keywords: ['fulfillment', 'deliveries', 'checkout orders'],
+            },
             {
                 label: this.intl.t('storefront.sidebar.products'),
                 description: 'Manage products, categories, variants, and addons.',
@@ -65,29 +159,9 @@ export default class ApplicationController extends Controller {
                 disabled: !hasActiveStore,
                 keywords: ['contacts', 'buyers', 'users'],
             },
-            {
-                label: this.intl.t('storefront.sidebar.orders'),
-                description: 'Manage incoming storefront orders.',
-                icon: 'file-invoice-dollar',
-                route: 'console.storefront.orders',
-                permission: 'storefront list order',
-                visible: this.can('storefront see order'),
-                disabled: !hasActiveStore,
-                keywords: ['fulfillment', 'deliveries', 'checkout orders'],
-            },
-            {
-                label: this.intl.t('storefront.sidebar.networks'),
-                description: 'Manage marketplace networks and participating stores.',
-                icon: 'network-wired',
-                route: 'console.storefront.networks',
-                permission: 'storefront list network',
-                visible: this.can('storefront see network'),
-                disabled: !hasActiveStore,
-                keywords: ['marketplace', 'network stores', 'partners'],
-            },
             {
                 label: this.intl.t('storefront.sidebar.food-trucks'),
-                description: 'Manage food truck locations and availability.',
+                description: 'Manage trucks, where they serve and what they sell.',
                 icon: 'truck',
                 route: 'console.storefront.food-trucks',
                 permission: 'storefront list food-truck',
@@ -259,7 +333,6 @@ export default class ApplicationController extends Controller {
                 const loader = this.loader.show({ loadingMessage: 'Switching to newly created store...' });
 
                 this.hostRouter.refresh().then(() => {
-                    this.notifyPropertyChange('activeStore');
                     this.loadProductCategories(this.activeStoreUuid);
                     this.loader.removeLoader(loader);
                 });
@@ -267,14 +340,23 @@ export default class ApplicationController extends Controller {
         });
     }
 
+    @action createNewNetwork() {
+        return this.storefront.createNewNetwork({
+            onSuccess: (network) => this.switchActiveNetwork(network),
+        });
+    }
+
     @action switchActiveStore(store) {
         const loader = this.loader.show({ loadingMessage: `Switching Storefront to ${store.name}...` });
+        const leavingNetwork = this.isNetworkContext;
         this.storefront.setActiveStorefront(store);
         this.productCategories = [];
-        return this.hostRouter
-            .refresh()
+        // A page inside a network has no meaning for a store, so the switch lands on the store dashboard;
+        // leaving the network route is what clears the network context.
+        const transition = leavingNetwork ? this.hostRouter.transitionTo('console.storefront.home') : this.hostRouter.refresh();
+
+        return Promise.resolve(transition)
             .then(() => {
-                this.notifyPropertyChange('activeStore');
                 return this.loadProductCategories(store.id);
             })
             .finally(() => {
@@ -282,6 +364,11 @@ export default class ApplicationController extends Controller {
             });
     }
 
+    @action switchActiveNetwork(network) {
+        // Entering the network route is what sets the network context.
+        return this.hostRouter.transitionTo('console.storefront.networks.index.network.stores', network.public_id);
+    }
+
     @action
     async searchNavigation({ query, limit = 12 }) {
         const trimmedQuery = query?.trim();
diff --git a/addon/controllers/catalogs/index.js b/addon/controllers/catalogs/index.js
index 67de1bf4..270bfa2f 100644
--- a/addon/controllers/catalogs/index.js
+++ b/addon/controllers/catalogs/index.js
@@ -2,6 +2,8 @@ import Controller from '@ember/controller';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
+import { isBlank } from '@ember/utils';
+import { task, timeout } from 'ember-concurrency';
 
 export default class CatalogsIndexController extends Controller {
     @service store;
@@ -14,6 +16,19 @@ export default class CatalogsIndexController extends Controller {
     queryParams = ['query'];
 
     @tracked query;
+
+    /**
+     * Debounced search; updates the `query` param the route refreshes on.
+     */
+    @task({ restartable: true }) *search({ target: { value } }) {
+        if (isBlank(value)) {
+            this.query = null;
+            return;
+        }
+
+        yield timeout(250);
+        this.query = value;
+    }
     @tracked statusOptions = ['draft', 'published'];
 
     @action createCatalog() {
@@ -46,7 +61,7 @@ export default class CatalogsIndexController extends Controller {
         const allProducts = this.store.query('product', { limit: -1 });
 
         this.modalsManager.show('modals/create-catalog', {
-            title: 'Edit Food Truck',
+            title: 'Edit Catalog',
             acceptButtonText: 'Save Changes',
             acceptButtonIcon: 'save',
             statusOptions: this.statusOptions,
diff --git a/addon/controllers/food-trucks/index.js b/addon/controllers/food-trucks/index.js
index d0fe2c6b..32e37cdd 100644
--- a/addon/controllers/food-trucks/index.js
+++ b/addon/controllers/food-trucks/index.js
@@ -2,6 +2,8 @@ import Controller from '@ember/controller';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
+import { isBlank } from '@ember/utils';
+import { task, timeout } from 'ember-concurrency';
 
 export default class FoodTrucksIndexController extends Controller {
     @service store;
@@ -14,6 +16,19 @@ export default class FoodTrucksIndexController extends Controller {
     queryParams = ['query'];
 
     @tracked query;
+
+    /**
+     * Debounced search; updates the `query` param the route refreshes on.
+     */
+    @task({ restartable: true }) *search({ target: { value } }) {
+        if (isBlank(value)) {
+            this.query = null;
+            return;
+        }
+
+        yield timeout(250);
+        this.query = value;
+    }
     @tracked statusOptions = ['active', 'inactive'];
 
     @action createFoodTruck() {
@@ -23,7 +38,7 @@ export default class FoodTrucksIndexController extends Controller {
         });
 
         this.modalsManager.show('modals/create-food-truck', {
-            title: 'New Food Truck',
+            title: 'New Truck',
             statusOptions: this.statusOptions,
             foodTruck,
             confirm: async (modal) => {
@@ -32,7 +47,7 @@ export default class FoodTrucksIndexController extends Controller {
                 try {
                     await foodTruck.save();
                     this.hostRouter.refresh();
-                    this.notifications.success('New food truck created.');
+                    this.notifications.success('New truck created.');
                 } catch (error) {
                     this.notifications.serverError(error);
                 } finally {
@@ -44,7 +59,7 @@ export default class FoodTrucksIndexController extends Controller {
 
     @action editFoodTruck(foodTruck) {
         this.modalsManager.show('modals/create-food-truck', {
-            title: 'Edit Food Truck',
+            title: 'Edit Truck',
             acceptButtonText: 'Save Changes',
             acceptButtonIcon: 'save',
             statusOptions: this.statusOptions,
@@ -55,7 +70,7 @@ export default class FoodTrucksIndexController extends Controller {
                 try {
                     await foodTruck.save();
                     this.hostRouter.refresh();
-                    this.notifications.success('Changes to food truck saved.');
+                    this.notifications.success('Changes to truck saved.');
                 } catch (error) {
                     this.notifications.serverError(error);
                 } finally {
@@ -69,7 +84,7 @@ export default class FoodTrucksIndexController extends Controller {
         const allCatalogs = await this.store.query('catalog', { limit: -1 });
         console.log('[allCatalogs]', allCatalogs);
         this.modalsManager.show('modals/assign-food-truck-catalogs', {
-            title: "Assign Catalog's to this Food Truck",
+            title: 'Assign catalogs to this truck',
             acceptButtonText: 'Done',
             acceptButtonIcon: 'save',
             foodTruck,
@@ -83,7 +98,7 @@ export default class FoodTrucksIndexController extends Controller {
                 try {
                     await foodTruck.save();
                     this.hostRouter.refresh();
-                    this.notifications.success('Changes to food truck saved.');
+                    this.notifications.success('Changes to truck saved.');
                 } catch (error) {
                     this.notifications.serverError(error);
                 } finally {
diff --git a/addon/controllers/networks/index.js b/addon/controllers/networks/index.js
index 50ff3600..88b0aead 100644
--- a/addon/controllers/networks/index.js
+++ b/addon/controllers/networks/index.js
@@ -77,6 +77,13 @@ export default class NetworksIndexController extends BaseController {
      */
     @service hostRouter;
 
+    /**
+     * Inject the `storefront` service
+     *
+     * @var {Service}
+     */
+    @service storefront;
+
     /**
      * Queryable parameters for this controller's model
      *
@@ -165,27 +172,8 @@ export default class NetworksIndexController extends BaseController {
      * @public
      */
     @action createNetwork() {
-        const network = this.store.createRecord('network');
-        const currency = this.currentUser.getWhoisProperty('currency.code');
-
-        if (currency) {
-            network.setProperties({ currency });
-        }
-
-        this.modalsManager.show('modals/create-network', {
-            title: this.intl.t('storefront.networks.index.create-new-network'),
-            network,
-            confirm: (modal) => {
-                modal.startLoading();
-
-                return network.save().then(() => {
-                    this.notifications.success(this.intl.t('storefront.networks.index.success-message'));
-                    return this.hostRouter.refresh();
-                });
-            },
-            decline: () => {
-                return network.destroyRecord();
-            },
+        return this.storefront.createNewNetwork({
+            onSuccess: () => this.hostRouter.refresh(),
         });
     }
 
diff --git a/addon/controllers/networks/index/network.js b/addon/controllers/networks/index/network.js
index 2f8b823a..b0c65454 100644
--- a/addon/controllers/networks/index/network.js
+++ b/addon/controllers/networks/index/network.js
@@ -9,8 +9,8 @@ export default class NetworksIndexNetworkController extends BaseController {
     get tabs() {
         return [
             {
-                label: this.intl.t('storefront.networks.index.network.settings'),
-                icon: 'cog',
+                label: this.intl.t('storefront.networks.index.network.overview'),
+                icon: 'gauge-high',
                 route: 'networks.index.network.index',
             },
             {
@@ -28,10 +28,19 @@ export default class NetworksIndexNetworkController extends BaseController {
                 icon: 'users',
                 route: 'networks.index.network.customers',
             },
+            {
+                label: this.intl.t('storefront.networks.index.network.settings'),
+                icon: 'cog',
+                route: 'networks.index.network.settings',
+            },
         ];
     }
 
-    @action transitionBack({ closeOverlay }) {
+    get storesCount() {
+        return this.model?.stores_count ?? this.model?.stores?.length ?? 0;
+    }
+
+    @action transitionBack({ closeOverlay } = {}) {
         if (this.model.hasDirtyAttributes) {
             // warn user about unsaved changes
             return this.modalsManager.confirm({
@@ -48,8 +57,12 @@ export default class NetworksIndexNetworkController extends BaseController {
     }
 
     @action exit(closeOverlay) {
-        return closeOverlay(() => {
-            return this.transitionToRoute('networks.index');
-        });
+        const leave = () => this.transitionToRoute('networks.index');
+
+        if (typeof closeOverlay === 'function') {
+            return closeOverlay(leave);
+        }
+
+        return leave();
     }
 }
diff --git a/addon/controllers/networks/index/network/index.js b/addon/controllers/networks/index/network/index.js
index e44bed45..2f16ad22 100644
--- a/addon/controllers/networks/index/network/index.js
+++ b/addon/controllers/networks/index/network/index.js
@@ -1,300 +1,117 @@
-import Controller, { inject as controller } from '@ember/controller';
+import Controller from '@ember/controller';
 import { tracked } from '@glimmer/tracking';
 import { inject as service } from '@ember/service';
-import { alias } from '@ember/object/computed';
 import { action } from '@ember/object';
-import getPodMethods from '@fleetbase/ember-core/utils/get-pod-methods';
+import { formatDistanceToNow } from 'date-fns';
+import createShareableLink from '../../../../utils/create-shareable-link';
 
-/**
- * NetworksIndexNetworkIndexController
- *
- * This controller handles the logic for managing networks, gateways, and notification channels.
- *
- * @class NetworksIndexNetworkIndexController
- * @extends Controller
- */
 export default class NetworksIndexNetworkIndexController extends Controller {
-    /**
-     * Controller for managing gateways.
-     *
-     * @property {Controller} gatewaysController
-     */
-    @controller('settings.gateways') gatewaysController;
-
-    /**
-     * Controller for managing notifications.
-     *
-     * @property {Controller} notificationsController
-     */
-    @controller('settings.notifications') notificationsController;
-
-    /**
-     * Notifications service to handle notification logic.
-     *
-     * @property {Service} notifications
-     */
-    @service notifications;
-
-    /**
-     * Fetch service to handle file uploads and other network requests.
-     *
-     * @property {Service} fetch
-     */
-    @service fetch;
-
-    /**
-     * intl service to handle file uploads and other network requests.
-     *
-     * @property {Service} intl
-     */
     @service intl;
-
-    /**
-     * Store service to handle file uploads and other network requests.
-     *
-     * @property {Service} store
-     */
-    @service store;
-
-    /**
-     * Proof of delivery methods.
-     *
-     * @property {Array} podMethods
-     */
-    @tracked podMethods = getPodMethods();
-
-    /**
-     * Loading state, indicating whether a network request is in progress.
-     *
-     * @property {Boolean} isLoading
-     */
-    @tracked isLoading = false;
-
-    @tracked orderConfigs = [];
-
-    /**
-     * Alias for model.gateways, representing the gateways associated with the network.
-     *
-     * @property {Array} gateways
-     */
-    @alias('model.gateways') gateways;
-
-    /**
-     * Alias for model.notification_channels, representing the notification channels associated with the network.
-     *
-     * @property {Array} channels
-     */
-    @alias('model.notification_channels') channels;
-
-    /**
-     * Save network settings.
-     *
-     * @method saveSettings
-     * @public
-     */
-    @action saveSettings() {
-        this.isLoading = true;
-
-        this.model
-            .save()
-            .then(() => {
-                this.notifications.success(this.intl.t('storefront.networks.index.network.index.change-network-saved'));
-            })
-            .catch((error) => {
-                this.notifications.serverError(error);
-            })
-            .finally(() => {
-                this.isLoading = false;
-            });
+    @service notifications;
+    @service hostRouter;
+    @service modalsManager;
+    @tracked network;
+    @tracked overview;
+    @tracked invitations = [];
+    @tracked isInvitePanelOpen = false;
+    @tracked invitePanelTab = 'email';
+
+    get currency() {
+        return this.overview?.currency ?? this.network?.currency;
     }
 
-    /**
-     * Upload a file.
-     *
-     * @method uploadFile
-     * @param {String} type - Type of the file.
-     * @param {File} file - File to upload.
-     * @public
-     */
-    @action uploadFile(type, file) {
-        const prefix = type.replace('storefront_', '');
-
-        this.fetch.uploadFile.perform(
-            file,
-            {
-                path: `uploads/storefront/${this.model.id}/${type}`,
-                key_uuid: this.model.id,
-                key_type: `storefront:network`,
-                type,
-            },
-            (uploadedFile) => {
-                this.model.setProperties({
-                    [`${prefix}_uuid`]: uploadedFile.id,
-                    [`${prefix}_url`]: uploadedFile.url,
-                    [prefix]: uploadedFile,
-                });
-            }
-        );
+    get members() {
+        return this.overview?.members ?? [];
     }
 
-    /**
-     * Create a new payment gateway.
-     *
-     * @method createGateway
-     * @public
-     */
-    @action createGateway() {
-        const gateway = this.store.createRecord('gateway', {
-            owner_uuid: this.model.id,
-            owner_type: 'storefront:network',
-        });
-
-        this.editGateway(gateway, {
-            title: this.intl.t('storefront.networks.index.network.index.create-new-payment-gateway'),
-            acceptButtonText: this.intl.t('storefront.networks.index.network.index.save-gateway'),
-            confirm: async (modal) => {
-                modal.startLoading();
-
-                try {
-                    await gateway.save();
-                    this.notifications.success(this.intl.t('storefront.networks.index.network.index.new-gateway-add-network'));
-                    this.gateways.pushObject(gateway);
-                } catch (error) {
-                    modal.stopLoading();
-                    this.notifications.serverError(error);
-                }
-            },
-            decline: (modal) => {
-                gateway.destroyRecord();
-                modal.done();
-            },
-        });
+    get recentOrders() {
+        return this.overview?.recent_orders ?? [];
     }
 
-    /**
-     * Edit a payment gateway.
-     *
-     * @method editGateway
-     * @param {Object} gateway - The gateway object to edit.
-     * @param {Object} [options={}] - Optional parameters for editing the gateway.
-     * @public
-     */
-    @action editGateway(gateway, options = {}) {
-        if (options === null) {
-            options = {};
-        }
+    get openInvitations() {
+        return this.invitations.filter((invitation) => ['pending', 'declined', 'expired'].includes(invitation.status)).map((invitation) => ({ ...invitation, sentAgo: this.sentAgo(invitation) }));
+    }
 
-        // The settings controller's modal saves the gateway and reports errors; only the message differs.
-        if (!options.successNotification) {
-            options.successNotification = this.intl.t('storefront.networks.index.network.index.payment-gateway-changes-success');
-        }
+    get pendingCount() {
+        return this.invitations.filter((invitation) => invitation.status === 'pending').length;
+    }
 
-        return this.gatewaysController.editGateway(gateway, options);
+    get declinedCount() {
+        return this.invitations.filter((invitation) => invitation.status === 'declined').length;
     }
 
-    /**
-     * Delete a payment gateway.
-     *
-     * @method deleteGateway
-     * @public
-     */
-    @action deleteGateway() {
-        return this.gatewaysController.deleteGateway(...arguments);
+    get shareableLink() {
+        return createShareableLink(`join/network/${this.network?.public_id}`);
     }
 
-    /**
-     * Create a new notification channel.
-     *
-     * @method createChannel
-     * @public
-     */
-    @action createChannel() {
-        const channel = this.store.createRecord('notification-channel', {
-            owner_uuid: this.model.id,
-            owner_type: 'storefront:network',
-        });
+    get shareableLinkEnabled() {
+        return Boolean(this.network?.options?.shareable_link_enabled);
+    }
 
-        this.editChannel(channel, {
-            title: this.intl.t('storefront.networks.index.network.index.create-new-notification-channel'),
-            acceptButtonText: this.intl.t('storefront.networks.index.network.index.create-notification-channel'),
-            confirm: (modal) => {
-                modal.startLoading();
+    sentAgo(invitation) {
+        const sentAt = invitation.resent_at ?? invitation.created_at;
 
-                return channel.save().then((channel) => {
-                    this.notifications.success(this.intl.t('storefront.networks.index.network.index.notification-channel-add-network'));
-                    this.channels.pushObject(channel);
-                });
-            },
-            decline: (modal) => {
-                channel.destroyRecord();
-                modal.done();
-            },
-        });
+        return sentAt ? formatDistanceToNow(new Date(sentAt), { addSuffix: true }) : null;
     }
 
-    /**
-     * Edit a notification channel.
-     *
-     * @method editChannel
-     * @param {Object} channel - The channel object to edit.
-     * @param {Object} [options={}] - Optional parameters for editing the channel.
-     * @public
-     */
-    @action editChannel(channel, options = {}) {
-        if (options === null) {
-            options = {};
-        }
+    @action openInvitePanel(tab = 'email') {
+        this.invitePanelTab = tab;
+        this.isInvitePanelOpen = true;
+    }
 
-        if (!options.confirm) {
-            options.confirm = (modal) => {
-                modal.startLoading();
+    @action closeInvitePanel() {
+        this.isInvitePanelOpen = false;
+    }
 
-                return channel.save().then(() => {
-                    this.notifications.success(this.intl.t('storefront.controllers.networks.index.notification-channel-changes-save'));
-                });
-            };
+    @action async refresh() {
+        try {
+            this.invitations = await this.network.loadInvitations();
+            this.overview = await this.network.loadOverview();
+        } catch (error) {
+            this.notifications.serverError(error);
         }
+    }
 
-        return this.notificationsController.editChannel(channel, options);
+    @action manageStores() {
+        return this.hostRouter.transitionTo('console.storefront.networks.index.network.stores', this.network.public_id);
     }
 
-    /**
-     * Delete a notification channel.
-     *
-     * @method deleteChannel
-     * @public
-     */
-    @action deleteChannel() {
-        return this.notificationsController.deleteChannel(...arguments);
+    @action openSettings() {
+        return this.hostRouter.transitionTo('console.storefront.networks.index.network.settings', this.network.public_id);
     }
 
-    /**
-     * Send a test push notification through a notification channel.
-     *
-     * @method testChannel
-     * @public
-     */
-    @action testChannel() {
-        return this.notificationsController.testChannel(...arguments);
+    @action viewOrders() {
+        return this.hostRouter.transitionTo('console.storefront.networks.index.network.orders', this.network.public_id);
     }
 
-    /**
-     * Make an alertable action.
-     *
-     * @method makeAlertable
-     * @param {String} reason - Reason for the alert.
-     * @param {Array} models - Models associated with the alert.
-     * @public
-     */
-    @action makeAlertable(reason, models) {
-        if (!this.model.alertable || !this.model.alertable?.length) {
-            this.model.set('alertable', {});
+    @action async resendInvitation(invitation) {
+        try {
+            await this.network.resendInvitation(invitation);
+            this.notifications.success(this.intl.t('storefront.networks.invitations.resent', { email: invitation.email }));
+            await this.refresh();
+        } catch (error) {
+            this.notifications.serverError(error);
         }
+    }
 
-        const serializedModels = models.map((model) => {
-            return model.serialize();
-        });
+    @action revokeInvitation(invitation) {
+        return this.modalsManager.confirm({
+            title: this.intl.t('storefront.networks.invitations.revoke-title', { email: invitation.email }),
+            body: this.intl.t('storefront.networks.invitations.revoke-body'),
+            acceptButtonText: this.intl.t('storefront.networks.invitations.revoke'),
+            acceptButtonScheme: 'danger',
+            confirm: async (modal) => {
+                modal.startLoading();
 
-        this.model.set(`alertable.${reason}`, serializedModels);
+                try {
+                    await this.network.revokeInvitation(invitation);
+                    await this.refresh();
+                    modal.done();
+                } catch (error) {
+                    modal.stopLoading();
+                    this.notifications.serverError(error);
+                }
+            },
+        });
     }
 }
diff --git a/addon/controllers/networks/index/network/orders.js b/addon/controllers/networks/index/network/orders.js
index 2411a5d0..d6a011a9 100644
--- a/addon/controllers/networks/index/network/orders.js
+++ b/addon/controllers/networks/index/network/orders.js
@@ -6,329 +6,156 @@ import { tracked, cached } from '@glimmer/tracking';
 import { isBlank } from '@ember/utils';
 import { timeout, task } from 'ember-concurrency';
 import { action } from '@ember/object';
+import { groupOrdersByCheckout, STATUS_TABS } from '../../../../utils/order-groups';
 
+/**
+ * Everything placed through the network, grouped by checkout: a multi-store purchase is one
+ * row that expands into the order each store fulfils.
+ */
 export default class NetworksIndexNetworkOrdersController extends BaseController {
-    /**
-     * Inject the `notifications` service
-     *
-     * @var {Service}
-     */
     @service store;
     @service notifications;
-
-    /**
-     * Inject the `intl` service
-     *
-     * @var {Service}
-     */
     @service intl;
-
-    /**
-     * Inject the `modals-manager` service
-     *
-     * @var {Service}
-     */
     @service modalsManager;
-
-    /**
-     * Inject the `crud` service
-     *
-     * @var {Service}
-     */
     @service crud;
-
-    /**
-     * Inject the `fetch` service
-     *
-     * @var {Service}
-     */
     @service fetch;
-
-    /**
-     * Inject the `filters` service
-     *
-     * @var {Service}
-     */
     @service filters;
-
+    @service hostRouter;
     @service storefrontOrderActions;
 
-    /**
-     * Queryable parameters for this controller's model
-     *
-     * @var {Array}
-     */
-    queryParams = this.registeredQueryParams('network-order', []);
+    queryParams = this.registeredQueryParams('network-order', [{ page: 'o_page' }, { limit: 'o_limit' }, { sort: 'o_sort' }, { query: 'o_query' }, { status: 'o_status' }, { view: 'o_view' }]);
 
     @tracked page = 1;
     @tracked limit;
     @tracked query;
     @tracked sort = '-created_at';
-    @tracked public_id;
-    @tracked internal_id;
-    @tracked tracking;
-    @tracked facilitator;
-    @tracked customer;
-    @tracked driver;
-    @tracked payload;
-    @tracked pickup;
-    @tracked dropoff;
-    @tracked updated_by;
-    @tracked created_by;
     @tracked status;
+    @tracked view = 'grouped';
+    @tracked network;
+    @tracked stores = [];
+    @tracked table;
+
+    get isGrouped() {
+        return this.view !== 'flat';
+    }
+
+    get activeStatusTab() {
+        const current = String(this.status ?? '')
+            .split(',')
+            .filter(Boolean)
+            .sort()
+            .join(',');
 
-    @tracked columns = [
-        {
-            id: 'public-id',
-            label: this.intl.t('storefront.common.id'),
-            valuePath: 'public_id',
-            width: '150px',
-            cellComponent: 'table/cell/anchor',
-            action: this.viewOrder,
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/string',
-        },
-        {
-            id: 'internal-id',
-            label: this.intl.t('storefront.orders.index.internal-id'),
-            valuePath: 'internal_id',
-            width: '125px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/string',
-        },
-        {
-            id: 'customer-name',
-            label: this.intl.t('storefront.orders.index.customer'),
-            valuePath: 'customer.name',
-            cellComponent: 'table/cell/identity',
-            resourceType: 'customer',
-            resourcePath: (order) => relationValue(order, 'customer') ?? buildIdentityStub(order, { type: order.customer_type ?? 'customer', nameKey: 'customer_name' }),
-            action: this.viewCustomer,
-            emptyText: 'No customer',
-            width: '125px',
-            resizable: true,
-            sortable: true,
-            hidden: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: this.intl.t('storefront.orders.index.select-order-customer'),
-            filterParam: 'customer',
-            model: 'customer',
-        },
-        {
-            id: 'pickup-name',
-            label: this.intl.t('storefront.common.pickup'),
-            valuePath: 'pickupName',
-            cellComponent: 'table/cell/identity',
-            resourceType: 'place',
-            resourcePath: (order) => relationValue(relationValue(order, 'payload'), 'pickup') ?? buildIdentityStub(order, { type: 'place', nameKey: 'pickupName' }),
-            width: '160px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: this.intl.t('storefront.orders.index.select-order-pickup-location'),
-            filterParam: 'pickup',
-            model: 'place',
-        },
-        {
-            id: 'dropoff-name',
-            label: this.intl.t('storefront.common.dropoff'),
-            valuePath: 'dropoffName',
-            cellComponent: 'table/cell/identity',
-            resourceType: 'place',
-            resourcePath: (order) => relationValue(relationValue(order, 'payload'), 'dropoff') ?? buildIdentityStub(order, { type: 'place', nameKey: 'dropoffName' }),
-            width: '160px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: this.intl.t('storefront.orders.index.select-order-dropoff-location'),
-            filterParam: 'dropoff',
-            model: 'place',
-        },
-        {
-            id: 'scheduled-at',
-            label: this.intl.t('storefront.orders.index.scheduled-at'),
-            valuePath: 'scheduledAt',
-            sortParam: 'scheduled_at',
-            filterParam: 'scheduled_at',
-            width: '150px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/date',
-        },
-        {
-            id: 'item-count',
-            label: '# Items',
-            cellComponent: 'table/cell/base',
-            valuePath: 'item_count',
-            resizable: true,
-            hidden: true,
-            width: '50px',
-        },
-        {
-            id: 'transaction-amount',
-            label: this.intl.t('storefront.orders.index.transaction-total'),
-            cellComponent: 'table/cell/base',
-            valuePath: 'transaction_amount',
-            width: '50px',
-            resizable: true,
-            hidden: true,
-            sortable: true,
-        },
-        {
-            id: 'tracking-number-tracking-number',
-            label: this.intl.t('storefront.orders.index.tracking-number'),
-            cellComponent: 'table/cell/base',
-            valuePath: 'tracking_number.tracking_number',
-            width: '170px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/string',
-        },
-        {
-            id: 'driver-assigned',
-            label: this.intl.t('storefront.orders.index.driver-assigned'),
-            cellComponent: 'table/cell/identity',
-            resourceType: 'driver',
-            valuePath: 'driver_assigned',
-            resourcePath: (order) =>
-                relationValue(order, 'driver_assigned') ??
-                buildIdentityStub(order, { type: 'driver', load: () => (order.driver_assigned_uuid ? this.store.findRecord('driver', order.driver_assigned_uuid) : null) }),
-            emptyText: 'No driver assigned',
-            width: '170px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: this.intl.t('storefront.orders.index.select-driver-for-order'),
-            filterParam: 'driver',
-            model: 'driver',
-            query: {
-                // no model, serializer, adapter for relations
-                without: ['fleets', 'vendor', 'vehicle', 'currentJob'],
+        return STATUS_TABS.find((tab) => tab.statuses.slice().sort().join(',') === current)?.id ?? 'custom';
+    }
+
+    get statusTabs() {
+        return STATUS_TABS.map((tab) => ({
+            ...tab,
+            label: this.intl.t(`storefront.networks.orders.tabs.${tab.id}`),
+            isActive: tab.id === this.activeStatusTab,
+        }));
+    }
+
+    get storesById() {
+        return this.stores.reduce((map, store) => {
+            map[store.public_id] = store;
+            map[store.id] = store;
+            return map;
+        }, {});
+    }
+
+    /**
+     * Rows for the table: checkout groups in grouped view, orders otherwise.
+     */
+    get rows() {
+        return this.isGrouped ? groupOrdersByCheckout(this.model) : (this.model?.toArray?.() ?? Array.from(this.model ?? []));
+    }
+
+    @cached get columns() {
+        return [
+            {
+                id: 'reference',
+                label: this.intl.t('storefront.networks.orders.columns.reference'),
+                valuePath: 'public_id',
+                cellComponent: 'storefront/network/orders/cell/reference',
+                onView: this.viewOrder,
+                width: '190px',
+                resizable: true,
+                sortable: false,
+            },
+            {
+                id: 'customer',
+                label: this.intl.t('storefront.orders.index.customer'),
+                valuePath: 'customer.name',
+                cellComponent: 'table/cell/identity',
+                resourceType: 'customer',
+                resourcePath: (row) => relationValue(row, 'customer') ?? buildIdentityStub(row, { type: row.customer_type ?? 'customer', nameKey: 'customer_name' }),
+                action: this.viewCustomer,
+                emptyText: this.intl.t('storefront.networks.orders.no-customer'),
+                width: '170px',
+                resizable: true,
+            },
+            {
+                id: 'stores',
+                label: this.intl.t('storefront.networks.index.network.stores.store'),
+                cellComponent: 'storefront/network/orders/cell/stores',
+                storesById: this.storesById,
+                width: '200px',
+                resizable: true,
+            },
+            {
+                id: 'fulfillment',
+                label: this.intl.t('storefront.networks.orders.columns.fulfillment'),
+                cellComponent: 'storefront/network/orders/cell/fulfillment',
+                width: '110px',
+            },
+            {
+                id: 'total',
+                label: this.intl.t('storefront.networks.orders.columns.total'),
+                cellComponent: 'storefront/network/orders/cell/total',
+                width: '140px',
+                resizable: true,
+            },
+            {
+                id: 'driver',
+                label: this.intl.t('storefront.orders.index.driver-assigned'),
+                cellComponent: 'storefront/network/orders/cell/driver',
+                onAssign: this.assignDriver,
+                width: '170px',
+                resizable: true,
+            },
+            {
+                id: 'status',
+                label: this.intl.t('storefront.common.status'),
+                cellComponent: 'storefront/network/orders/cell/status',
+                width: '150px',
+                resizable: true,
             },
-        },
-        {
-            id: 'type',
-            label: this.intl.t('storefront.common.type'),
-            cellComponent: 'cell/humanize',
-            valuePath: 'type',
-            width: '100px',
-            resizable: true,
-            hidden: true,
-            sortable: true,
-        },
-        {
-            id: 'status',
-            label: this.intl.t('storefront.common.status'),
-            valuePath: 'status',
-            cellComponent: 'table/cell/status',
-            width: '120px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/multi-option',
-            // filterOptions: this.statusOptions,
-        },
-        {
-            id: 'created-at',
-            label: this.intl.t('storefront.orders.index.created-at'),
-            valuePath: 'createdAt',
-            sortParam: 'created_at',
-            filterParam: 'created_at',
-            width: '140px',
-            resizable: true,
-            sortable: true,
-            filterable: true,
-            filterComponent: 'filter/date',
-        },
-        {
-            id: 'updated-at',
-            label: this.intl.t('storefront.orders.index.updated-at'),
-            valuePath: 'updatedAt',
-            sortParam: 'updated_at',
-            filterParam: 'updated_at',
-            width: '125px',
-            resizable: true,
-            sortable: true,
-            hidden: true,
-            filterable: true,
-            filterComponent: 'filter/date',
-        },
-        {
-            id: 'created-by-name',
-            label: this.intl.t('storefront.orders.index.created-by'),
-            valuePath: 'created_by_name',
-            width: '125px',
-            resizable: true,
-            hidden: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: 'Select user',
-            filterParam: 'created_by',
-            model: 'user',
-        },
-        {
-            id: 'updated-by-name',
-            label: this.intl.t('storefront.orders.index.updated-by'),
-            valuePath: 'updated_by_name',
-            width: '125px',
-            resizable: true,
-            hidden: true,
-            filterable: true,
-            filterComponent: 'filter/model',
-            filterComponentPlaceholder: this.intl.t('storefront.orders.index.select-user'),
-            filterParam: 'updated_by',
-            model: 'user',
-        },
-        {
-            id: 'row-actions',
-            label: '',
-            cellComponent: 'table/cell/dropdown',
-            ddButtonText: false,
-            ddButtonIcon: 'ellipsis-h',
-            ddButtonIconPrefix: 'fas',
-            ddMenuLabel: 'Order Actions',
-            cellClassNames: 'overflow-visible',
-            wrapperClass: 'flex items-center justify-end mx-2',
-            width: '12%',
-            actions: [
-                {
-                    id: 'view-order',
-                    label: this.intl.t('storefront.orders.index.view-order'),
-                    icon: 'eye',
-                    fn: this.viewOrder,
-                },
-                {
-                    id: 'cancel-order',
-                    label: this.intl.t('storefront.orders.index.cancel-order'),
-                    icon: 'ban',
-                    fn: this.cancelOrder,
-                },
-                {
-                    separator: true,
-                },
-                {
-                    id: 'delete-order',
-                    label: this.intl.t('storefront.orders.index.delete-order'),
-                    icon: 'trash',
-                    fn: this.deleteOrder,
-                },
-            ],
-            sortable: false,
-            filterable: false,
-            resizable: false,
-            searchable: false,
-        },
-    ];
+            {
+                id: 'placed',
+                label: this.intl.t('storefront.networks.orders.columns.placed'),
+                cellComponent: 'storefront/network/orders/cell/placed',
+                width: '110px',
+            },
+            {
+                id: 'row-actions',
+                label: '',
+                cellComponent: 'storefront/network/orders/cell/actions',
+                onView: this.viewOrder,
+                onCancel: this.cancelOrder,
+                onDelete: this.deleteOrder,
+                onChange: this.refresh,
+                cellClassNames: 'overflow-visible',
+                wrapperClass: 'flex items-center justify-end mx-2',
+                width: '170px',
+                sortable: false,
+                filterable: false,
+                resizable: false,
+                searchable: false,
+            },
+        ];
+    }
 
     /**
      * The search task.
@@ -336,24 +163,33 @@ export default class NetworksIndexNetworkOrdersController extends BaseController
      * @void
      */
     @task({ restartable: true }) *search({ target: { value } }) {
-        // if no query don't search
         if (isBlank(value)) {
             this.query = null;
             return;
         }
 
-        // timeout for typing
         yield timeout(250);
 
-        // reset page for results
         if (this.page > 1) {
             this.page = 1;
         }
 
-        // update the query param
         this.query = value;
     }
 
+    @action selectStatusTab(tab) {
+        this.status = tab.statuses?.length ? tab.statuses.join(',') : null;
+        this.page = 1;
+    }
+
+    @action setView(view) {
+        this.view = view;
+    }
+
+    @action refresh() {
+        return this.hostRouter.refresh();
+    }
+
     /**
      * Opens the storefront customer behind an order. A stub that only carries
      * the customer's name has no page to open.
@@ -368,7 +204,21 @@ export default class NetworksIndexNetworkOrdersController extends BaseController
     }
 
     @action viewOrder(order) {
-        return this.storefrontOrderActions.viewOrder(order);
+        return this.storefrontOrderActions.viewOrder(order, { onChange: this.refresh });
+    }
+
+    @action assignDriver(order) {
+        return this.storefrontOrderActions.assignDriver(order, this.refresh);
+    }
+
+    @action cancelOrder(order) {
+        return this.storefrontOrderActions.cancelOrder(order, this.refresh);
+    }
+
+    @action deleteOrder(order) {
+        return this.crud.delete(order, {
+            onSuccess: () => this.refresh(),
+        });
     }
 
     /**
diff --git a/addon/controllers/networks/index/network/settings.js b/addon/controllers/networks/index/network/settings.js
new file mode 100644
index 00000000..9a3fdc72
--- /dev/null
+++ b/addon/controllers/networks/index/network/settings.js
@@ -0,0 +1,300 @@
+import Controller, { inject as controller } from '@ember/controller';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { alias } from '@ember/object/computed';
+import { action } from '@ember/object';
+import getPodMethods from '@fleetbase/ember-core/utils/get-pod-methods';
+
+/**
+ * NetworksIndexNetworkSettingsController
+ *
+ * This controller handles the logic for managing networks, gateways, and notification channels.
+ *
+ * @class NetworksIndexNetworkSettingsController
+ * @extends Controller
+ */
+export default class NetworksIndexNetworkSettingsController extends Controller {
+    /**
+     * Controller for managing gateways.
+     *
+     * @property {Controller} gatewaysController
+     */
+    @controller('settings.gateways') gatewaysController;
+
+    /**
+     * Controller for managing notifications.
+     *
+     * @property {Controller} notificationsController
+     */
+    @controller('settings.notifications') notificationsController;
+
+    /**
+     * Notifications service to handle notification logic.
+     *
+     * @property {Service} notifications
+     */
+    @service notifications;
+
+    /**
+     * Fetch service to handle file uploads and other network requests.
+     *
+     * @property {Service} fetch
+     */
+    @service fetch;
+
+    /**
+     * intl service to handle file uploads and other network requests.
+     *
+     * @property {Service} intl
+     */
+    @service intl;
+
+    /**
+     * Store service to handle file uploads and other network requests.
+     *
+     * @property {Service} store
+     */
+    @service store;
+
+    /**
+     * Proof of delivery methods.
+     *
+     * @property {Array} podMethods
+     */
+    @tracked podMethods = getPodMethods();
+
+    /**
+     * Loading state, indicating whether a network request is in progress.
+     *
+     * @property {Boolean} isLoading
+     */
+    @tracked isLoading = false;
+
+    @tracked orderConfigs = [];
+
+    /**
+     * Alias for model.gateways, representing the gateways associated with the network.
+     *
+     * @property {Array} gateways
+     */
+    @alias('model.gateways') gateways;
+
+    /**
+     * Alias for model.notification_channels, representing the notification channels associated with the network.
+     *
+     * @property {Array} channels
+     */
+    @alias('model.notification_channels') channels;
+
+    /**
+     * Save network settings.
+     *
+     * @method saveSettings
+     * @public
+     */
+    @action saveSettings() {
+        this.isLoading = true;
+
+        this.model
+            .save()
+            .then(() => {
+                this.notifications.success(this.intl.t('storefront.networks.index.network.index.change-network-saved'));
+            })
+            .catch((error) => {
+                this.notifications.serverError(error);
+            })
+            .finally(() => {
+                this.isLoading = false;
+            });
+    }
+
+    /**
+     * Upload a file.
+     *
+     * @method uploadFile
+     * @param {String} type - Type of the file.
+     * @param {File} file - File to upload.
+     * @public
+     */
+    @action uploadFile(type, file) {
+        const prefix = type.replace('storefront_', '');
+
+        this.fetch.uploadFile.perform(
+            file,
+            {
+                path: `uploads/storefront/${this.model.id}/${type}`,
+                key_uuid: this.model.id,
+                key_type: `storefront:network`,
+                type,
+            },
+            (uploadedFile) => {
+                this.model.setProperties({
+                    [`${prefix}_uuid`]: uploadedFile.id,
+                    [`${prefix}_url`]: uploadedFile.url,
+                    [prefix]: uploadedFile,
+                });
+            }
+        );
+    }
+
+    /**
+     * Create a new payment gateway.
+     *
+     * @method createGateway
+     * @public
+     */
+    @action createGateway() {
+        const gateway = this.store.createRecord('gateway', {
+            owner_uuid: this.model.id,
+            owner_type: 'storefront:network',
+        });
+
+        this.editGateway(gateway, {
+            title: this.intl.t('storefront.networks.index.network.index.create-new-payment-gateway'),
+            acceptButtonText: this.intl.t('storefront.networks.index.network.index.save-gateway'),
+            confirm: async (modal) => {
+                modal.startLoading();
+
+                try {
+                    await gateway.save();
+                    this.notifications.success(this.intl.t('storefront.networks.index.network.index.new-gateway-add-network'));
+                    this.gateways.pushObject(gateway);
+                } catch (error) {
+                    modal.stopLoading();
+                    this.notifications.serverError(error);
+                }
+            },
+            decline: (modal) => {
+                gateway.destroyRecord();
+                modal.done();
+            },
+        });
+    }
+
+    /**
+     * Edit a payment gateway.
+     *
+     * @method editGateway
+     * @param {Object} gateway - The gateway object to edit.
+     * @param {Object} [options={}] - Optional parameters for editing the gateway.
+     * @public
+     */
+    @action editGateway(gateway, options = {}) {
+        if (options === null) {
+            options = {};
+        }
+
+        // The settings controller's modal saves the gateway and reports errors; only the message differs.
+        if (!options.successNotification) {
+            options.successNotification = this.intl.t('storefront.networks.index.network.index.payment-gateway-changes-success');
+        }
+
+        return this.gatewaysController.editGateway(gateway, options);
+    }
+
+    /**
+     * Delete a payment gateway.
+     *
+     * @method deleteGateway
+     * @public
+     */
+    @action deleteGateway() {
+        return this.gatewaysController.deleteGateway(...arguments);
+    }
+
+    /**
+     * Create a new notification channel.
+     *
+     * @method createChannel
+     * @public
+     */
+    @action createChannel() {
+        const channel = this.store.createRecord('notification-channel', {
+            owner_uuid: this.model.id,
+            owner_type: 'storefront:network',
+        });
+
+        this.editChannel(channel, {
+            title: this.intl.t('storefront.networks.index.network.index.create-new-notification-channel'),
+            acceptButtonText: this.intl.t('storefront.networks.index.network.index.create-notification-channel'),
+            confirm: (modal) => {
+                modal.startLoading();
+
+                return channel.save().then((channel) => {
+                    this.notifications.success(this.intl.t('storefront.networks.index.network.index.notification-channel-add-network'));
+                    this.channels.pushObject(channel);
+                });
+            },
+            decline: (modal) => {
+                channel.destroyRecord();
+                modal.done();
+            },
+        });
+    }
+
+    /**
+     * Edit a notification channel.
+     *
+     * @method editChannel
+     * @param {Object} channel - The channel object to edit.
+     * @param {Object} [options={}] - Optional parameters for editing the channel.
+     * @public
+     */
+    @action editChannel(channel, options = {}) {
+        if (options === null) {
+            options = {};
+        }
+
+        if (!options.confirm) {
+            options.confirm = (modal) => {
+                modal.startLoading();
+
+                return channel.save().then(() => {
+                    this.notifications.success(this.intl.t('storefront.controllers.networks.index.notification-channel-changes-save'));
+                });
+            };
+        }
+
+        return this.notificationsController.editChannel(channel, options);
+    }
+
+    /**
+     * Delete a notification channel.
+     *
+     * @method deleteChannel
+     * @public
+     */
+    @action deleteChannel() {
+        return this.notificationsController.deleteChannel(...arguments);
+    }
+
+    /**
+     * Send a test push notification through a notification channel.
+     *
+     * @method testChannel
+     * @public
+     */
+    @action testChannel() {
+        return this.notificationsController.testChannel(...arguments);
+    }
+
+    /**
+     * Make an alertable action.
+     *
+     * @method makeAlertable
+     * @param {String} reason - Reason for the alert.
+     * @param {Array} models - Models associated with the alert.
+     * @public
+     */
+    @action makeAlertable(reason, models) {
+        if (!this.model.alertable || !this.model.alertable?.length) {
+            this.model.set('alertable', {});
+        }
+
+        const serializedModels = models.map((model) => {
+            return model.serialize();
+        });
+
+        this.model.set(`alertable.${reason}`, serializedModels);
+    }
+}
diff --git a/addon/controllers/networks/index/network/stores.js b/addon/controllers/networks/index/network/stores.js
index 9df68e66..1914294c 100644
--- a/addon/controllers/networks/index/network/stores.js
+++ b/addon/controllers/networks/index/network/stores.js
@@ -4,9 +4,8 @@ import { inject as service } from '@ember/service';
 import { action, set } from '@ember/object';
 import { isBlank } from '@ember/utils';
 import { timeout, task } from 'ember-concurrency';
-import createShareableLink from '../../../../utils/create-shareable-link';
-import isEmail from '@fleetbase/ember-core/utils/is-email';
 import isModel from '@fleetbase/ember-core/utils/is-model';
+import { formatDistanceToNow } from 'date-fns';
 
 export default class NetworksIndexNetworkStoresController extends BaseController {
     @service notifications;
@@ -93,6 +92,89 @@ export default class NetworksIndexNetworkStoresController extends BaseController
      */
     @tracked categoryModel;
 
+    /**
+     * Invitations this network has sent, loaded by the route.
+     *
+     * @var {Array}
+     */
+    @tracked invitations = [];
+
+    /**
+     * Which membership state the table shows: all, online, offline or invited.
+     *
+     * @var {String}
+     */
+    @tracked statusTab = 'all';
+
+    /**
+     * The table instance, for bulk actions on the selected rows.
+     *
+     * @var {Object}
+     */
+    @tracked table;
+
+    /**
+     * Whether the invite panel is open and which tab it starts on.
+     */
+    @tracked isInvitePanelOpen = false;
+    @tracked invitePanelTab = 'email';
+
+    get openInvitations() {
+        return this.invitations
+            .filter((invitation) => ['pending', 'declined', 'expired'].includes(invitation.status))
+            .map((invitation) => ({ ...invitation, sentAgo: this.sentAgo(invitation) }));
+    }
+
+    get pendingInvitations() {
+        return this.openInvitations.filter((invitation) => invitation.status === 'pending');
+    }
+
+    get members() {
+        return this.model?.toArray?.() ?? Array.from(this.model ?? []);
+    }
+
+    get statusTabs() {
+        const members = this.members;
+
+        return [
+            { id: 'all', label: this.intl.t('storefront.common.all'), count: members.length + this.openInvitations.length },
+            { id: 'online', label: this.intl.t('storefront.common.online'), count: members.filter((store) => store.online).length },
+            { id: 'offline', label: this.intl.t('storefront.common.offline'), count: members.filter((store) => !store.online).length },
+            { id: 'invited', label: this.intl.t('storefront.networks.invitations.invited'), count: this.openInvitations.length },
+        ].map((tab) => ({ ...tab, isActive: tab.id === this.statusTab }));
+    }
+
+    get visibleStores() {
+        switch (this.statusTab) {
+            case 'online':
+                return this.members.filter((store) => store.online);
+            case 'offline':
+                return this.members.filter((store) => !store.online);
+            case 'invited':
+                return [];
+            default:
+                return this.members;
+        }
+    }
+
+    get showInvitations() {
+        return ['all', 'invited'].includes(this.statusTab) && this.openInvitations.length > 0;
+    }
+
+    get selectedStores() {
+        return this.table?.selectedRows ?? [];
+    }
+
+    get hasSelection() {
+        return this.selectedStores.length > 0;
+    }
+
+    sentAgo(invitation) {
+        const sentAt = invitation.resent_at ?? invitation.created_at;
+
+        return sentAt ? formatDistanceToNow(new Date(sentAt), { addSuffix: true }) : null;
+    }
+
     /**
      * All columns applicable for network stores
      *
@@ -103,6 +185,9 @@ export default class NetworksIndexNetworkStoresController extends BaseController
             id: 'name',
             label: this.intl.t('storefront.networks.index.network.stores.store'),
             valuePath: 'name',
+            cellComponent: 'table/cell/identity',
+            resourceType: 'store',
+            popover: true,
             width: '130px',
             resizable: true,
             sortable: true,
@@ -528,8 +613,10 @@ export default class NetworksIndexNetworkStoresController extends BaseController
     @action async removeStore(store) {
         this.modalsManager.confirm({
             title: this.intl.t('storefront.networks.index.network.stores.remove-this-store', { storeName: store.name, networkName: this.network.name }),
-            body: this.intl.t('storefront.networks.index.network.stores.longer-findable-by-this-network'),
-            acceptButtonIcon: 'check',
+            body: this.intl.t('storefront.networks.invitations.remove-body'),
+            acceptButtonText: this.intl.t('storefront.networks.index.network.stores.remove-store-from-network'),
+            acceptButtonScheme: 'danger',
+            acceptButtonIcon: 'trash',
             acceptButtonIconPrefix: 'fas',
             declineButtonIcon: 'times',
             declineButtonIconPrefix: 'fas',
@@ -603,61 +690,143 @@ export default class NetworksIndexNetworkStoresController extends BaseController
      *
      * @action
      */
-    @action invite() {
-        const shareableLink = createShareableLink(`join/network/${this.network.public_id}`);
+    @action invite(network, tab = 'email') {
+        if (isModel(network) && network !== this.network) {
+            this.network = network;
+        }
 
-        this.modalsManager.show('modals/share-network', {
-            title: this.intl.t('storefront.networks.index.network.stores.add-stores-to-network'),
-            acceptButtonText: this.intl.t('storefront.networks.index.network.stores.send-invitations'),
-            acceptButtonIcon: 'paper-plane',
-            acceptButtonDisabled: true,
-            shareableLink,
-            recipients: [],
-            network: this.network,
-            addRecipient: (email) => {
-                const recipients = this.modalsManager.getOption('recipients');
-                recipients.pushObject(email);
-
-                if (recipients.length === 0) {
-                    this.modalsManager.setOption('acceptButtonDisabled', true);
-                } else {
-                    this.modalsManager.setOption('acceptButtonDisabled', false);
+        this.invitePanelTab = typeof tab === 'string' ? tab : 'email';
+        this.isInvitePanelOpen = true;
+    }
+
+    @action closeInvitePanel() {
+        this.isInvitePanelOpen = false;
+    }
+
+    @action selectStatusTab(tab) {
+        this.statusTab = tab.id ?? tab;
+    }
+
+    @action async refreshInvitations() {
+        try {
+            this.invitations = await this.network.loadInvitations();
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @action async afterInvitationsSent() {
+        await this.refreshInvitations();
+        return this.hostRouter.refresh();
+    }
+
+    @action async resendInvitation(invitation) {
+        try {
+            await this.network.resendInvitation(invitation);
+            this.notifications.success(this.intl.t('storefront.networks.invitations.resent', { email: invitation.email }));
+            await this.refreshInvitations();
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @action revokeInvitation(invitation) {
+        return this.modalsManager.confirm({
+            title: this.intl.t('storefront.networks.invitations.revoke-title', { email: invitation.email }),
+            body: this.intl.t('storefront.networks.invitations.revoke-body'),
+            acceptButtonText: this.intl.t('storefront.networks.invitations.revoke'),
+            acceptButtonScheme: 'danger',
+            confirm: async (modal) => {
+                modal.startLoading();
+
+                try {
+                    await this.network.revokeInvitation(invitation);
+                    await this.refreshInvitations();
+                    modal.done();
+                } catch (error) {
+                    modal.stopLoading();
+                    this.notifications.serverError(error);
                 }
             },
-            removeRecipient: (index) => {
-                const recipients = this.modalsManager.getOption('recipients');
-                recipients.removeAt(index);
-
-                if (recipients.length === 0) {
-                    this.modalsManager.setOption('acceptButtonDisabled', true);
-                } else {
-                    this.modalsManager.setOption('acceptButtonDisabled', false);
+        });
+    }
+
+    /**
+     * Assign one category to every selected store.
+     */
+    @action assignCategoryToSelected() {
+        const stores = this.selectedStores;
+
+        if (!stores.length) {
+            return;
+        }
+
+        this.modalsManager.show('modals/add-store-to-category', {
+            title: this.intl.t('storefront.networks.invitations.assign-category-count', { count: stores.length }),
+            acceptButtonText: this.intl.t('storefront.networks.index.network.stores.assign-category'),
+            acceptButtonIcon: 'check',
+            network: this.network,
+            store: stores[0],
+            category: null,
+            setCategory: (category) => this.modalsManager.setOption('category', category),
+            confirm: async (modal) => {
+                const category = modal.getOption('category');
+
+                if (!category) {
+                    return this.notifications.warning(this.intl.t('storefront.networks.invitations.pick-a-category'));
                 }
-            },
-            toggleShareableLink: (enabled) => {
-                set(this.network, 'options.shareable_link_enabled', enabled);
-                this.network.save();
-            },
-            confirm: (modal) => {
-                modal.startLoading();
 
-                const recipients = modal.getOption('recipients');
-                const isValid = recipients.every((email) => isEmail(email));
+                modal.startLoading();
 
-                if (!isValid) {
+                try {
+                    for (const store of stores) {
+                        await this.fetch.post(`networks/${this.network.id}/set-store-category`, { store: store.id, category: category.id }, { namespace: 'storefront/int/v1' });
+                    }
+                    await this.hostRouter.refresh();
+                    modal.done();
+                } catch (error) {
                     modal.stopLoading();
-
-                    return this.notifications.error(this.intl.t('storefront.networks.index.network.stores.invalid-emails-provided-error'));
+                    this.notifications.serverError(error);
                 }
+            },
+        });
+    }
+
+    /**
+     * Remove every selected store from the network.
+     */
+    @action removeSelected() {
+        const stores = this.selectedStores;
+
+        if (!stores.length) {
+            return;
+        }
 
-                return this.network.sendInvites(recipients).then(() => {
+        this.modalsManager.confirm({
+            title: this.intl.t('storefront.networks.invitations.remove-count-title', { count: stores.length, networkName: this.network.name }),
+            body: this.intl.t('storefront.networks.invitations.remove-body'),
+            acceptButtonText: this.intl.t('storefront.networks.index.network.stores.remove-store-from-network'),
+            acceptButtonScheme: 'danger',
+            acceptButtonIcon: 'trash',
+            confirm: async (modal) => {
+                modal.startLoading();
+
+                try {
+                    await this.network.removeStores(stores);
+                    await this.hostRouter.refresh();
+                    modal.done();
+                } catch (error) {
                     modal.stopLoading();
-                    this.notifications.success(this.intl.t('storefront.networks.index.network.stores.invitation-sent-recipients'));
-                });
+                    this.notifications.serverError(error);
+                }
             },
         });
     }
 
+    @action clearSelection() {
+        this.selectedStores.forEach((row) => set(row, 'checked', false));
+    }
+
     /**
      * The columns with what extensions registered under `storefront:network-store:table` merged in.
      *
diff --git a/addon/controllers/networks/index/network/trucks.js b/addon/controllers/networks/index/network/trucks.js
new file mode 100644
index 00000000..d6626276
--- /dev/null
+++ b/addon/controllers/networks/index/network/trucks.js
@@ -0,0 +1,8 @@
+import FoodTrucksIndexController from '@fleetbase/storefront-engine/controllers/food-trucks/index';
+
+/**
+ * Trucks run by the stores of the active network. Creating a truck still happens from its store.
+ */
+export default class NetworksIndexNetworkTrucksController extends FoodTrucksIndexController {
+    queryParams = [{ query: 't_query' }];
+}
diff --git a/addon/helpers/width-style-px.js b/addon/helpers/width-style-px.js
new file mode 100644
index 00000000..4b73b2fb
--- /dev/null
+++ b/addon/helpers/width-style-px.js
@@ -0,0 +1,15 @@
+import { helper } from '@ember/component/helper';
+import { htmlSafe } from '@ember/template';
+
+/**
+ * A safe inline width from a column width such as `190px` or `12%`; nothing when unset.
+ */
+export default helper(function widthStylePx([width]) {
+    if (!width) {
+        return htmlSafe('');
+    }
+
+    const value = String(width).trim();
+
+    return htmlSafe(/^\d+(\.\d+)?(px|%|rem|em)$/.test(value) ? `width: ${value}; flex: 0 0 ${value};` : '');
+});
diff --git a/addon/helpers/width-style.js b/addon/helpers/width-style.js
new file mode 100644
index 00000000..2ee30ed4
--- /dev/null
+++ b/addon/helpers/width-style.js
@@ -0,0 +1,11 @@
+import { helper } from '@ember/component/helper';
+import { htmlSafe } from '@ember/template';
+
+/**
+ * A safe inline width for share bars: `{{width-style 42}}` → `width: 42%`.
+ */
+export default helper(function widthStyle([percent]) {
+    const value = Math.max(0, Math.min(100, Number(percent) || 0));
+
+    return htmlSafe(`width: ${value}%`);
+});
diff --git a/addon/instance-initializers/register-storefront-resource-descriptors.js b/addon/instance-initializers/register-storefront-resource-descriptors.js
new file mode 100644
index 00000000..21f31575
--- /dev/null
+++ b/addon/instance-initializers/register-storefront-resource-descriptors.js
@@ -0,0 +1,125 @@
+import { get } from '@ember/object';
+
+/**
+ * Registers the Storefront resources (store, network) with the shared resource
+ * identity registry so they render as identity cells, pills and summaries with
+ * the same components every other resource uses. Runs for the host and again for
+ * the engine; only fills in keys nobody has registered.
+ */
+export function initialize(owner) {
+    let registry;
+
+    try {
+        registry = owner.lookup('service:resource-registry');
+    } catch {
+        registry = null;
+    }
+
+    if (!registry || typeof registry.registerDescriptors !== 'function') {
+        return;
+    }
+
+    const missing = buildStorefrontResourceDescriptors(owner).filter((descriptor) => !isRegistered(registry, descriptor.key));
+
+    if (missing.length) {
+        registry.registerDescriptors(missing);
+    }
+}
+
+export function buildStorefrontResourceDescriptors(owner) {
+    const first = (record, ...paths) => {
+        for (const path of paths) {
+            const value = record ? get(record, path) : undefined;
+            if (value !== undefined && value !== null && value !== '') {
+                return value;
+            }
+        }
+
+        return null;
+    };
+    const online = (record) => (first(record, 'online') === null ? null : Boolean(get(record, 'online')));
+    const presence = (record) => (online(record) === null ? null : online(record) ? 'online' : 'offline');
+    const fact = (label, value, extra = {}) => (value ? { label, value, ...extra } : null);
+    const transitionTo = (route, record) => {
+        try {
+            const hostRouter = owner.lookup('service:host-router');
+            const publicId = get(record, 'public_id');
+
+            if (hostRouter && publicId) {
+                hostRouter.transitionTo(route, publicId);
+                return true;
+            }
+        } catch {
+            // no host router outside the console
+        }
+
+        return false;
+    };
+
+    return [
+        {
+            key: 'store',
+            labelKey: 'storefront.common.store',
+            icon: 'store',
+            modelNames: ['store'],
+            aliases: ['storefront-store'],
+            polymorphicTypes: ['storefront:store', 'Fleetbase\\Storefront\\Models\\Store'],
+            permission: 'storefront view store',
+            statusTones: {
+                online: 'text-green-500',
+                offline: 'text-gray-400',
+            },
+            title: (store) => first(store, 'name', 'public_id'),
+            identifier: (store) => first(store, 'currency', 'public_id'),
+            image: (store) => first(store, 'logo_url'),
+            online,
+            status: presence,
+            badges: (store) => [first(store, 'currency') ? { key: 'currency', icon: 'coins', label: first(store, 'currency') } : null].filter(Boolean),
+            selectDetails: (store) => [first(store, 'currency'), first(store, 'email')],
+            facts: (store) => [
+                fact('email', first(store, 'email')),
+                fact('phone', first(store, 'phone')),
+                fact('website', first(store, 'website')),
+                fact('currency', first(store, 'currency')),
+                fact('timezone', first(store, 'timezone')),
+            ],
+            canOpen: () => false,
+        },
+        {
+            key: 'network',
+            labelKey: 'storefront.common.network',
+            icon: 'network-wired',
+            modelNames: ['network'],
+            aliases: ['storefront-network'],
+            polymorphicTypes: ['storefront:network', 'Fleetbase\\Storefront\\Models\\Network'],
+            permission: 'storefront view network',
+            statusTones: {
+                online: 'text-green-500',
+                offline: 'text-gray-400',
+            },
+            title: (network) => first(network, 'name', 'public_id'),
+            identifier: (network) => first(network, 'currency', 'public_id'),
+            image: (network) => first(network, 'logo_url'),
+            online,
+            status: presence,
+            badges: (network) => [first(network, 'stores_count') !== null ? { key: 'stores', icon: 'store', label: `${first(network, 'stores_count')} stores` } : null].filter(Boolean),
+            selectDetails: (network) => [first(network, 'currency'), first(network, 'email')],
+            facts: (network) => [fact('email', first(network, 'email')), fact('phone', first(network, 'phone')), fact('website', first(network, 'website')), fact('currency', first(network, 'currency'))],
+            canOpen: () => true,
+            open: (network) => transitionTo('console.storefront.networks.index.network.index', network),
+        },
+    ];
+}
+
+function isRegistered(registry, key) {
+    try {
+        return Boolean(typeof registry.getDescriptor === 'function' ? registry.getDescriptor(key) : registry.descriptors?.some?.((descriptor) => descriptor.key === key));
+    } catch {
+        return false;
+    }
+}
+
+export default {
+    name: 'register-storefront-resource-descriptors',
+    initialize,
+};
diff --git a/addon/models/food-truck.js b/addon/models/food-truck.js
index ba6ee514..4ab50ed0 100644
--- a/addon/models/food-truck.js
+++ b/addon/models/food-truck.js
@@ -17,7 +17,9 @@ export default class FoodTruckModel extends Model {
     /** @attributes */
     @attr('string', { defaultValue: 'storefront:store' }) subject_type;
     @attr('raw') meta;
+    @attr('raw') store_summary;
     @attr('string') status;
+    @attr('boolean') online;
 
     /** @dates */
     @attr('date') created_at;
diff --git a/addon/models/network.js b/addon/models/network.js
index e168842f..fac10611 100644
--- a/addon/models/network.js
+++ b/addon/models/network.js
@@ -37,6 +37,7 @@ export default class NetworkModel extends Model {
     @attr('string') timezone;
     @attr('boolean') online;
     @attr('number') stores_count;
+    @attr('raw') invitations;
     @attr('object') options;
     @attr('string') logo_url;
     @attr('string') backdrop_url;
@@ -154,13 +155,49 @@ export default class NetworkModel extends Model {
         return fetch.post(`networks/${this.id}/remove-stores`, { stores }, { namespace: 'storefront/int/v1' });
     }
 
-    sendInvites(recipients = []) {
+    /**
+     * Send invitations. Accepts a list of emails, or `{ recipients, category_uuid, expires_in_days, message, require_approval }`.
+     */
+    sendInvites(payload = []) {
         const owner = getOwner(this);
         const fetch = owner.lookup(`service:fetch`);
+        const options = Array.isArray(payload) ? { recipients: payload } : { ...payload };
 
         // only send to valid recipients
-        recipients = recipients.filter((email) => isEmail(email));
+        options.recipients = (options.recipients ?? []).filter((email) => isEmail(email));
 
-        return fetch.post(`networks/${this.id}/invite`, { recipients }, { namespace: 'storefront/int/v1' });
+        return fetch.post(`networks/${this.id}/invite`, options, { namespace: 'storefront/int/v1' });
+    }
+
+    loadInvitations() {
+        const owner = getOwner(this);
+        const fetch = owner.lookup(`service:fetch`);
+
+        return fetch.get(`networks/${this.id}/invitations`, {}, { namespace: 'storefront/int/v1' }).then((invitations) => {
+            this.invitations = Array.isArray(invitations) ? invitations : [];
+
+            return this.invitations;
+        });
+    }
+
+    resendInvitation(invitation, options = {}) {
+        const owner = getOwner(this);
+        const fetch = owner.lookup(`service:fetch`);
+
+        return fetch.post(`networks/${this.id}/invitations/${invitation.id ?? invitation}/resend`, options, { namespace: 'storefront/int/v1' });
+    }
+
+    revokeInvitation(invitation) {
+        const owner = getOwner(this);
+        const fetch = owner.lookup(`service:fetch`);
+
+        return fetch.delete(`networks/${this.id}/invitations/${invitation.id ?? invitation}`, {}, { namespace: 'storefront/int/v1' });
+    }
+
+    loadOverview() {
+        const owner = getOwner(this);
+        const fetch = owner.lookup(`service:fetch`);
+
+        return fetch.get(`networks/${this.id}/overview`, {}, { namespace: 'storefront/int/v1' });
     }
 }
diff --git a/addon/routes.js b/addon/routes.js
index d558ea6f..5f901b0c 100644
--- a/addon/routes.js
+++ b/addon/routes.js
@@ -36,8 +36,10 @@ export default buildRoutes(function () {
         this.route('index', { path: '/' }, function () {
             this.route('network', { path: '/:public_id' }, function () {
                 this.route('stores');
+                this.route('trucks');
                 this.route('customers');
                 this.route('orders');
+                this.route('settings');
             });
         });
     });
diff --git a/addon/routes/application.js b/addon/routes/application.js
index 13505b5e..aa96d8f6 100644
--- a/addon/routes/application.js
+++ b/addon/routes/application.js
@@ -1,6 +1,7 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
 import { action } from '@ember/object';
+import { hash } from 'rsvp';
 
 export default class ApplicationRoute extends Route {
     @service fetch;
@@ -42,7 +43,10 @@ export default class ApplicationRoute extends Route {
     }
 
     model() {
-        return this.store.query('store', { limit: 300, sort: '-updated_at' });
+        return hash({
+            stores: this.store.query('store', { limit: 300, sort: '-updated_at' }),
+            networks: this.abilities.cannot('storefront list network') ? [] : this.store.query('network', { limit: 300, sort: '-updated_at' }),
+        });
     }
 
     setupController(controller) {
@@ -50,7 +54,7 @@ export default class ApplicationRoute extends Route {
         controller.loadProductCategories();
     }
 
-    afterModel(stores) {
+    afterModel({ stores }) {
         this.storefront.synchronizeActiveStore(stores);
         this.storefront.listenForIncomingOrders();
     }
diff --git a/addon/routes/networks/index/network.js b/addon/routes/networks/index/network.js
index f0b671f1..a05b3620 100644
--- a/addon/routes/networks/index/network.js
+++ b/addon/routes/networks/index/network.js
@@ -7,6 +7,7 @@ export default class NetworksIndexNetworkRoute extends Route {
     @service abilities;
     @service hostRouter;
     @service notifications;
+    @service storefront;
 
     beforeModel() {
         if (this.abilities.cannot('storefront view network')) {
@@ -18,4 +19,17 @@ export default class NetworksIndexNetworkRoute extends Route {
     model({ public_id }) {
         return this.store.findRecord('network', public_id);
     }
+
+    /**
+     * A URL under a network scopes the console to that network; moving between two
+     * networks re-runs this hook without deactivating the route.
+     */
+    afterModel(network) {
+        this.storefront.setActiveNetwork(network);
+    }
+
+    deactivate() {
+        super.deactivate(...arguments);
+        this.storefront.clearActiveNetwork();
+    }
 }
diff --git a/addon/routes/networks/index/network/customers.js b/addon/routes/networks/index/network/customers.js
index 652e00f8..e46b7b9b 100644
--- a/addon/routes/networks/index/network/customers.js
+++ b/addon/routes/networks/index/network/customers.js
@@ -3,7 +3,6 @@ import { inject as service } from '@ember/service';
 
 export default class NetworksIndexNetworkCustomersRoute extends Route {
     @service store;
-    @service storefront;
 
     queryParams = {
         page: { refreshModel: true, as: 'n_page' },
@@ -21,6 +20,6 @@ export default class NetworksIndexNetworkCustomersRoute extends Route {
     };
 
     model(params) {
-        return this.store.query('customer', { ...params, storefront: this.storefront.getActiveStore('public_id') });
+        return this.store.query('customer', { ...params, network: this.modelFor('networks.index.network').public_id });
     }
 }
diff --git a/addon/routes/networks/index/network/index.js b/addon/routes/networks/index/network/index.js
index d7489cba..42ad56d8 100644
--- a/addon/routes/networks/index/network/index.js
+++ b/addon/routes/networks/index/network/index.js
@@ -1,15 +1,32 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import { hash } from 'rsvp';
 
+/**
+ * The network overview: members, invitations, the last seven days of orders and revenue.
+ */
 export default class NetworksIndexNetworkIndexRoute extends Route {
-    @service store;
+    @service fetch;
+    @service notifications;
 
-    model() {
+    get network() {
         return this.modelFor('networks.index.network');
     }
 
-    async setupController(controller) {
+    model() {
+        const { network } = this;
+
+        return hash({
+            network,
+            overview: this.fetch.get(`networks/${network.id}/overview`, {}, { namespace: 'storefront/int/v1' }).catch(() => null),
+            invitations: this.fetch.get(`networks/${network.id}/invitations`, {}, { namespace: 'storefront/int/v1' }).catch(() => []),
+        });
+    }
+
+    setupController(controller, model) {
         super.setupController(...arguments);
-        controller.orderConfigs = await this.store.findAll('order-config');
+        controller.network = model.network;
+        controller.overview = model.overview;
+        controller.invitations = model.invitations ?? [];
     }
 }
diff --git a/addon/routes/networks/index/network/orders.js b/addon/routes/networks/index/network/orders.js
index 36e2adbf..c573a839 100644
--- a/addon/routes/networks/index/network/orders.js
+++ b/addon/routes/networks/index/network/orders.js
@@ -2,8 +2,17 @@ import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
 
 export default class NetworksIndexNetworkOrdersRoute extends Route {
-    @service storefront;
     @service fetch;
+    @service store;
+
+    queryParams = {
+        page: { refreshModel: true, as: 'o_page' },
+        limit: { refreshModel: true, as: 'o_limit' },
+        sort: { refreshModel: true, as: 'o_sort' },
+        query: { refreshModel: true, as: 'o_query' },
+        status: { refreshModel: true, as: 'o_status' },
+        view: { refreshModel: false, as: 'o_view' },
+    };
 
     async model(params) {
         const response = await this.fetch.get('orders', this.buildQueryParams(params), { namespace: 'storefront/int/v1' });
@@ -14,8 +23,22 @@ export default class NetworksIndexNetworkOrdersRoute extends Route {
         return orders;
     }
 
+    async setupController(controller, model) {
+        super.setupController(controller, model);
+        controller.network = this.modelFor('networks.index.network');
+
+        try {
+            const stores = await this.store.query('store', { network: controller.network.id });
+            controller.stores = stores?.toArray?.() ?? Array.from(stores ?? []);
+        } catch {
+            controller.stores = [];
+        }
+    }
+
     buildQueryParams(params = {}) {
-        return Object.entries({ ...params, storefront: this.storefront.getActiveStore('public_id') }).reduce((queryParams, [key, value]) => {
+        const { view, ...rest } = params;
+
+        return Object.entries({ ...rest, network: this.modelFor('networks.index.network').public_id }).reduce((queryParams, [key, value]) => {
             if (value !== undefined && value !== null && value !== '') {
                 queryParams[key] = value;
             }
diff --git a/addon/routes/networks/index/network/settings.js b/addon/routes/networks/index/network/settings.js
new file mode 100644
index 00000000..e970a9fc
--- /dev/null
+++ b/addon/routes/networks/index/network/settings.js
@@ -0,0 +1,15 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class NetworksIndexNetworkSettingsRoute extends Route {
+    @service store;
+
+    model() {
+        return this.modelFor('networks.index.network');
+    }
+
+    async setupController(controller) {
+        super.setupController(...arguments);
+        controller.orderConfigs = await this.store.findAll('order-config');
+    }
+}
diff --git a/addon/routes/networks/index/network/stores.js b/addon/routes/networks/index/network/stores.js
index 6f8870a6..710c5de4 100644
--- a/addon/routes/networks/index/network/stores.js
+++ b/addon/routes/networks/index/network/stores.js
@@ -23,6 +23,7 @@ export default class NetworksIndexNetworkStoresRoute extends Route {
 
         // set the network to controller
         controller.network = this.network;
+        controller.invitations = (await this.network.loadInvitations().catch(() => [])) ?? [];
 
         // set the cateogry if set
         const { category: categoryId } = this.paramsFor(this.routeName);
diff --git a/addon/routes/networks/index/network/trucks.js b/addon/routes/networks/index/network/trucks.js
new file mode 100644
index 00000000..c676f004
--- /dev/null
+++ b/addon/routes/networks/index/network/trucks.js
@@ -0,0 +1,18 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class NetworksIndexNetworkTrucksRoute extends Route {
+    @service store;
+
+    queryParams = {
+        query: { refreshModel: true, as: 't_query' },
+    };
+
+    get network() {
+        return this.modelFor('networks.index.network');
+    }
+
+    model(params = {}) {
+        return this.store.query('food-truck', { ...params, network: this.network.id });
+    }
+}
diff --git a/addon/serializers/food-truck.js b/addon/serializers/food-truck.js
index 9b96e1f0..9111cfec 100644
--- a/addon/serializers/food-truck.js
+++ b/addon/serializers/food-truck.js
@@ -9,6 +9,7 @@ export default class FoodTruckSerializer extends ApplicationSerializer.extend(Em
      */
     get attrs() {
         return {
+            store_summary: { key: 'store' },
             catalogs: { embedded: 'always' },
             vehicle: { embedded: 'always' },
             serviceArea: { embedded: 'always' },
diff --git a/addon/services/storefront.js b/addon/services/storefront.js
index 3ce5d258..fadae993 100644
--- a/addon/services/storefront.js
+++ b/addon/services/storefront.js
@@ -18,6 +18,7 @@ export default class StorefrontService extends Service.extend(Evented) {
     @service abilities;
     @service socket;
     @tracked activeStoreId;
+    @tracked activeNetworkId;
 
     get hostRouter() {
         const owner = getOwner(this);
@@ -35,6 +36,39 @@ export default class StorefrontService extends Service.extend(Evented) {
         return activeStoreId ? this.store.peekRecord('store', activeStoreId) : null;
     }
 
+    /**
+     * Gets the active network. A network is active only while the user is inside a
+     * network page: the context is derived from the route, not persisted.
+     * @returns {Object|null} The active network record.
+     */
+    get activeNetwork() {
+        return this.activeNetworkId ? (this.store.peekRecord('network', this.activeNetworkId) ?? null) : null;
+    }
+
+    /**
+     * Whether the console is scoped to a network instead of a store.
+     * @returns {boolean}
+     */
+    get isNetworkContext() {
+        return Boolean(this.activeNetwork);
+    }
+
+    /**
+     * The active context type: a store or a network, never both at once.
+     * @returns {'store'|'network'}
+     */
+    get activeContextType() {
+        return this.isNetworkContext ? 'network' : 'store';
+    }
+
+    /**
+     * The record the console is currently scoped to.
+     * @returns {Object|null} the active network, otherwise the active store
+     */
+    get activeContext() {
+        return this.activeNetwork ?? this.activeStore;
+    }
+
     /**
      * Sets the active storefront.
      * @param {Object} store - The store to set as active.
@@ -45,6 +79,45 @@ export default class StorefrontService extends Service.extend(Evented) {
         this.trigger('storefront.changed', store);
     }
 
+    /**
+     * Enters the network context for a network, or leaves it when given nothing.
+     * @param {Object|null} network - The network to scope the console to.
+     */
+    setActiveNetwork(network = null) {
+        const nextNetworkId = network?.id ?? null;
+
+        if ((this.activeNetworkId ?? null) === nextNetworkId) {
+            return;
+        }
+
+        this.activeNetworkId = nextNetworkId;
+        this.trigger('storefront.context.changed', this.activeContextType, this.activeContext);
+    }
+
+    /**
+     * Leaves the network context and returns to the active store.
+     */
+    clearActiveNetwork() {
+        this.setActiveNetwork(null);
+    }
+
+    /**
+     * Gets the active network or a specific property of it.
+     * @param {string|null} property - The property to retrieve from the active network.
+     * @returns {Object|null} The active network or its specific property.
+     */
+    getActiveNetwork(property = null) {
+        if (this.activeNetwork) {
+            if (typeof property === 'string') {
+                return get(this.activeNetwork, property);
+            }
+
+            return this.activeNetwork;
+        }
+
+        return null;
+    }
+
     /**
      * Gets the active store or a specific property of it.
      * @param {string|null} property - The property to retrieve from the active store.
@@ -254,6 +327,48 @@ export default class StorefrontService extends Service.extend(Evented) {
         });
     }
 
+    /**
+     * Creates a new network with given options.
+     * @param {Object} [options={}] - Options for creating the network; `onSuccess(network)` runs after it saves.
+     */
+    createNewNetwork(options = {}) {
+        const network = this.store.createRecord('network');
+        const currency = this.currentUser.getWhoisProperty('currency.code');
+
+        if (currency) {
+            network.setProperties({ currency });
+        }
+
+        this.modalsManager.show('modals/create-network', {
+            title: this.intl.t('storefront.networks.index.create-new-network'),
+            acceptButtonIcon: 'check',
+            acceptButtonIconPrefix: 'fas',
+            declineButtonIcon: 'times',
+            declineButtonIconPrefix: 'fas',
+            network,
+            confirm: async (modal) => {
+                modal.startLoading();
+
+                try {
+                    await network.save();
+                    this.notifications.success(this.intl.t('storefront.networks.index.success-message'));
+                    if (typeof options?.onSuccess === 'function') {
+                        options.onSuccess(network);
+                    }
+                    modal.done();
+                } catch (error) {
+                    modal.stopLoading();
+                    this.notifications.serverError(error);
+                }
+            },
+            decline: (modal) => {
+                network.destroyRecord();
+                modal.done();
+            },
+            ...options,
+        });
+    }
+
     /**
      * Plays an alert sound.
      */
diff --git a/addon/styles/storefront-engine.css b/addon/styles/storefront-engine.css
index 9034af9d..4cc69007 100644
--- a/addon/styles/storefront-engine.css
+++ b/addon/styles/storefront-engine.css
@@ -3092,3 +3092,1133 @@ body[data-theme='dark'] .storefront-order-store__row-value a:hover {
         justify-content: center;
     }
 }
+
+/* ==========================================================================
+   Shared resource card (catalog, truck, network) on Layout::Resource::Card
+   ========================================================================== */
+
+.storefront-card {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+}
+
+.storefront-card__title {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    width: 100%;
+    min-width: 0;
+}
+
+.storefront-card__title-text {
+    flex: 1;
+    min-width: 0;
+    overflow: hidden;
+    color: #111827;
+    font-size: 0.875rem;
+    font-weight: 600;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+a.storefront-card__title-text:hover {
+    color: #2563eb;
+}
+
+body[data-theme='dark'] .storefront-card__title-text {
+    color: #f3f4f6;
+}
+
+.storefront-card__indicator {
+    flex: none;
+}
+
+.storefront-card__subtitle {
+    width: 100%;
+    overflow: hidden;
+    color: #4b5563;
+    font-size: 0.75rem;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+body[data-theme='dark'] .storefront-card__subtitle {
+    color: #9ca3af;
+}
+
+.storefront-card__identity {
+    width: 100%;
+    min-width: 0;
+}
+
+.storefront-card__body {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    padding: 0.5rem 0.75rem;
+}
+
+.storefront-card__media-body {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 10rem;
+    overflow: hidden;
+}
+
+.storefront-card__media {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.storefront-card__chips {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+}
+
+.storefront-card__chip {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.25rem;
+    padding: 0.125rem 0.5rem;
+    border-radius: 9999px;
+    background: #e5e7eb;
+    color: #374151;
+    font-size: 0.6875rem;
+    font-weight: 600;
+    line-height: 1rem;
+}
+
+.storefront-card__chip-count {
+    color: #6b7280;
+    font-weight: 500;
+}
+
+body[data-theme='dark'] .storefront-card__chip {
+    background: #374151;
+    color: #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-card__chip-count {
+    color: #9ca3af;
+}
+
+.storefront-card__empty {
+    color: #6b7280;
+    font-size: 0.75rem;
+}
+
+.storefront-card__actions {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.5rem;
+    width: 100%;
+}
+
+.storefront-card__buttons {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.storefront-card__count {
+    color: #4b5563;
+    font-size: 0.75rem;
+}
+
+body[data-theme='dark'] .storefront-card__count {
+    color: #9ca3af;
+}
+
+.storefront-card__meta {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    margin-top: 0.375rem;
+    width: 100%;
+    color: #4b5563;
+    font-size: 0.75rem;
+}
+
+.storefront-card__meta > span {
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+body[data-theme='dark'] .storefront-card__meta {
+    color: #9ca3af;
+}
+
+.storefront-catalog-card.is-draft {
+    border-style: dashed;
+}
+
+.storefront-network-card__backdrop {
+    background-color: #e5e7eb;
+    background-position: center;
+    background-size: cover;
+}
+
+body[data-theme='dark'] .storefront-network-card__backdrop {
+    background-color: #374151;
+}
+
+.storefront-network-card__logo {
+    max-width: 8rem;
+    max-height: 5rem;
+    object-fit: contain;
+}
+
+/* Hours strip: one cell per weekday, filled when the schedule covers it */
+
+.storefront-hours-strip {
+    display: grid;
+    grid-template-columns: repeat(7, minmax(0, 1fr));
+    gap: 0.25rem;
+    width: 100%;
+}
+
+.storefront-hours-strip__day {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    min-width: 0;
+}
+
+.storefront-hours-strip__label {
+    color: #6b7280;
+    font-size: 0.625rem;
+    line-height: 1;
+    text-align: center;
+}
+
+.storefront-hours-strip__bar {
+    display: block;
+    height: 0.375rem;
+    border-radius: 0.125rem;
+    background: #e5e7eb;
+}
+
+.storefront-hours-strip__day.is-open .storefront-hours-strip__bar {
+    background: #86efac;
+}
+
+body[data-theme='dark'] .storefront-hours-strip__bar {
+    background: #374151;
+}
+
+body[data-theme='dark'] .storefront-hours-strip__day.is-open .storefront-hours-strip__bar {
+    background: #16a34a;
+}
+
+/* Context switcher: stores and networks as peers at the top of the sidebar */
+.storefront-switcher {
+    position: relative;
+    margin-bottom: 0.5rem;
+}
+
+.storefront-switcher__trigger {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    width: 100%;
+    padding: 0.5rem 0.75rem;
+    border: 1px solid #2563eb;
+    border-radius: 0.375rem;
+    background-color: #2563eb;
+    color: #ffffff;
+    font-size: 0.8125rem;
+    font-weight: 600;
+    text-align: left;
+    cursor: pointer;
+    transition: background-color 120ms ease, border-color 120ms ease;
+}
+
+.storefront-switcher__trigger:hover,
+.storefront-switcher__trigger.is-open {
+    background-color: #1d4ed8;
+    border-color: #1d4ed8;
+}
+
+.storefront-switcher__trigger--network {
+    background-color: #4f46e5;
+    border-color: #4f46e5;
+}
+
+.storefront-switcher__trigger--network:hover,
+.storefront-switcher__trigger--network.is-open {
+    background-color: #4338ca;
+    border-color: #4338ca;
+}
+
+.storefront-switcher__icon {
+    display: inline-flex;
+    flex-shrink: 0;
+    opacity: 0.95;
+}
+
+.storefront-switcher__name {
+    flex: 1 1 auto;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.storefront-switcher__kind {
+    flex-shrink: 0;
+    font-size: 0.625rem;
+    font-weight: 500;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+    opacity: 0.85;
+}
+
+.storefront-switcher__caret {
+    display: inline-flex;
+    flex-shrink: 0;
+    opacity: 0.85;
+}
+
+.storefront-switcher__badge {
+    position: absolute;
+    top: -0.375rem;
+    right: -0.25rem;
+    min-width: 1.125rem;
+    padding: 0 0.3rem;
+    border-radius: 9999px;
+    font-size: 0.6875rem;
+    font-weight: 600;
+    line-height: 1.125rem;
+    text-align: center;
+    color: #ffffff;
+    background-color: #f59e0b;
+    pointer-events: none;
+}
+
+.storefront-switcher-menu {
+    position: fixed;
+    z-index: 900;
+    margin: 0;
+    padding: 0.375rem;
+    max-height: calc(100vh - 16px);
+    overflow-y: auto;
+    border: 1px solid #e5e7eb;
+    border-radius: 0.5rem;
+    background-color: #ffffff;
+    box-shadow: 0 10px 25px rgb(0 0 0 / 12%);
+    color: #111827;
+}
+
+.storefront-switcher-menu[data-theme='dark'] {
+    border-color: #374151;
+    background-color: #1f2937;
+    color: #f3f4f6;
+}
+
+.storefront-switcher-menu__group + .storefront-switcher-menu__group {
+    margin-top: 0.25rem;
+}
+
+.storefront-switcher-menu__footer {
+    margin-top: 0.375rem;
+    padding-top: 0.375rem;
+    border-top: 1px solid #e5e7eb;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__footer {
+    border-color: #374151;
+}
+
+.storefront-switcher-menu__head {
+    padding: 0.5rem 0.625rem 0.25rem;
+    font-size: 0.6875rem;
+    font-weight: 600;
+    letter-spacing: 0.04em;
+    text-transform: uppercase;
+    color: #6b7280;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__head {
+    color: #9ca3af;
+}
+
+.storefront-switcher-menu__item {
+    display: flex;
+    align-items: center;
+    gap: 0.625rem;
+    width: 100%;
+    padding: 0.5rem 0.625rem;
+    border: 0;
+    border-radius: 0.375rem;
+    background: transparent;
+    font: inherit;
+    font-size: 0.8125rem;
+    color: #111827;
+    text-align: left;
+    cursor: pointer;
+}
+
+.storefront-switcher-menu__item:hover,
+.storefront-switcher-menu__item:focus-visible {
+    background-color: #f3f4f6;
+    outline: none;
+}
+
+.storefront-switcher-menu__item.is-active {
+    background-color: #eff6ff;
+    font-weight: 600;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__item {
+    color: #f3f4f6;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__item:hover,
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__item:focus-visible {
+    background-color: #374151;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__item.is-active {
+    background-color: rgb(55 65 81 / 80%);
+}
+
+.storefront-switcher-menu__label {
+    flex: 1 1 auto;
+    min-width: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.storefront-switcher-menu__meta {
+    flex-shrink: 0;
+    font-size: 0.6875rem;
+    font-weight: 400;
+    color: #6b7280;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__meta {
+    color: #9ca3af;
+}
+
+.storefront-switcher-menu__check {
+    display: inline-flex;
+    flex-shrink: 0;
+    color: #2563eb;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-menu__check {
+    color: #60a5fa;
+}
+
+.storefront-switcher-menu__empty {
+    padding: 0.5rem 0.625rem;
+    font-size: 0.8125rem;
+    color: #9ca3af;
+}
+
+.storefront-switcher-tile {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 1.25rem;
+    height: 1.25rem;
+    flex-shrink: 0;
+    border-radius: 0.25rem;
+}
+
+.storefront-switcher-tile--store {
+    background-color: #dbeafe;
+    color: #1d4ed8;
+}
+
+.storefront-switcher-tile--network {
+    background-color: #e0e7ff;
+    color: #4338ca;
+}
+
+.storefront-switcher-tile--muted {
+    background-color: #f3f4f6;
+    color: #1d4ed8;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-tile--store {
+    background-color: rgb(29 78 216 / 35%);
+    color: #93c5fd;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-tile--network {
+    background-color: rgb(67 56 202 / 35%);
+    color: #a5b4fc;
+}
+
+.storefront-switcher-menu[data-theme='dark'] .storefront-switcher-tile--muted {
+    background-color: #374151;
+    color: #93c5fd;
+}
+
+/* Network page: full-page container for the network sections */
+.storefront-network-page {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+}
+
+.storefront-network-page__header {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.75rem 1rem;
+    border-bottom: 1px solid #e5e7eb;
+    background-color: #f9fafb;
+}
+
+body[data-theme='dark'] .storefront-network-page__header {
+    border-color: #374151;
+    background-color: rgb(55 65 81 / 50%);
+}
+
+.storefront-network-page__logo {
+    width: 2.5rem;
+    height: 2.5rem;
+    flex-shrink: 0;
+    border-radius: 0.375rem;
+    object-fit: cover;
+    border: 1px solid #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-network-page__logo {
+    border-color: #4b5563;
+}
+
+.storefront-network-page__identity {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    flex: 1 1 auto;
+}
+
+.storefront-network-page__name {
+    margin: 0;
+    font-size: 1rem;
+    font-weight: 600;
+    line-height: 1.25rem;
+    color: #111827;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+body[data-theme='dark'] .storefront-network-page__name {
+    color: #f3f4f6;
+}
+
+.storefront-network-page__meta {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-network-page__meta {
+    color: #9ca3af;
+}
+
+.storefront-network-page__body {
+    display: flex;
+    flex-direction: column;
+    flex: 1 1 auto;
+    min-height: 0;
+}
+
+/* Network overview: stat tiles, member rows, share bars */
+.storefront-stat-grid {
+    display: grid;
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+    gap: 0.75rem;
+}
+
+@media (max-width: 1200px) {
+    .storefront-stat-grid {
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+    }
+}
+
+@media (max-width: 768px) {
+    .storefront-stat-grid {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+}
+
+.storefront-stat-tile {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+    padding: 0.75rem 1rem;
+    border: 1px solid #e5e7eb;
+    border-radius: 0.375rem;
+    background-color: #ffffff;
+    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 5%);
+}
+
+body[data-theme='dark'] .storefront-stat-tile {
+    border-color: #374151;
+    background-color: #1f2937;
+}
+
+.storefront-stat-tile__label {
+    font-size: 0.75rem;
+    font-weight: 500;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-stat-tile__label {
+    color: #9ca3af;
+}
+
+.storefront-stat-tile__value {
+    font-size: 1.5rem;
+    line-height: 2rem;
+    font-weight: 600;
+    color: #111827;
+}
+
+body[data-theme='dark'] .storefront-stat-tile__value {
+    color: #f3f4f6;
+}
+
+.storefront-stat-tile__hint {
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-stat-tile__hint {
+    color: #9ca3af;
+}
+
+.storefront-member-list {
+    display: flex;
+    flex-direction: column;
+}
+
+.storefront-member-row {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding: 0.625rem 1rem;
+    border-bottom: 1px solid #e5e7eb;
+    font-size: 0.875rem;
+}
+
+body[data-theme='dark'] .storefront-member-row {
+    border-color: #374151;
+}
+
+.storefront-member-row:last-child {
+    border-bottom: 0;
+}
+
+.storefront-member-row--link {
+    border-top: 1px solid #e5e7eb;
+    background-color: #f9fafb;
+}
+
+body[data-theme='dark'] .storefront-member-row--link {
+    border-color: #374151;
+    background-color: rgb(55 65 81 / 50%);
+}
+
+.storefront-member-row__logo {
+    width: 2rem;
+    height: 2rem;
+    flex-shrink: 0;
+    border-radius: 0.375rem;
+    object-fit: cover;
+    border: 1px solid #e5e7eb;
+}
+
+.storefront-member-row__logo--icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #6b7280;
+    background-color: #f3f4f6;
+}
+
+body[data-theme='dark'] .storefront-member-row__logo {
+    border-color: #4b5563;
+}
+
+body[data-theme='dark'] .storefront-member-row__logo--icon {
+    color: #9ca3af;
+    background-color: #374151;
+}
+
+.storefront-member-row__identity {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    flex: 1 1 auto;
+}
+
+.storefront-member-row__name {
+    display: flex;
+    align-items: center;
+    gap: 0.375rem;
+    font-weight: 600;
+    color: #111827;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+body[data-theme='dark'] .storefront-member-row__name {
+    color: #f3f4f6;
+}
+
+.storefront-member-row__meta,
+.storefront-member-row__share-label {
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-member-row__meta,
+body[data-theme='dark'] .storefront-member-row__share-label {
+    color: #9ca3af;
+}
+
+.storefront-member-row__share {
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+    width: 14rem;
+    flex-shrink: 0;
+}
+
+.storefront-member-row__amount {
+    font-weight: 600;
+    color: #111827;
+    white-space: nowrap;
+}
+
+body[data-theme='dark'] .storefront-member-row__amount {
+    color: #f3f4f6;
+}
+
+.storefront-member-row__link {
+    max-width: 18rem;
+    font-size: 0.75rem;
+}
+
+.storefront-share-bar {
+    height: 0.375rem;
+    border-radius: 9999px;
+    background-color: #e5e7eb;
+    overflow: hidden;
+}
+
+body[data-theme='dark'] .storefront-share-bar {
+    background-color: #374151;
+}
+
+.storefront-share-bar__fill {
+    height: 100%;
+    border-radius: 9999px;
+    background-color: #0ea5e9;
+}
+
+.storefront-empty-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 0.75rem;
+    padding: 0.75rem 1rem;
+    font-size: 0.875rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-empty-row {
+    color: #9ca3af;
+}
+
+/* Status tabs above a table */
+.storefront-status-tabs {
+    display: flex;
+    gap: 0.25rem;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-status-tabs {
+    border-color: #374151;
+}
+
+.storefront-status-tab {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.375rem;
+    padding: 0.5rem 0.75rem;
+    margin-bottom: -1px;
+    border-bottom: 2px solid transparent;
+    font-size: 0.875rem;
+    font-weight: 500;
+    color: #6b7280;
+    background: none;
+}
+
+.storefront-status-tab:hover {
+    color: #111827;
+}
+
+.storefront-status-tab.is-active {
+    color: #0284c7;
+    border-bottom-color: #0284c7;
+}
+
+body[data-theme='dark'] .storefront-status-tab {
+    color: #9ca3af;
+}
+
+body[data-theme='dark'] .storefront-status-tab:hover {
+    color: #f3f4f6;
+}
+
+body[data-theme='dark'] .storefront-status-tab.is-active {
+    color: #38bdf8;
+    border-bottom-color: #38bdf8;
+}
+
+.storefront-status-tab__count {
+    padding: 0 0.375rem;
+    border-radius: 9999px;
+    font-size: 0.6875rem;
+    background-color: #f3f4f6;
+    color: #374151;
+}
+
+body[data-theme='dark'] .storefront-status-tab__count {
+    background-color: #374151;
+    color: #e5e7eb;
+}
+
+/* Bulk action bar shown while rows are selected */
+.storefront-bulk-bar {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    padding: 0.5rem 0.75rem;
+    border: 1px solid #bae6fd;
+    border-radius: 0.375rem;
+    background-color: #f0f9ff;
+    font-size: 0.875rem;
+}
+
+body[data-theme='dark'] .storefront-bulk-bar {
+    border-color: #0c4a6e;
+    background-color: rgb(12 74 110 / 35%);
+}
+
+.storefront-bulk-bar__count {
+    font-weight: 600;
+    color: #0369a1;
+    margin-right: 0.25rem;
+}
+
+body[data-theme='dark'] .storefront-bulk-bar__count {
+    color: #7dd3fc;
+}
+
+.storefront-invitation-list {
+    border: 1px solid #e5e7eb;
+    border-radius: 0.375rem;
+    overflow: hidden;
+}
+
+body[data-theme='dark'] .storefront-invitation-list {
+    border-color: #374151;
+}
+
+.storefront-invitation-list__title {
+    padding: 0.5rem 1rem;
+    font-size: 0.75rem;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.04em;
+    color: #6b7280;
+    background-color: #f9fafb;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-invitation-list__title {
+    color: #9ca3af;
+    background-color: rgb(55 65 81 / 50%);
+    border-color: #374151;
+}
+
+.storefront-invitation-list__note {
+    padding: 0.5rem 1rem;
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+/* Invite panel */
+.storefront-invite-panel__lede {
+    padding: 0.75rem 1rem 0;
+    font-size: 0.875rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-invite-panel__lede {
+    color: #9ca3af;
+}
+
+.storefront-invite-panel__tabs {
+    display: flex;
+    gap: 0.25rem;
+    margin: 0.75rem 1rem 0;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-invite-panel__tabs {
+    border-color: #374151;
+}
+
+.storefront-invite-panel__tab {
+    padding: 0.5rem 0.75rem;
+    margin-bottom: -1px;
+    border-bottom: 2px solid transparent;
+    font-size: 0.875rem;
+    font-weight: 500;
+    color: #6b7280;
+    background: none;
+}
+
+.storefront-invite-panel__tab.is-active {
+    color: #0284c7;
+    border-bottom-color: #0284c7;
+}
+
+body[data-theme='dark'] .storefront-invite-panel__tab {
+    color: #9ca3af;
+}
+
+body[data-theme='dark'] .storefront-invite-panel__tab.is-active {
+    color: #38bdf8;
+    border-bottom-color: #38bdf8;
+}
+
+.storefront-invite-panel__section {
+    padding: 1rem;
+}
+
+.storefront-invite-panel__flag {
+    margin-top: 0.375rem;
+    font-size: 0.75rem;
+    color: #b45309;
+}
+
+.storefront-invite-panel__flag--error {
+    color: #b91c1c;
+}
+
+.storefront-invite-panel__hint {
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+.storefront-invite-panel__footer {
+    display: flex;
+    justify-content: flex-end;
+    gap: 0.5rem;
+    padding-top: 0.5rem;
+    border-top: 1px solid #e5e7eb;
+}
+
+body[data-theme='dark'] .storefront-invite-panel__footer {
+    border-color: #374151;
+}
+
+/* Network orders: grouped by checkout */
+.storefront-view-toggle {
+    display: inline-flex;
+    border: 1px solid #d1d5db;
+    border-radius: 0.375rem;
+    overflow: hidden;
+}
+
+body[data-theme='dark'] .storefront-view-toggle {
+    border-color: #4b5563;
+}
+
+.storefront-view-toggle__option {
+    padding: 0.25rem 0.625rem;
+    font-size: 0.75rem;
+    font-weight: 500;
+    color: #6b7280;
+    background-color: #ffffff;
+}
+
+.storefront-view-toggle__option.is-active {
+    color: #ffffff;
+    background-color: #0284c7;
+}
+
+body[data-theme='dark'] .storefront-view-toggle__option {
+    color: #d1d5db;
+    background-color: #1f2937;
+}
+
+body[data-theme='dark'] .storefront-view-toggle__option.is-active {
+    background-color: #0369a1;
+}
+
+.storefront-order-ref {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+}
+
+.storefront-order-ref__id {
+    font-weight: 600;
+    color: #111827;
+    white-space: nowrap;
+}
+
+.storefront-order-ref__id--link {
+    color: #0284c7;
+}
+
+body[data-theme='dark'] .storefront-order-ref__id {
+    color: #f3f4f6;
+}
+
+body[data-theme='dark'] .storefront-order-ref__id--link {
+    color: #38bdf8;
+}
+
+.storefront-order-ref__meta,
+.storefront-order-total__tip,
+.storefront-order-driver__note,
+.storefront-order-driver__muted {
+    font-size: 0.75rem;
+    color: #6b7280;
+}
+
+body[data-theme='dark'] .storefront-order-ref__meta,
+body[data-theme='dark'] .storefront-order-total__tip,
+body[data-theme='dark'] .storefront-order-driver__note,
+body[data-theme='dark'] .storefront-order-driver__muted {
+    color: #9ca3af;
+}
+
+.storefront-identity-stack {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 0.25rem;
+}
+
+.storefront-identity-stack__text {
+    max-width: 10rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.storefront-identity-stack__overflow {
+    padding: 0 0.375rem;
+    border-radius: 9999px;
+    font-size: 0.6875rem;
+    font-weight: 600;
+    background-color: #f3f4f6;
+    color: #374151;
+}
+
+body[data-theme='dark'] .storefront-identity-stack__overflow {
+    background-color: #374151;
+    color: #e5e7eb;
+}
+
+.storefront-fulfillment {
+    display: inline-flex;
+    align-items: center;
+    font-size: 0.75rem;
+    font-weight: 500;
+}
+
+.storefront-fulfillment--pickup {
+    color: #7c3aed;
+}
+
+.storefront-fulfillment--delivery {
+    color: #0284c7;
+}
+
+.storefront-order-total {
+    display: flex;
+    flex-direction: column;
+}
+
+.storefront-order-total__amount {
+    font-weight: 600;
+    color: #111827;
+}
+
+body[data-theme='dark'] .storefront-order-total__amount {
+    color: #f3f4f6;
+}
+
+.storefront-order-driver {
+    display: flex;
+    flex-direction: column;
+    gap: 0.125rem;
+}
+
+.storefront-order-actions {
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 0.375rem;
+}
+
+.storefront-order-group {
+    display: flex;
+    flex-direction: column;
+    background-color: #f9fafb;
+    border-left: 3px solid #0284c7;
+}
+
+body[data-theme='dark'] .storefront-order-group {
+    background-color: rgb(55 65 81 / 40%);
+    border-left-color: #0369a1;
+}
+
+.storefront-order-group__row {
+    display: flex;
+    align-items: center;
+    padding: 0.5rem 0.75rem 0.5rem 2.75rem;
+    border-bottom: 1px solid #e5e7eb;
+    font-size: 0.875rem;
+}
+
+body[data-theme='dark'] .storefront-order-group__row {
+    border-color: #374151;
+}
+
+.storefront-order-group__row:last-child {
+    border-bottom: 0;
+}
+
+.storefront-order-group__cell {
+    flex: 1 1 0;
+    min-width: 0;
+    padding: 0 0.5rem;
+}
diff --git a/addon/templates/application.hbs b/addon/templates/application.hbs
index 3d592ac3..c662df0a 100644
--- a/addon/templates/application.hbs
+++ b/addon/templates/application.hbs
@@ -1,5 +1,15 @@
 <EmberWormhole @to="sidebar-menu-items">
-    <StoreSelector @stores={{@model}} @activeStore={{this.activeStore}} @buttonClass="mb-2" @onCreateStore={{this.createNewStorefront}} @onSwitchStore={{this.switchActiveStore}} />
+    <StoreSelector
+        @stores={{@model.stores}}
+        @networks={{@model.networks}}
+        @activeStore={{this.activeStore}}
+        @activeNetwork={{this.activeNetwork}}
+        @buttonClass="mb-2"
+        @onCreateStore={{this.createNewStorefront}}
+        @onSwitchStore={{this.switchActiveStore}}
+        @onCreateNetwork={{this.createNewNetwork}}
+        @onSwitchNetwork={{this.switchActiveNetwork}}
+    />
     <Layout::Sidebar::Navigator @items={{this.navigationItems}} @searchPlaceholder="Search Storefront..." @searchProvider={{this.searchNavigation}} />
 </EmberWormhole>
 
diff --git a/addon/templates/catalogs/index.hbs b/addon/templates/catalogs/index.hbs
index 148cbb92..f24757bc 100644
--- a/addon/templates/catalogs/index.hbs
+++ b/addon/templates/catalogs/index.hbs
@@ -1,47 +1,22 @@
-<Layout::Section::Header @title={{t "storefront.common.catalogs"}}>
+<Layout::Section::Header @title={{t "storefront.common.catalogs"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
     <Button @type="primary" @icon="plus" @text={{t "storefront.common.new"}} @permission="storefront create catalog" @onClick={{this.createCatalog}} class="mr-2" />
     <Button @icon="long-arrow-up" @iconClass="rotate-icon-45" @text={{t "storefront.common.export"}} @permission="storefront export catalog" />
 </Layout::Section::Header>
 
-<Layout::Section::Body>
-    <div class="h-full p-4 overflow-y-scroll">
-        <div class="grid grid-cols-3 gap-4">
-            {{#each @model as |catalog|}}
-                <div class="px-2 py-2 border rounded-lg dark:bg-gray-800 dark:border-gray-700 border-gray-200 bg-gray-100">
-                    <div class="flex flex-row mb-2">
-                        <div class="flex flex-col flex-1">
-                            <div class="text-sm font-semibold">{{catalog.name}}</div>
-                            <div class="mt-1 flex flex-row">
-                                <div class="text-sm">{{n-a catalog.description}}</div>
-                            </div>
-                            <div>
-                                <Badge @status={{catalog.status}} @hideStatusDot={{true}} />
-                            </div>
-                        </div>
-                    </div>
-                    <div class="mt-2 flex flex-row space-x-2">
-                        <Button
-                            @type="default"
-                            @icon="pencil"
-                            @text={{t "storefront.common.edit"}}
-                            @onClick={{fn this.editCatalog catalog}}
-                            @permission="storefront update food-truck"
-                            @size="sm"
-                        />
-                        <Button
-                            @type="danger"
-                            @icon="trash"
-                            @text={{t "storefront.common.delete"}}
-                            @onClick={{fn this.deleteCatalog catalog}}
-                            @permission="storefront delete food-truck"
-                            @size="sm"
-                        />
-                    </div>
-                </div>
-            {{/each}}
-        </div>
-    </div>
-    <Spacer @height="200px" />
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <Layout::Resource::CardsGrid
+        @resource="catalog"
+        @data={{@model}}
+        @columns="4"
+        @containerClass="p-4"
+        @emptyStateText={{t "storefront.catalogs.index.empty-state"}}
+        @createButtonText={{t "storefront.catalogs.index.create-catalog"}}
+        @onCreateNew={{this.createCatalog}}
+        class="h-full"
+        as |Item|
+    >
+        <Storefront::Catalog::Card @catalog={{Item.model}} @onEdit={{this.editCatalog}} @onDelete={{this.deleteCatalog}} />
+    </Layout::Resource::CardsGrid>
 </Layout::Section::Body>
 
-{{outlet}}
\ No newline at end of file
+{{outlet}}
diff --git a/addon/templates/food-trucks/index.hbs b/addon/templates/food-trucks/index.hbs
index 61cf0250..a9d38462 100644
--- a/addon/templates/food-trucks/index.hbs
+++ b/addon/templates/food-trucks/index.hbs
@@ -1,49 +1,22 @@
-<Layout::Section::Header @title={{t "storefront.common.food-trucks"}}>
+<Layout::Section::Header @title={{t "storefront.common.food-trucks"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
     <Button @type="primary" @icon="plus" @text={{t "storefront.common.new"}} @onClick={{this.createFoodTruck}} @permission="storefront create food-truck" class="mr-2" />
     <Button @icon="long-arrow-up" @iconClass="rotate-icon-45" @text={{t "storefront.common.export"}} @permission="storefront export food-truck" />
 </Layout::Section::Header>
 
-<Layout::Section::Body>
-    <div class="p-4">
-        <div class="grid grid-cols-3 gap-4">
-            {{#each @model as |foodTruck|}}
-                <div class="px-2 py-2 border rounded-lg dark:bg-gray-800 dark:border-gray-700 border-gray-200 bg-gray-100">
-                    <div class="flex flex-row mb-2">
-                        <div class="flex flex-col flex-1 min-w-0">
-                            <Vehicle::Pill @vehicle={{foodTruck.vehicle}} @titleFallback="No vehicle" @static={{not foodTruck.vehicle.id}} class="mb-1" />
-                            <div class="flex flex-row items-center space-x-1">
-                                <FaIcon @icon="draw-polygon" class="mr-1" />
-                                <div class="text-sm">{{n-a foodTruck.service_area.name}}</div>
-                                <div>•</div>
-                                <div class="text-sm">{{n-a foodTruck.zone.name}}</div>
-                            </div>
-                            {{!-- <div>{{format-point foodTruck.vehicle.location}}</div> --}}
-                            <Badge @status={{foodTruck.status}} @hideStatusDot={{true}} />
-                        </div>
-                    </div>
-                    <div class="mt-2 flex flex-row space-x-2">
-                        <Button
-                            @type="default"
-                            @icon="pencil"
-                            @text={{t "storefront.common.edit"}}
-                            @onClick={{fn this.editFoodTruck foodTruck}}
-                            @permission="storefront update food-truck"
-                            @size="xs"
-                        />
-                        <Button @type="default" @icon="square-check" @text="Catalogs" @onClick={{fn this.assignCatalogs foodTruck}} @permission="storefront update food-truck" @size="xs" />
-                        <Button
-                            @type="danger"
-                            @icon="trash"
-                            @text={{t "storefront.common.delete"}}
-                            @onClick={{fn this.deleteFoodTruck foodTruck}}
-                            @permission="storefront delete food-truck"
-                            @size="xs"
-                        />
-                    </div>
-                </div>
-            {{/each}}
-        </div>
-    </div>
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <Layout::Resource::CardsGrid
+        @resource="truck"
+        @data={{@model}}
+        @columns="4"
+        @containerClass="p-4"
+        @emptyStateText={{t "storefront.trucks.index.empty-state"}}
+        @createButtonText={{t "storefront.trucks.index.create-truck"}}
+        @onCreateNew={{this.createFoodTruck}}
+        class="h-full"
+        as |Item|
+    >
+        <Storefront::Truck::Card @truck={{Item.model}} @onEdit={{this.editFoodTruck}} @onAssignCatalogs={{this.assignCatalogs}} @onDelete={{this.deleteFoodTruck}} />
+    </Layout::Resource::CardsGrid>
 </Layout::Section::Body>
 
-{{outlet}}
\ No newline at end of file
+{{outlet}}
diff --git a/addon/templates/networks/index.hbs b/addon/templates/networks/index.hbs
index 010d79e7..9829f650 100644
--- a/addon/templates/networks/index.hbs
+++ b/addon/templates/networks/index.hbs
@@ -1,78 +1,29 @@
-<Layout::Section::Header @title={{t "storefront.common.network"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <Button @type="primary" @icon="plus" @iconPrefix="fas" @text={{t "storefront.common.new"}} class="mr-2" @onClick={{this.createNetwork}} @permission="storefront create network" />
-</Layout::Section::Header>
+{{#if this.storefront.isNetworkContext}}
+    {{outlet}}
+{{else}}
+    <Layout::Section::Header @title={{t "storefront.common.network"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+        <Button @type="primary" @icon="plus" @iconPrefix="fas" @text={{t "storefront.common.new"}} class="mr-2" @onClick={{this.createNetwork}} @permission="storefront create network" />
+    </Layout::Section::Header>
 
-<Layout::Section::Body>
-    <div class="h-screen overflow-y-scroll p-6">
-        <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-2 lg:gap-4">
-            {{#each @model as |network|}}
-                <div class="mr-4 w-full">
-                    <div class="rounded-md border dark:border-gray-700 shadow-sm">
-                        <div class="p-4 flex items-center justify-center rounded-t-md h-36" {{background-url network.backdrop_url overlay=true}}>
-                            <Image src={{network.logo_url}} class="w-32" alt={{network.name}} @fallbackSrc="https://flb-assets.s3.ap-southeast-1.amazonaws.com/static/image-file-icon.png" />
-                        </div>
-                        <div class="border-t dark:border-gray-700 px-4 py-2">
-                            <div class="flex items-start justify-between">
-                                <div>
-                                    <LinkTo @route="networks.index.network" @model={{network}} class="font-bold text-lg text-gray-700 dark:text-gray-100">{{network.name}}</LinkTo>
-                                </div>
-                                <div>
-                                    <DropdownButton @renderInPlace={{true}} @size="xs" @icon="cog" @iconPrefix="fas" @textClass="block truncate text-gray-700 dark:text-gray-100" as |dd|>
-                                        <div role="menu" class="next-dd-menu" aria-orientation="vertical" aria-labelledby="user-menu">
-                                            <div class="px-1">
-                                                <div class="next-dd-title">
-                                                    {{t "storefront.networks.index.network-option"}}
-                                                </div>
-                                            </div>
-                                            <div class="next-dd-menu-seperator"></div>
-                                            <div role="group" class="px-1">
-                                                <a
-                                                    href="javascript:;"
-                                                    class="next-dd-item"
-                                                    role="menuitem"
-                                                    {{on "click" (dropdown-fn dd this.manageNetwork network)}}
-                                                    disabled={{cannot "storefront view network"}}
-                                                >
-                                                    <div class="w-7">
-                                                        <FaIcon @icon="network-wired" class="mr-2" />
-                                                    </div>
-                                                    <span>{{t "storefront.networks.index.manage-network"}}</span>
-                                                </a>
-                                                <a
-                                                    href="javascript:;"
-                                                    class="next-dd-item"
-                                                    role="menuitem"
-                                                    {{on "click" (dropdown-fn dd this.sendInvites network)}}
-                                                    disabled={{cannot "storefront update network"}}
-                                                >
-                                                    <div class="w-7">
-                                                        <FaIcon @icon="envelope-open-text" class="mr-2" />
-                                                    </div>
-                                                    <span>{{t "storefront.networks.index.send-invite"}}</span>
-                                                </a>
-                                                <a
-                                                    href="javascript:;"
-                                                    class="next-dd-item text-red-500 hover:bg-opacity-75"
-                                                    role="menuitem"
-                                                    disabled={{cannot "storefront delete network"}}
-                                                    {{on "click" (dropdown-fn dd this.deleteNetwork network)}}
-                                                >
-                                                    <div class="w-7">
-                                                        <FaIcon @icon="trash" class="mr-2 text-red-500" />
-                                                    </div>
-                                                    <span class="text-red-500">{{t "storefront.networks.index.delete-network"}}</span>
-                                                </a>
-                                            </div>
-                                        </div>
-                                    </DropdownButton>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            {{/each}}
-        </div>
-    </div>
-</Layout::Section::Body>
+    <Layout::Section::Body class="overflow-y-scroll-i h-full">
+        <Layout::Resource::CardsGrid
+            @resource="network"
+            @data={{@model}}
+            @columns="4"
+            @showPagination={{true}}
+            @page={{this.page}}
+            @onPageChange={{fn (mut this.page)}}
+            @paginationMeta={{@model.meta}}
+            @containerClass="p-4"
+            @emptyStateText={{t "storefront.networks.index.empty-state"}}
+            @createButtonText={{t "storefront.networks.index.create-network"}}
+            @onCreateNew={{this.createNetwork}}
+            class="h-full"
+            as |Item|
+        >
+            <Storefront::Network::Card @network={{Item.model}} @onOpen={{this.manageNetwork}} @onInvite={{this.sendInvites}} @onDelete={{this.deleteNetwork}} />
+        </Layout::Resource::CardsGrid>
+    </Layout::Section::Body>
 
-{{outlet}}
\ No newline at end of file
+    {{outlet}}
+{{/if}}
diff --git a/addon/templates/networks/index/network.hbs b/addon/templates/networks/index/network.hbs
index a1511336..07cc6073 100644
--- a/addon/templates/networks/index/network.hbs
+++ b/addon/templates/networks/index/network.hbs
@@ -1,17 +1,18 @@
-<Overlay @position="right" @isResizable={{true}} @noBackdrop={{true}} @width="900px" @minResizeWidth={{570}} @fullHeight={{true}}>
-    <Overlay::Header @title={{t "storefront.networks.index.network.manage-network"}} @onPressCancel={{this.transitionBack}} />
-    <Overlay::Body class="p-0i" @increaseInnerBodyHeightBy="0" @wrapperClass="space-y-4 pt-4">
-        <div class="flex flex-col">
-            <div class="px-4 flex items-center section-header-title">
-                <FaIcon @icon="network-wired" @size="lg" class="text-sky-500 mr-3" />
-                <h3 class="text-lg font-semibold dark:text-white">
-                    {{@model.name}}
-                </h3>
+<div class="storefront-network-page" data-test-storefront-network-page>
+    <div class="storefront-network-page__header">
+        <Image src={{@model.logo_url}} @fallbackSrc={{config "defaultValues.placeholderImage"}} alt={{n-a @model.name ""}} class="storefront-network-page__logo" />
+        <div class="storefront-network-page__identity">
+            <h2 class="storefront-network-page__name" data-test-network-page-name>{{n-a @model.name}}</h2>
+            <div class="storefront-network-page__meta">
+                <Badge @status={{if @model.online "online" "offline"}} @text={{if @model.online (t "storefront.common.online") (t "storefront.common.offline")}} @size="xs" />
+                <span>{{t "storefront.networks.card.stores-count" count=this.storesCount}}</span>
+                {{#if @model.currency}}
+                    <span>{{@model.currency}}</span>
+                {{/if}}
             </div>
         </div>
-        <TabNavigation @tabs={{this.tabs}}>
-            {{outlet}}
-            <Spacer @height="400px" />
-        </TabNavigation>
-    </Overlay::Body>
-</Overlay>
\ No newline at end of file
+    </div>
+    <div class="storefront-network-page__body">
+        {{outlet}}
+    </div>
+</div>
diff --git a/addon/templates/networks/index/network/index.hbs b/addon/templates/networks/index/network/index.hbs
index e0d28ae5..7216f968 100644
--- a/addon/templates/networks/index/network/index.hbs
+++ b/addon/templates/networks/index/network/index.hbs
@@ -1,463 +1,130 @@
-<div class="space-y-2">
-    <ContentPanel @title={{t "storefront.networks.index.network.index.general-network-settings-title"}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top">
-        <div class="space-y-4">
-            <div>
-                <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
-                    {{t "storefront.networks.index.network.index.general-network-settings-title"}}
-                </h1>
-                <p class="mt-1 text-sm text-gray-500">
-                    {{t "storefront.networks.index.network.index.general-network-settings-subtitle"}}
-                </p>
-            </div>
-
-            <InputGroup
-                @name={{t "storefront.networks.index.network.index.general-network-settings-form.name"}}
-                @value={{@model.name}}
-                @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.name-placeholder"}}
-                @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.name-help-text"}}
-            />
-            <InputGroup
-                @name={{t "storefront.networks.index.network.index.general-network-settings-form.description"}}
-                @value={{@model.description}}
-                @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.description-placeholder"}}
-                @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.description-help-text"}}
-            />
-
-            <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.currency"}}>
-                <CurrencySelect @currency={{@model.currency}} @onCurrencyChange={{fn (mut @model.currency)}} @triggerClass="w-full form-select" />
-            </InputGroup>
-
-            <InputGroup @name="Default Order Config" @helpText="Select the order config which will apply to all orders created for this network.">
-                <Select
-                    @value={{@model.order_config_uuid}}
-                    @options={{this.orderConfigs}}
-                    @optionValue="id"
-                    @optionLabel="name"
-                    @onSelect={{fn (mut @model.order_config_uuid)}}
-                    @placeholder="Select default order config"
-                    class="w-full"
-                />
-            </InputGroup>
-
-            <ContentPanel
-                @title={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.panel-title"}}
-                @open={{false}}
-                @wrapperClass="bordered-classic"
-            >
-                <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.phone"}}>
-                    <PhoneInput @value={{@model.phone}} @onInput={{fn (mut @model.phone)}} class="form-input w-full" />
-                </InputGroup>
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email"}}
-                    @value={{@model.email}}
-                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email-help-text"}}
-                />
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website"}}
-                    @value={{@model.website}}
-                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website-help-text"}}
-                />
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook"}}
-                    @value={{@model.facebook}}
-                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook-help-text"}}
-                />
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram"}}
-                    @value={{@model.instagram}}
-                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram-help-text"}}
-                />
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter"}}
-                    @value={{@model.twitter}}
-                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter-help-text"}}
-                />
-            </ContentPanel>
-
-            <ContentPanel
-                @title={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.panel-title"}}
-                @open={{false}}
-                @wrapperClass="bordered-classic"
-            >
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.logo-label"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.logo-help-text"}}
-                >
-                    <div class="flex flex-row items-center">
-                        <img src={{@model.logo_url}} alt={{concat @model.name " logo"}} class="h-20 w-64 border dark:border-gray-900 rounded-md mr-4" />
-                        <FileUpload @name="logo" @accept="image/*" @onFileAdded={{fn this.uploadFile "storefront_logo"}} as |queue|>
-                            <a tabindex={{0}} class="flex items-center px-0 mt-2 text-xs no-underline truncate btn btn-sm btn-default">
-                                {{#if queue.files.length}}
-                                    <Spinner class="mr-1" />
-                                    <span>
-                                        {{t "storefront.common.uploading"}}
-                                    </span>
-                                {{else}}
-                                    <FaIcon @icon="image" class="mr-1" />
-                                    <span>
-                                        {{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.upload-logo-button-text"}}
-                                    </span>
-                                {{/if}}
-                            </a>
-                        </FileUpload>
-                    </div>
-                </InputGroup>
-
-                <InputGroup
-                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.backdrop-label"}}
-                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.backdrop-help-text"}}
-                >
-                    <div class="flex flex-row items-center">
-                        <img src={{@model.backdrop_url}} alt={{concat @model.name " backdrop"}} class="h-20 w-64 border dark:border-gray-900 rounded-md mr-4" />
-                        <FileUpload @name="backdrop" @accept="image/*" @onFileAdded={{fn this.uploadFile "storefront_backdrop"}} as |queue|>
-                            <a tabindex={{0}} class="flex items-center px-0 mt-2 text-xs no-underline truncate btn btn-sm btn-default">
-                                {{#if queue.files.length}}
-                                    <Spinner class="mr-1" />
-                                    <span>
-                                        {{t "storefront.common.uploading"}}
-                                    </span>
-                                {{else}}
-                                    <FaIcon @icon="image" class="mr-1" />
-                                    <span>
-                                        {{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.upload-backdrop-button-text"}}
-                                    </span>
-                                {{/if}}
-                            </a>
-                        </FileUpload>
-                    </div>
-                </InputGroup>
-            </ContentPanel>
-
-            <ContentPanel @title={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.panel-title"}} @open={{false}} @wrapperClass="bordered-classic">
-                <div>
-                    <p class="dark:text-gray-100 mb-4">{{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.panel-description"}}</p>
-                    <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.new-order-alert-label"}} @wrapperClass="mb-0">
-                        <ModelSelectMultiple
-                            @modelName="user"
-                            @selectedItemComponent={{component "select-option/user" compact=true}}
-                            @selectedModel={{@model.alertable.for_new_order}}
-                            @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.new-order-alert-placeholder"}}
-                            @triggerClass="form-select form-input multiple"
-                            @infiniteScroll={{false}}
-                            @renderInPlace={{true}}
-                            @onChange={{fn this.makeAlertable "for_new_order"}}
-                            as |model|
-                        >
-                            <SelectOption::User @option={{model}} />
-                        </ModelSelectMultiple>
-                    </InputGroup>
-                </div>
-            </ContentPanel>
+<Layout::Section::Header @title={{t "storefront.networks.index.network.overview"}}>
+    <Button @icon="store" @text={{t "storefront.networks.index.network.stores.store"}} @size="sm" @onClick={{this.manageStores}} @wrapperClass="mr-2" />
+    <Button @icon="cog" @text={{t "storefront.networks.index.network.settings"}} @size="sm" @onClick={{this.openSettings}} @wrapperClass="mr-2" @permission="storefront update network" />
+    <Button @type="primary" @icon="envelope-open-text" @text={{t "storefront.networks.invitations.invite-stores"}} @size="sm" @onClick={{fn this.openInvitePanel "email"}} @permission="storefront update network" />
+</Layout::Section::Header>
 
-            <div class="store-boolean-settings">
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.online}} @onToggle={{fn (mut @model.online)}}>
-                        <FaIcon @icon="plug" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.online"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.tax_enabled}} @onToggle={{fn (mut @model.options.tax_enabled)}}>
-                        <FaIcon @icon="percent" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-tax"
-                            }}</span>
-                    </Toggle>
-                    {{#if @model.options.tax_enabled}}
-                        <InputGroup
-                            @wrapperClass="mb-0 mt-2"
-                            @type="number"
-                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.tax-percentage-input-label"}}
-                            @value={{@model.options.tax_percentage}}
-                            @placeholder={{t "storefront.networks.index.network.index.placeholder-tax"}}
-                            @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.tax-percentage-input-help-text"}}
-                        />
-                    {{/if}}
-                </div>
-                <div class="input-group">
-                    <Toggle
-                        @isToggled={{@model.options.required_checkout_min}}
-                        @onToggle={{fn (mut @model.options.required_checkout_min)}}
-                        @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.minimum-order-amount-input-help-text"}}
-                    >
-                        <FaIcon @icon="dollar-sign" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-minimum-order-amount"
-                            }}</span>
-                    </Toggle>
-                    {{#if @model.options.required_checkout_min}}
-                        <MoneyInput
-                            @wrapperClass="mb-0 mt-2"
-                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.minimum-order-amount-input-label"}}
-                            @value={{@model.options.required_checkout_min_amount}}
-                            @currency={{@model.currency}}
-                        />
-                    {{/if}}
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.auto_accept_orders}} @onToggle={{fn (mut @model.options.auto_accept_orders)}}>
-                        <FaIcon @icon="robot" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.auto-accept-incoming-orders"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.auto_dispatch}} @onToggle={{fn (mut @model.options.auto_dispatch)}}>
-                        <FaIcon @icon="paper-plane" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.auto-dispatch-orders"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.require_pod}} @onToggle={{fn (mut @model.options.require_pod)}}>
-                        <FaIcon @icon="signature" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.require-proof-of-delivery"
-                            }}</span>
-                    </Toggle>
-                    {{#if @model.options.require_pod}}
-                        <InputGroup
-                            @wrapperClass="mb-0 mt-2"
-                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.proof-of-delivery-method-label"}}
-                        >
-                            <Select
-                                @options={{this.podMethods}}
-                                @optionValue="value"
-                                @optionLabel="name"
-                                @value={{@model.pod_method}}
-                                @onSelect={{fn (mut @model.pod_method)}}
-                                class="w-full"
-                            />
-                        </InputGroup>
-                    {{/if}}
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.cod_enabled}} @onToggle={{fn (mut @model.options.cod_enabled)}}>
-                        <FaIcon @icon="money-bill-wave" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-cash-on-delivery"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.pickup_enabled}} @onToggle={{fn (mut @model.options.pickup_enabled)}}>
-                        <FaIcon @icon="person-booth" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-order-pickup"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.tips_enabled}} @onToggle={{fn (mut @model.options.tips_enabled)}}>
-                        <FaIcon @icon="cash-register" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-tips"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.delivery_tips_enabled}} @onToggle={{fn (mut @model.options.delivery_tips_enabled)}}>
-                        <FaIcon @icon="face-smile" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-delivery-tips"
-                            }}</span>
-                    </Toggle>
-                </div>
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.multi_cart_enabled}} @onToggle={{fn (mut @model.options.multi_cart_enabled)}}>
-                        <FaIcon @icon="gifts" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-multi-cart-checkout"
-                            }}</span>
-                    </Toggle>
-                </div>
-                {{#if (and @model.options.tips_enabled @model.options.multi_cart_enabled)}}
-                    {{! Off: a multi-store order's store tip goes to the network. On: it is split across the stores by their share of the order. }}
-                    <div class="input-group">
-                        <Toggle @isToggled={{@model.options.split_tips_across_stores}} @onToggle={{fn (mut @model.options.split_tips_across_stores)}}>
-                            <FaIcon @icon="code-branch" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                    "storefront.networks.index.network.index.general-network-settings-form.config-switches.split-tips-across-stores"
-                                }}</span>
-                        </Toggle>
-                    </div>
-                {{/if}}
-                <div class="input-group">
-                    <Toggle @isToggled={{@model.options.reviews_enabled}} @onToggle={{fn (mut @model.options.reviews_enabled)}}>
-                        <FaIcon @icon="star" @prefix="fas" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
-                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-user-reviews"
-                            }}</span>
-                    </Toggle>
-                </div>
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <div class="storefront-network-overview p-4 space-y-4" data-test-network-overview>
+        <div class="storefront-stat-grid">
+            <div class="storefront-stat-tile" data-test-stat="stores">
+                <div class="storefront-stat-tile__label">{{t "storefront.networks.index.network.stores.store"}}</div>
+                <div class="storefront-stat-tile__value">{{this.overview.stores.total}}</div>
+                <div class="storefront-stat-tile__hint">{{t "storefront.networks.overview.online-count" count=this.overview.stores.online}}</div>
             </div>
-
-            <div class="flex justify-end">
-                <Button
-                    @type="primary"
-                    @text={{t "storefront.networks.index.network.index.general-network-settings-form.save-changes-button-text"}}
-                    @icon="save"
-                    @size="lg"
-                    @isLoading={{this.isLoading}}
-                    @onClick={{this.saveSettings}}
-                />
+            <div class="storefront-stat-tile" data-test-stat="invitations">
+                <div class="storefront-stat-tile__label">{{t "storefront.networks.invitations.title"}}</div>
+                <div class="storefront-stat-tile__value">{{this.pendingCount}}</div>
+                <div class="storefront-stat-tile__hint">{{t "storefront.networks.overview.invitations-hint" declined=this.declinedCount}}</div>
             </div>
-        </div>
-    </ContentPanel>
-
-    <ContentPanel @title={{t "storefront.networks.index.network.index.api-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
-        <div class="space-y-6">
-            <div>
-                <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
-                    {{t "storefront.networks.index.network.index.api-panel.panel-header"}}
-                </h1>
-                <p class="mt-1 text-sm text-gray-500">
-                    {{t "storefront.networks.index.network.index.api-panel.panel-description"}}
-                </p>
+            <div class="storefront-stat-tile" data-test-stat="orders">
+                <div class="storefront-stat-tile__label">{{t "storefront.networks.overview.orders-7d"}}</div>
+                <div class="storefront-stat-tile__value">{{this.overview.orders.count_7d}}</div>
+                <div class="storefront-stat-tile__hint">{{t "storefront.networks.overview.multi-store-count" count=this.overview.orders.multi_store_7d}}</div>
             </div>
-
-            <InputGroup
-                @name={{t "storefront.networks.index.network.index.api-panel.network-key-label"}}
-                @helpText={{t "storefront.networks.index.network.index.api-panel.network-key-help-text"}}
-            >
-                <ClickToReveal @value={{@model.key}} @clickToCopy={{true}} class="form-input disabled" />
-            </InputGroup>
-        </div>
-    </ContentPanel>
-
-    <ContentPanel @title={{t "storefront.networks.index.network.index.payment-gateways-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
-        <div class="space-y-6">
-            <div class="flex justify-between">
-                <div>
-                    <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
-                        {{t "storefront.networks.index.network.index.payment-gateways-panel.panel-title"}}
-                    </h1>
-                    <p class="mt-1 text-sm text-gray-500">
-                        {{t "storefront.networks.index.network.index.payment-gateways-panel.panel-description"}}
-                    </p>
-                </div>
-                <div>
-                    <Button
-                        @icon="plus"
-                        @iconPrefix="fas"
-                        @type="primary"
-                        @text={{t "storefront.networks.index.network.index.payment-gateways-panel.new-gateway-button-text"}}
-                        @onClick={{this.createGateway}}
-                    />
-                </div>
+            <div class="storefront-stat-tile" data-test-stat="revenue">
+                <div class="storefront-stat-tile__label">{{t "storefront.networks.overview.revenue-7d"}}</div>
+                <div class="storefront-stat-tile__value">{{format-currency this.overview.revenue.total_7d this.currency}}</div>
+                <div class="storefront-stat-tile__hint">{{t "storefront.networks.overview.tips-hint" tips=(format-currency this.overview.revenue.tips_7d this.currency)}}</div>
+            </div>
+            <div class="storefront-stat-tile" data-test-stat="customers">
+                <div class="storefront-stat-tile__label">{{t "storefront.common.customers"}}</div>
+                <div class="storefront-stat-tile__value">{{this.overview.customers.total}}</div>
+                <div class="storefront-stat-tile__hint">{{t "storefront.networks.overview.new-customers" count=this.overview.customers.new_this_month}}</div>
             </div>
-
-            {{#each this.gateways as |gateway|}}
-                <ContentPanel @title={{gateway.name}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top">
-                    {{! Read-only summary; changes are made in the gateway modal, which saves them. }}
-                    <InputGroup
-                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.name"}}
-                        @value={{gateway.name}}
-                        @disabled={{true}}
-                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.name-help-text"}}
-                    />
-                    <InputGroup
-                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.code"}}
-                        @value={{gateway.code}}
-                        @disabled={{true}}
-                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.code-help-text"}}
-                    />
-                    <InputGroup
-                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.callback-url"}}
-                        @value={{gateway.callback_url}}
-                        @disabled={{true}}
-                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.callback-url-help-text"}}
-                    />
-                    <InputGroup
-                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.return-url"}}
-                        @value={{gateway.return_url}}
-                        @disabled={{true}}
-                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.return-url-help-text"}}
-                    />
-                    <div class="input-group">
-                        <Checkbox
-                            @value={{gateway.sandbox}}
-                            @label={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.sandbox-toggle-label"}}
-                            @disabled={{true}}
-                        />
-                    </div>
-                    <div>
-                        <h4 class="mb-2 font-semibold text-sm dark:text-white">{{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.config-header-label"}}</h4>
-                        {{#each-in gateway.config as |key value|}}
-                            {{#if (is-bool-value value)}}
-                                <div class="input-group">
-                                    <Checkbox @value={{value}} @label={{smart-humanize key}} @disabled={{true}} />
-                                </div>
-                            {{else}}
-                                <InputGroup @name={{smart-humanize key}}>
-                                    <Input
-                                        @type={{if (can "storefront update gateway") "text" "password"}}
-                                        class="form-input w-full"
-                                        placeholder={{humanize key}}
-                                        @value={{value}}
-                                        disabled
-                                    />
-                                </InputGroup>
-                            {{/if}}
-                        {{/each-in}}
-                    </div>
-                    <div class="flex flex-row items-center space-x-2">
-                        {{#if (can "storefront update gateway")}}
-                            <Button
-                                @size="sm"
-                                @type="primary"
-                                @icon="pencil"
-                                @text={{t "storefront.settings.gateways.edit-payment-gateway"}}
-                                @onClick={{fn this.editGateway gateway null}}
-                            />
-                        {{/if}}
-                        {{#if (can "storefront delete gateway")}}
-                            <Button
-                                @size="sm"
-                                @type="danger"
-                                @icon="trash"
-                                @text={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.delete-gateway-button-text"}}
-                                @onClick={{fn this.deleteGateway gateway}}
-                            />
-                        {{/if}}
-                    </div>
-                </ContentPanel>
-            {{/each}}
         </div>
-    </ContentPanel>
 
-    <ContentPanel @title={{t "storefront.networks.index.network.index.notification-channels-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
-        <div class="space-y-6">
-            <div class="flex justify-between">
-                <div class="w-3/4">
-                    <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
-                        {{t "storefront.networks.index.network.index.notification-channels-panel.panel-header"}}
-                    </h1>
-                    <p class="mt-1 text-sm text-gray-500">
-                        {{t "storefront.networks.index.network.index.notification-channels-panel.panel-description"}}
-                    </p>
+        <ContentPanel @title={{t "storefront.networks.overview.members-title" count=this.members.length}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top" @panelBodyClass="p-0">
+            {{#if this.members.length}}
+                <div class="storefront-member-list">
+                    {{#each this.members as |member|}}
+                        <div class="storefront-member-row" data-test-member-row={{member.public_id}}>
+                            <Image src={{member.logo_url}} @fallbackSrc={{config "defaultValues.placeholderImage"}} alt={{member.name}} class="storefront-member-row__logo" />
+                            <div class="storefront-member-row__identity">
+                                <div class="storefront-member-row__name">
+                                    <span>{{member.name}}</span>
+                                    <FaIcon @icon="circle" @size="xs" class="storefront-card__indicator {{if member.online 'text-green-500' 'text-gray-400'}}" />
+                                </div>
+                                <div class="storefront-member-row__meta">{{member.currency}} · {{t "storefront.networks.overview.orders-count-7d" count=member.orders_7d}}</div>
+                            </div>
+                            <div class="storefront-member-row__share">
+                                <div class="storefront-member-row__share-label">{{format-currency member.revenue_7d this.currency}} · {{t "storefront.networks.overview.share-of-network" share=member.revenue_share}}</div>
+                                <div class="storefront-share-bar"><div class="storefront-share-bar__fill" style={{width-style member.share}}></div></div>
+                            </div>
+                            <Badge @status={{if member.online "online" "offline"}} @text={{if member.online (t "storefront.common.online") (t "storefront.common.offline")}} @size="xs" />
+                        </div>
+                    {{/each}}
                 </div>
-                <div>
-                    <Button
-                        @icon="plus"
-                        @iconPrefix="fas"
-                        @type="primary"
-                        @text={{t "storefront.networks.index.network.index.notification-channels-panel.new-channel-button-text"}}
-                        @onClick={{this.createChannel}}
-                    />
+            {{else}}
+                <div class="storefront-empty-row">
+                    <span>{{t "storefront.networks.overview.no-members"}}</span>
+                    <Button @size="xs" @icon="envelope-open-text" @text={{t "storefront.networks.invitations.invite-stores"}} @onClick={{fn this.openInvitePanel "email"}} />
                 </div>
-            </div>
+            {{/if}}
+        </ContentPanel>
 
-            <div class="space-y-3">
-                {{#each this.channels as |notificationChannel|}}
-                    <div class="flex px-4 py-2 items-center justify-between shadow-sm rounded-md dark:bg-gray-900 bg-gray-200">
-                        <div>
-                            <span class="dark:text-gray-50">{{notificationChannel.name}}</span>
-                        </div>
-                        <div class="flex items-center">
-                            <Button @size="xs" @type="default" @text={{t "storefront.settings.notification.send-test"}} @wrapperClass="mr-2" @onClick={{fn this.testChannel notificationChannel}} />
-                            <Button @size="xs" @type="default" @text={{t "storefront.common.edit"}} @wrapperClass="mr-2" @onClick={{fn this.editChannel notificationChannel}} />
-                            <Button @size="xs" @type="danger" @text={{t "storefront.common.delete"}} @onClick={{fn this.deleteChannel notificationChannel}} />
+        <ContentPanel @title={{t "storefront.networks.invitations.title"}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top" @panelBodyClass="p-0">
+            {{#if this.openInvitations.length}}
+                <div class="storefront-member-list">
+                    {{#each this.openInvitations as |invitation|}}
+                        <div class="storefront-member-row" data-test-invitation-row={{invitation.id}}>
+                            <div class="storefront-member-row__logo storefront-member-row__logo--icon"><FaIcon @icon="at" /></div>
+                            <div class="storefront-member-row__identity">
+                                <div class="storefront-member-row__name">{{invitation.email}}</div>
+                                <div class="storefront-member-row__meta">{{t "storefront.networks.invitations.sent-ago" ago=invitation.sentAgo}}</div>
+                            </div>
+                            <Badge @status={{invitation.status}} @text={{t (concat "storefront.networks.invitations.status." invitation.status)}} @size="xs" />
+                            <div class="storefront-card__buttons">
+                                {{#if (eq invitation.status "pending")}}
+                                    <Button @size="xs" @icon="paper-plane" @text={{t "storefront.networks.invitations.resend"}} @onClick={{fn this.resendInvitation invitation}} @permission="storefront update network" />
+                                    <Button @size="xs" @icon="ban" @helpText={{t "storefront.networks.invitations.revoke"}} @onClick={{fn this.revokeInvitation invitation}} @permission="storefront update network" />
+                                {{else}}
+                                    <Button @size="xs" @icon="redo" @text={{t "storefront.networks.invitations.invite-again"}} @onClick={{fn this.resendInvitation invitation}} @permission="storefront update network" />
+                                {{/if}}
+                            </div>
                         </div>
-                    </div>
-                {{/each}}
+                    {{/each}}
+                </div>
+            {{else}}
+                <div class="storefront-empty-row">
+                    <span>{{t "storefront.networks.invitations.none"}}</span>
+                    <Button @size="xs" @icon="envelope-open-text" @text={{t "storefront.networks.invitations.invite-stores"}} @onClick={{fn this.openInvitePanel "email"}} />
+                </div>
+            {{/if}}
+            <div class="storefront-member-row storefront-member-row--link">
+                <div class="storefront-member-row__logo storefront-member-row__logo--icon"><FaIcon @icon="link" /></div>
+                <div class="storefront-member-row__identity">
+                    <div class="storefront-member-row__name">{{t "storefront.networks.invitations.shareable-link"}}</div>
+                    <div class="storefront-member-row__meta">{{if this.shareableLinkEnabled (t "storefront.common.on") (t "storefront.common.off")}}</div>
+                </div>
+                {{#if this.shareableLinkEnabled}}
+                    <ClickToCopy @value={{this.shareableLink}} class="storefront-member-row__link truncate" />
+                {{/if}}
+                <Button @size="xs" @icon="cog" @text={{t "storefront.networks.invitations.manage-link"}} @onClick={{fn this.openInvitePanel "link"}} />
             </div>
-        </div>
-    </ContentPanel>
-</div>
\ No newline at end of file
+        </ContentPanel>
+
+        <ContentPanel @title={{t "storefront.networks.overview.recent-orders"}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top" @panelBodyClass="p-0" @actionButtons={{array (hash type="link" text=(t "storefront.networks.overview.all-orders") onClick=this.viewOrders size="xs")}}>
+            {{#if this.recentOrders.length}}
+                <div class="storefront-member-list">
+                    {{#each this.recentOrders as |order|}}
+                        <div class="storefront-member-row" data-test-recent-order={{order.public_id}}>
+                            <div class="storefront-member-row__identity">
+                                <div class="storefront-member-row__name">{{order.public_id}}</div>
+                                <div class="storefront-member-row__meta">{{n-a order.customer_name}} · {{n-a order.store_name}}</div>
+                            </div>
+                            <div class="storefront-member-row__amount">{{format-currency order.total order.currency}}</div>
+                            <Badge @status={{order.status}} @size="xs" />
+                        </div>
+                    {{/each}}
+                </div>
+            {{else}}
+                <div class="storefront-empty-row"><span>{{t "storefront.networks.overview.no-orders"}}</span></div>
+            {{/if}}
+        </ContentPanel>
+    </div>
+</Layout::Section::Body>
+
+{{#if this.isInvitePanelOpen}}
+    <Storefront::Network::InvitePanel @network={{this.network}} @activeTab={{this.invitePanelTab}} @onClose={{this.closeInvitePanel}} @onSent={{this.refresh}} />
+{{/if}}
diff --git a/addon/templates/networks/index/network/orders.hbs b/addon/templates/networks/index/network/orders.hbs
index d759a373..2685bb65 100644
--- a/addon/templates/networks/index/network/orders.hbs
+++ b/addon/templates/networks/index/network/orders.hbs
@@ -1,18 +1,69 @@
-<Layout::Section::Header @title={{t "storefront.common.orders"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+<Layout::Section::Header @title={{t "storefront.common.orders"}} @subtitle={{t "storefront.networks.orders.subtitle"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+    <div class="storefront-view-toggle mr-2" role="group" data-test-order-view-toggle>
+        <button type="button" class="storefront-view-toggle__option {{if this.isGrouped 'is-active'}}" {{on "click" (fn this.setView "grouped")}}>{{t "storefront.networks.orders.group-by-checkout"}}</button>
+        <button type="button" class="storefront-view-toggle__option {{unless this.isGrouped 'is-active'}}" {{on "click" (fn this.setView "flat")}}>{{t "storefront.networks.orders.flat"}}</button>
+    </div>
     <Layout::Resource::ActionButtons @buttons={{this.registeredActionButtons}} />
 </Layout::Section::Header>
 
-<Layout::Section::Body>
-    <Table
-        @wrapperClass="overscroll-y-none"
-        @rows={{@model}}
-        @columns={{this.registeredColumns}}
-        @selectable={{true}}
-        @canSelectAll={{true}}
-        @onSetup={{fn (mut this.table)}}
-        @pagination={{true}}
-        @paginationMeta={{@model.meta}}
-        @page={{this.page}}
-        @onPageChange={{fn (mut this.page)}}
-    />
-</Layout::Section::Body>
\ No newline at end of file
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <div class="storefront-status-tabs px-4 pt-3" role="tablist" data-test-order-status-tabs>
+        {{#each this.statusTabs as |tab|}}
+            <button type="button" role="tab" aria-selected={{if tab.isActive "true" "false"}} class="storefront-status-tab {{if tab.isActive 'is-active'}}" {{on "click" (fn this.selectStatusTab tab)}} data-test-status-tab={{tab.id}}>
+                {{tab.label}}
+            </button>
+        {{/each}}
+    </div>
+
+    {{#if this.isGrouped}}
+        <Table
+            @wrapperClass="overscroll-y-none storefront-network-orders-table"
+            @rows={{this.rows}}
+            @columns={{this.registeredColumns}}
+            @canExpand={{true}}
+            @onSetup={{fn (mut this.table)}}
+            @pagination={{true}}
+            @paginationMeta={{@model.meta}}
+            @page={{this.page}}
+            @onPageChange={{fn (mut this.page)}}
+            @insertPagination={{true}}
+            @useTfootPagination={{true}}
+            as |t|
+        >
+            <t.head />
+            <t.body as |b|>
+                <b.expanded-row as |group|>
+                    {{#if group.isGroup}}
+                        <div class="storefront-order-group" data-test-order-group={{group.id}}>
+                            {{#each group.orders as |order|}}
+                                <div class="storefront-order-group__row">
+                                    {{#each t.columns as |column|}}
+                                        <div class="storefront-order-group__cell" style={{width-style-px column.width}}>
+                                            {{#if column.cellComponent}}
+                                                {{component column.cellComponent row=order column=column value=(get order column.valuePath)}}
+                                            {{else}}
+                                                {{get order column.valuePath}}
+                                            {{/if}}
+                                        </div>
+                                    {{/each}}
+                                </div>
+                            {{/each}}
+                        </div>
+                    {{/if}}
+                </b.expanded-row>
+            </t.body>
+        </Table>
+    {{else}}
+        <Table
+            @wrapperClass="overscroll-y-none storefront-network-orders-table"
+            @rows={{this.rows}}
+            @columns={{this.registeredColumns}}
+            @onSetup={{fn (mut this.table)}}
+            @pagination={{true}}
+            @paginationMeta={{@model.meta}}
+            @page={{this.page}}
+            @onPageChange={{fn (mut this.page)}}
+        />
+    {{/if}}
+    <p class="storefront-invitation-list__note px-4">{{t "storefront.networks.orders.group-note"}}</p>
+</Layout::Section::Body>
diff --git a/addon/templates/networks/index/network/settings.hbs b/addon/templates/networks/index/network/settings.hbs
new file mode 100644
index 00000000..e0d28ae5
--- /dev/null
+++ b/addon/templates/networks/index/network/settings.hbs
@@ -0,0 +1,463 @@
+<div class="space-y-2">
+    <ContentPanel @title={{t "storefront.networks.index.network.index.general-network-settings-title"}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top">
+        <div class="space-y-4">
+            <div>
+                <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
+                    {{t "storefront.networks.index.network.index.general-network-settings-title"}}
+                </h1>
+                <p class="mt-1 text-sm text-gray-500">
+                    {{t "storefront.networks.index.network.index.general-network-settings-subtitle"}}
+                </p>
+            </div>
+
+            <InputGroup
+                @name={{t "storefront.networks.index.network.index.general-network-settings-form.name"}}
+                @value={{@model.name}}
+                @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.name-placeholder"}}
+                @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.name-help-text"}}
+            />
+            <InputGroup
+                @name={{t "storefront.networks.index.network.index.general-network-settings-form.description"}}
+                @value={{@model.description}}
+                @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.description-placeholder"}}
+                @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.description-help-text"}}
+            />
+
+            <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.currency"}}>
+                <CurrencySelect @currency={{@model.currency}} @onCurrencyChange={{fn (mut @model.currency)}} @triggerClass="w-full form-select" />
+            </InputGroup>
+
+            <InputGroup @name="Default Order Config" @helpText="Select the order config which will apply to all orders created for this network.">
+                <Select
+                    @value={{@model.order_config_uuid}}
+                    @options={{this.orderConfigs}}
+                    @optionValue="id"
+                    @optionLabel="name"
+                    @onSelect={{fn (mut @model.order_config_uuid)}}
+                    @placeholder="Select default order config"
+                    class="w-full"
+                />
+            </InputGroup>
+
+            <ContentPanel
+                @title={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.panel-title"}}
+                @open={{false}}
+                @wrapperClass="bordered-classic"
+            >
+                <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.phone"}}>
+                    <PhoneInput @value={{@model.phone}} @onInput={{fn (mut @model.phone)}} class="form-input w-full" />
+                </InputGroup>
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email"}}
+                    @value={{@model.email}}
+                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.email-help-text"}}
+                />
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website"}}
+                    @value={{@model.website}}
+                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.website-help-text"}}
+                />
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook"}}
+                    @value={{@model.facebook}}
+                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.facebook-help-text"}}
+                />
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram"}}
+                    @value={{@model.instagram}}
+                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.instagram-help-text"}}
+                />
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter"}}
+                    @value={{@model.twitter}}
+                    @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.contact-social-panel.twitter-help-text"}}
+                />
+            </ContentPanel>
+
+            <ContentPanel
+                @title={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.panel-title"}}
+                @open={{false}}
+                @wrapperClass="bordered-classic"
+            >
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.logo-label"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.logo-help-text"}}
+                >
+                    <div class="flex flex-row items-center">
+                        <img src={{@model.logo_url}} alt={{concat @model.name " logo"}} class="h-20 w-64 border dark:border-gray-900 rounded-md mr-4" />
+                        <FileUpload @name="logo" @accept="image/*" @onFileAdded={{fn this.uploadFile "storefront_logo"}} as |queue|>
+                            <a tabindex={{0}} class="flex items-center px-0 mt-2 text-xs no-underline truncate btn btn-sm btn-default">
+                                {{#if queue.files.length}}
+                                    <Spinner class="mr-1" />
+                                    <span>
+                                        {{t "storefront.common.uploading"}}
+                                    </span>
+                                {{else}}
+                                    <FaIcon @icon="image" class="mr-1" />
+                                    <span>
+                                        {{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.upload-logo-button-text"}}
+                                    </span>
+                                {{/if}}
+                            </a>
+                        </FileUpload>
+                    </div>
+                </InputGroup>
+
+                <InputGroup
+                    @name={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.backdrop-label"}}
+                    @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.backdrop-help-text"}}
+                >
+                    <div class="flex flex-row items-center">
+                        <img src={{@model.backdrop_url}} alt={{concat @model.name " backdrop"}} class="h-20 w-64 border dark:border-gray-900 rounded-md mr-4" />
+                        <FileUpload @name="backdrop" @accept="image/*" @onFileAdded={{fn this.uploadFile "storefront_backdrop"}} as |queue|>
+                            <a tabindex={{0}} class="flex items-center px-0 mt-2 text-xs no-underline truncate btn btn-sm btn-default">
+                                {{#if queue.files.length}}
+                                    <Spinner class="mr-1" />
+                                    <span>
+                                        {{t "storefront.common.uploading"}}
+                                    </span>
+                                {{else}}
+                                    <FaIcon @icon="image" class="mr-1" />
+                                    <span>
+                                        {{t "storefront.networks.index.network.index.general-network-settings-form.logo-backdrop-panel.upload-backdrop-button-text"}}
+                                    </span>
+                                {{/if}}
+                            </a>
+                        </FileUpload>
+                    </div>
+                </InputGroup>
+            </ContentPanel>
+
+            <ContentPanel @title={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.panel-title"}} @open={{false}} @wrapperClass="bordered-classic">
+                <div>
+                    <p class="dark:text-gray-100 mb-4">{{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.panel-description"}}</p>
+                    <InputGroup @name={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.new-order-alert-label"}} @wrapperClass="mb-0">
+                        <ModelSelectMultiple
+                            @modelName="user"
+                            @selectedItemComponent={{component "select-option/user" compact=true}}
+                            @selectedModel={{@model.alertable.for_new_order}}
+                            @placeholder={{t "storefront.networks.index.network.index.general-network-settings-form.alert-panel.new-order-alert-placeholder"}}
+                            @triggerClass="form-select form-input multiple"
+                            @infiniteScroll={{false}}
+                            @renderInPlace={{true}}
+                            @onChange={{fn this.makeAlertable "for_new_order"}}
+                            as |model|
+                        >
+                            <SelectOption::User @option={{model}} />
+                        </ModelSelectMultiple>
+                    </InputGroup>
+                </div>
+            </ContentPanel>
+
+            <div class="store-boolean-settings">
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.online}} @onToggle={{fn (mut @model.online)}}>
+                        <FaIcon @icon="plug" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.online"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.tax_enabled}} @onToggle={{fn (mut @model.options.tax_enabled)}}>
+                        <FaIcon @icon="percent" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-tax"
+                            }}</span>
+                    </Toggle>
+                    {{#if @model.options.tax_enabled}}
+                        <InputGroup
+                            @wrapperClass="mb-0 mt-2"
+                            @type="number"
+                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.tax-percentage-input-label"}}
+                            @value={{@model.options.tax_percentage}}
+                            @placeholder={{t "storefront.networks.index.network.index.placeholder-tax"}}
+                            @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.tax-percentage-input-help-text"}}
+                        />
+                    {{/if}}
+                </div>
+                <div class="input-group">
+                    <Toggle
+                        @isToggled={{@model.options.required_checkout_min}}
+                        @onToggle={{fn (mut @model.options.required_checkout_min)}}
+                        @helpText={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.minimum-order-amount-input-help-text"}}
+                    >
+                        <FaIcon @icon="dollar-sign" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-minimum-order-amount"
+                            }}</span>
+                    </Toggle>
+                    {{#if @model.options.required_checkout_min}}
+                        <MoneyInput
+                            @wrapperClass="mb-0 mt-2"
+                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.minimum-order-amount-input-label"}}
+                            @value={{@model.options.required_checkout_min_amount}}
+                            @currency={{@model.currency}}
+                        />
+                    {{/if}}
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.auto_accept_orders}} @onToggle={{fn (mut @model.options.auto_accept_orders)}}>
+                        <FaIcon @icon="robot" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.auto-accept-incoming-orders"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.auto_dispatch}} @onToggle={{fn (mut @model.options.auto_dispatch)}}>
+                        <FaIcon @icon="paper-plane" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.auto-dispatch-orders"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.require_pod}} @onToggle={{fn (mut @model.options.require_pod)}}>
+                        <FaIcon @icon="signature" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.require-proof-of-delivery"
+                            }}</span>
+                    </Toggle>
+                    {{#if @model.options.require_pod}}
+                        <InputGroup
+                            @wrapperClass="mb-0 mt-2"
+                            @name={{t "storefront.networks.index.network.index.general-network-settings-form.config-switches.proof-of-delivery-method-label"}}
+                        >
+                            <Select
+                                @options={{this.podMethods}}
+                                @optionValue="value"
+                                @optionLabel="name"
+                                @value={{@model.pod_method}}
+                                @onSelect={{fn (mut @model.pod_method)}}
+                                class="w-full"
+                            />
+                        </InputGroup>
+                    {{/if}}
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.cod_enabled}} @onToggle={{fn (mut @model.options.cod_enabled)}}>
+                        <FaIcon @icon="money-bill-wave" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-cash-on-delivery"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.pickup_enabled}} @onToggle={{fn (mut @model.options.pickup_enabled)}}>
+                        <FaIcon @icon="person-booth" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-order-pickup"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.tips_enabled}} @onToggle={{fn (mut @model.options.tips_enabled)}}>
+                        <FaIcon @icon="cash-register" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-tips"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.delivery_tips_enabled}} @onToggle={{fn (mut @model.options.delivery_tips_enabled)}}>
+                        <FaIcon @icon="face-smile" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-delivery-tips"
+                            }}</span>
+                    </Toggle>
+                </div>
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.multi_cart_enabled}} @onToggle={{fn (mut @model.options.multi_cart_enabled)}}>
+                        <FaIcon @icon="gifts" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-multi-cart-checkout"
+                            }}</span>
+                    </Toggle>
+                </div>
+                {{#if (and @model.options.tips_enabled @model.options.multi_cart_enabled)}}
+                    {{! Off: a multi-store order's store tip goes to the network. On: it is split across the stores by their share of the order. }}
+                    <div class="input-group">
+                        <Toggle @isToggled={{@model.options.split_tips_across_stores}} @onToggle={{fn (mut @model.options.split_tips_across_stores)}}>
+                            <FaIcon @icon="code-branch" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                    "storefront.networks.index.network.index.general-network-settings-form.config-switches.split-tips-across-stores"
+                                }}</span>
+                        </Toggle>
+                    </div>
+                {{/if}}
+                <div class="input-group">
+                    <Toggle @isToggled={{@model.options.reviews_enabled}} @onToggle={{fn (mut @model.options.reviews_enabled)}}>
+                        <FaIcon @icon="star" @prefix="fas" class="text-gray-600 dark:text-gray-400 mx-2" /><span class="dark:text-gray-100 text-sm">{{t
+                                "storefront.networks.index.network.index.general-network-settings-form.config-switches.enable-user-reviews"
+                            }}</span>
+                    </Toggle>
+                </div>
+            </div>
+
+            <div class="flex justify-end">
+                <Button
+                    @type="primary"
+                    @text={{t "storefront.networks.index.network.index.general-network-settings-form.save-changes-button-text"}}
+                    @icon="save"
+                    @size="lg"
+                    @isLoading={{this.isLoading}}
+                    @onClick={{this.saveSettings}}
+                />
+            </div>
+        </div>
+    </ContentPanel>
+
+    <ContentPanel @title={{t "storefront.networks.index.network.index.api-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
+        <div class="space-y-6">
+            <div>
+                <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
+                    {{t "storefront.networks.index.network.index.api-panel.panel-header"}}
+                </h1>
+                <p class="mt-1 text-sm text-gray-500">
+                    {{t "storefront.networks.index.network.index.api-panel.panel-description"}}
+                </p>
+            </div>
+
+            <InputGroup
+                @name={{t "storefront.networks.index.network.index.api-panel.network-key-label"}}
+                @helpText={{t "storefront.networks.index.network.index.api-panel.network-key-help-text"}}
+            >
+                <ClickToReveal @value={{@model.key}} @clickToCopy={{true}} class="form-input disabled" />
+            </InputGroup>
+        </div>
+    </ContentPanel>
+
+    <ContentPanel @title={{t "storefront.networks.index.network.index.payment-gateways-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
+        <div class="space-y-6">
+            <div class="flex justify-between">
+                <div>
+                    <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
+                        {{t "storefront.networks.index.network.index.payment-gateways-panel.panel-title"}}
+                    </h1>
+                    <p class="mt-1 text-sm text-gray-500">
+                        {{t "storefront.networks.index.network.index.payment-gateways-panel.panel-description"}}
+                    </p>
+                </div>
+                <div>
+                    <Button
+                        @icon="plus"
+                        @iconPrefix="fas"
+                        @type="primary"
+                        @text={{t "storefront.networks.index.network.index.payment-gateways-panel.new-gateway-button-text"}}
+                        @onClick={{this.createGateway}}
+                    />
+                </div>
+            </div>
+
+            {{#each this.gateways as |gateway|}}
+                <ContentPanel @title={{gateway.name}} @open={{true}} @pad={{false}} @wrapperClass="bordered-top">
+                    {{! Read-only summary; changes are made in the gateway modal, which saves them. }}
+                    <InputGroup
+                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.name"}}
+                        @value={{gateway.name}}
+                        @disabled={{true}}
+                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.name-help-text"}}
+                    />
+                    <InputGroup
+                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.code"}}
+                        @value={{gateway.code}}
+                        @disabled={{true}}
+                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.code-help-text"}}
+                    />
+                    <InputGroup
+                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.callback-url"}}
+                        @value={{gateway.callback_url}}
+                        @disabled={{true}}
+                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.callback-url-help-text"}}
+                    />
+                    <InputGroup
+                        @name={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.return-url"}}
+                        @value={{gateway.return_url}}
+                        @disabled={{true}}
+                        @helpText={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.return-url-help-text"}}
+                    />
+                    <div class="input-group">
+                        <Checkbox
+                            @value={{gateway.sandbox}}
+                            @label={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.sandbox-toggle-label"}}
+                            @disabled={{true}}
+                        />
+                    </div>
+                    <div>
+                        <h4 class="mb-2 font-semibold text-sm dark:text-white">{{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.config-header-label"}}</h4>
+                        {{#each-in gateway.config as |key value|}}
+                            {{#if (is-bool-value value)}}
+                                <div class="input-group">
+                                    <Checkbox @value={{value}} @label={{smart-humanize key}} @disabled={{true}} />
+                                </div>
+                            {{else}}
+                                <InputGroup @name={{smart-humanize key}}>
+                                    <Input
+                                        @type={{if (can "storefront update gateway") "text" "password"}}
+                                        class="form-input w-full"
+                                        placeholder={{humanize key}}
+                                        @value={{value}}
+                                        disabled
+                                    />
+                                </InputGroup>
+                            {{/if}}
+                        {{/each-in}}
+                    </div>
+                    <div class="flex flex-row items-center space-x-2">
+                        {{#if (can "storefront update gateway")}}
+                            <Button
+                                @size="sm"
+                                @type="primary"
+                                @icon="pencil"
+                                @text={{t "storefront.settings.gateways.edit-payment-gateway"}}
+                                @onClick={{fn this.editGateway gateway null}}
+                            />
+                        {{/if}}
+                        {{#if (can "storefront delete gateway")}}
+                            <Button
+                                @size="sm"
+                                @type="danger"
+                                @icon="trash"
+                                @text={{t "storefront.networks.index.network.index.payment-gateways-panel.gateway-form.delete-gateway-button-text"}}
+                                @onClick={{fn this.deleteGateway gateway}}
+                            />
+                        {{/if}}
+                    </div>
+                </ContentPanel>
+            {{/each}}
+        </div>
+    </ContentPanel>
+
+    <ContentPanel @title={{t "storefront.networks.index.network.index.notification-channels-panel.panel-title"}} @open={{false}} @pad={{false}} @wrapperClass="bordered-top">
+        <div class="space-y-6">
+            <div class="flex justify-between">
+                <div class="w-3/4">
+                    <h1 class="text-lg leading-6 font-bold text-gray-900 dark:text-gray-100">
+                        {{t "storefront.networks.index.network.index.notification-channels-panel.panel-header"}}
+                    </h1>
+                    <p class="mt-1 text-sm text-gray-500">
+                        {{t "storefront.networks.index.network.index.notification-channels-panel.panel-description"}}
+                    </p>
+                </div>
+                <div>
+                    <Button
+                        @icon="plus"
+                        @iconPrefix="fas"
+                        @type="primary"
+                        @text={{t "storefront.networks.index.network.index.notification-channels-panel.new-channel-button-text"}}
+                        @onClick={{this.createChannel}}
+                    />
+                </div>
+            </div>
+
+            <div class="space-y-3">
+                {{#each this.channels as |notificationChannel|}}
+                    <div class="flex px-4 py-2 items-center justify-between shadow-sm rounded-md dark:bg-gray-900 bg-gray-200">
+                        <div>
+                            <span class="dark:text-gray-50">{{notificationChannel.name}}</span>
+                        </div>
+                        <div class="flex items-center">
+                            <Button @size="xs" @type="default" @text={{t "storefront.settings.notification.send-test"}} @wrapperClass="mr-2" @onClick={{fn this.testChannel notificationChannel}} />
+                            <Button @size="xs" @type="default" @text={{t "storefront.common.edit"}} @wrapperClass="mr-2" @onClick={{fn this.editChannel notificationChannel}} />
+                            <Button @size="xs" @type="danger" @text={{t "storefront.common.delete"}} @onClick={{fn this.deleteChannel notificationChannel}} />
+                        </div>
+                    </div>
+                {{/each}}
+            </div>
+        </div>
+    </ContentPanel>
+</div>
\ No newline at end of file
diff --git a/addon/templates/networks/index/network/stores.hbs b/addon/templates/networks/index/network/stores.hbs
index 4bd549d8..a039dd5c 100644
--- a/addon/templates/networks/index/network/stores.hbs
+++ b/addon/templates/networks/index/network/stores.hbs
@@ -1,39 +1,79 @@
-<Layout::Section::Header @title={{t "storefront.networks.index.network.stores.store"}} @searchQuery={{this.storeQuery}} @onSearch={{perform this.search}}>
-    <Button
-        @type="primary"
-        @icon="plus"
-        @text={{t "storefront.networks.index.network.stores.add-stores-button-text"}}
-        @textClass="truncate"
-        @size="sm"
-        @onClick={{this.addStores}}
-        @wrapperClass="mr-2"
-    />
-    <Button
-        @type="primary"
-        @icon="envelope-open-text"
-        @textClass="truncate"
-        @size="sm"
-        @text={{t "storefront.networks.index.network.stores.invite-stores-button-text"}}
-        @onClick={{this.invite}}
-    />
+<Layout::Section::Header
+    @title={{t "storefront.networks.index.network.stores.store"}}
+    @subtitle={{t "storefront.networks.invitations.stores-subtitle" members=this.members.length pending=this.pendingInvitations.length}}
+    @searchQuery={{this.storeQuery}}
+    @onSearch={{perform this.search}}
+>
+    <Button @icon="plus" @text={{t "storefront.networks.invitations.add-existing-store"}} @textClass="truncate" @size="sm" @onClick={{fn this.invite this.network "own"}} @wrapperClass="mr-2" @permission="storefront update network" />
+    <Button @type="primary" @icon="envelope-open-text" @textClass="truncate" @size="sm" @text={{t "storefront.networks.invitations.invite-stores"}} @onClick={{fn this.invite this.network "email"}} @permission="storefront update network" />
     <Layout::Resource::ActionButtons @buttons={{this.registeredActionButtons}} />
 </Layout::Section::Header>
 
-<Layout::Section::Body>
-    <div class="flex flex-row items-center space-x-2">
-        <NetworkCategoryPicker
-            @network={{this.network}}
-            @category={{this.category}}
-            @onCreateNewCategory={{this.createNewCategory}}
-            @onSelect={{this.selectCategory}}
-            @onReady={{this.setCategoryPickerContext}}
-            @wrapperClass="w-64 my-4 ml-9"
-        />
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <div class="storefront-status-tabs px-4 pt-3" role="tablist" data-test-network-store-tabs>
+        {{#each this.statusTabs as |tab|}}
+            <button type="button" role="tab" aria-selected={{if tab.isActive "true" "false"}} class="storefront-status-tab {{if tab.isActive 'is-active'}}" {{on "click" (fn this.selectStatusTab tab)}} data-test-status-tab={{tab.id}}>
+                <span>{{tab.label}}</span>
+                <span class="storefront-status-tab__count">{{tab.count}}</span>
+            </button>
+        {{/each}}
+    </div>
+
+    <div class="flex flex-row items-center flex-wrap gap-2 px-4 my-3">
+        <NetworkCategoryPicker @network={{this.network}} @category={{this.category}} @onCreateNewCategory={{this.createNewCategory}} @onSelect={{this.selectCategory}} @onReady={{this.setCategoryPickerContext}} @wrapperClass="w-64" />
         {{#if this.categoryModel}}
             <Button @icon="arrow-left" @size="xs" @onClick={{this.categoryPicker.loadParentCategories}} />
-            <Button @icon="cog" @text="Edit Category" @size="xs" @onClick={{fn this.editCategory this.categoryModel}} />
-            <Button @icon="trash" @text="Delete Category" @size="xs" @type="danger" @onClick={{fn this.deleteCategory this.categoryModel}} />
+            <Button @icon="cog" @text={{t "storefront.networks.invitations.edit-category"}} @size="xs" @onClick={{fn this.editCategory this.categoryModel}} />
+            <Button @icon="trash" @text={{t "storefront.networks.invitations.delete-category"}} @size="xs" @type="danger" @onClick={{fn this.deleteCategory this.categoryModel}} />
         {{/if}}
     </div>
-    <Table @rows={{@model}} @columns={{this.registeredColumns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @tfoot={{false}} @selectAllColumnWidth={{20}} />
-</Layout::Section::Body>
\ No newline at end of file
+
+    {{#if this.hasSelection}}
+        <div class="storefront-bulk-bar mx-4 mb-3" data-test-network-store-bulk-bar>
+            <span class="storefront-bulk-bar__count">{{t "storefront.networks.invitations.selected-count" count=this.selectedStores.length}}</span>
+            <Button @size="xs" @icon="folder-tree" @text={{t "storefront.networks.index.network.stores.assign-category"}} @onClick={{this.assignCategoryToSelected}} @permission="storefront update network" />
+            <Button @size="xs" @type="danger" @icon="trash" @text={{t "storefront.networks.index.network.stores.remove-store-from-network"}} @onClick={{this.removeSelected}} @permission="storefront update network" />
+            <Button @size="xs" @text={{t "storefront.networks.invitations.clear"}} @onClick={{this.clearSelection}} />
+        </div>
+    {{/if}}
+
+    {{#if (eq this.statusTab "invited")}}
+        {{#unless this.openInvitations.length}}
+            <div class="storefront-empty-row mx-4">
+                <span>{{t "storefront.networks.invitations.none"}}</span>
+                <Button @size="xs" @icon="envelope-open-text" @text={{t "storefront.networks.invitations.invite-stores"}} @onClick={{fn this.invite this.network "email"}} />
+            </div>
+        {{/unless}}
+    {{else}}
+        <Table @rows={{this.visibleStores}} @columns={{this.registeredColumns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @tfoot={{false}} @selectAllColumnWidth={{20}} />
+    {{/if}}
+
+    {{#if this.showInvitations}}
+        <div class="storefront-invitation-list mx-4 my-4" data-test-network-invitations>
+            <div class="storefront-invitation-list__title">{{t "storefront.networks.invitations.title"}}</div>
+            {{#each this.openInvitations as |invitation|}}
+                <div class="storefront-member-row" data-test-invitation-row={{invitation.id}}>
+                    <div class="storefront-member-row__logo storefront-member-row__logo--icon"><FaIcon @icon="at" /></div>
+                    <div class="storefront-member-row__identity">
+                        <div class="storefront-member-row__name">{{invitation.email}}</div>
+                        <div class="storefront-member-row__meta">{{t "storefront.networks.invitations.sent-ago" ago=invitation.sentAgo}}</div>
+                    </div>
+                    <Badge @status={{invitation.status}} @text={{t (concat "storefront.networks.invitations.status." invitation.status)}} @size="xs" />
+                    <div class="storefront-card__buttons">
+                        {{#if (eq invitation.status "pending")}}
+                            <Button @size="xs" @icon="paper-plane" @text={{t "storefront.networks.invitations.resend"}} @onClick={{fn this.resendInvitation invitation}} @permission="storefront update network" />
+                            <Button @size="xs" @icon="ban" @text={{t "storefront.networks.invitations.revoke"}} @onClick={{fn this.revokeInvitation invitation}} @permission="storefront update network" />
+                        {{else}}
+                            <Button @size="xs" @icon="redo" @text={{t "storefront.networks.invitations.invite-again"}} @onClick={{fn this.resendInvitation invitation}} @permission="storefront update network" />
+                        {{/if}}
+                    </div>
+                </div>
+            {{/each}}
+            <p class="storefront-invitation-list__note">{{t "storefront.networks.invitations.rows-note"}}</p>
+        </div>
+    {{/if}}
+</Layout::Section::Body>
+
+{{#if this.isInvitePanelOpen}}
+    <Storefront::Network::InvitePanel @network={{this.network}} @activeTab={{this.invitePanelTab}} @onClose={{this.closeInvitePanel}} @onSent={{this.afterInvitationsSent}} />
+{{/if}}
diff --git a/addon/templates/networks/index/network/trucks.hbs b/addon/templates/networks/index/network/trucks.hbs
new file mode 100644
index 00000000..e272b36d
--- /dev/null
+++ b/addon/templates/networks/index/network/trucks.hbs
@@ -0,0 +1,15 @@
+<Layout::Section::Header @title={{t "storefront.common.food-trucks"}} @searchQuery={{this.query}} @onSearch={{perform this.search}} />
+
+<Layout::Section::Body class="overflow-y-scroll-i h-full">
+    <Layout::Resource::CardsGrid
+        @resource="truck"
+        @data={{@model}}
+        @columns="4"
+        @containerClass="p-4"
+        @emptyStateText={{t "storefront.networks.index.network.trucks.empty-state"}}
+        class="h-full"
+        as |Item|
+    >
+        <Storefront::Truck::Card @truck={{Item.model}} @onEdit={{this.editFoodTruck}} @onAssignCatalogs={{this.assignCatalogs}} @onDelete={{this.deleteFoodTruck}} />
+    </Layout::Resource::CardsGrid>
+</Layout::Section::Body>
diff --git a/addon/utils/order-groups.js b/addon/utils/order-groups.js
new file mode 100644
index 00000000..72e43ee0
--- /dev/null
+++ b/addon/utils/order-groups.js
@@ -0,0 +1,135 @@
+import { get } from '@ember/object';
+
+/**
+ * Where an order sits in the fulfillment flow, so a group can report its least-advanced child.
+ */
+export const STATUS_RANK = {
+    created: 0,
+    pending: 0,
+    accepted: 1,
+    preparing: 1,
+    ready: 2,
+    pickup_ready: 2,
+    dispatched: 3,
+    driver_enroute: 3,
+    en_route: 3,
+    out_for_delivery: 3,
+    completed: 4,
+    picked_up: 4,
+    canceled: 5,
+    order_canceled: 5,
+};
+
+/**
+ * The status tabs the network orders page offers and the statuses each one queries.
+ */
+export const STATUS_TABS = [
+    { id: 'all', statuses: [] },
+    { id: 'needs-action', statuses: ['created', 'pending'] },
+    { id: 'preparing', statuses: ['accepted', 'preparing'] },
+    { id: 'ready', statuses: ['ready', 'pickup_ready'] },
+    { id: 'dispatched', statuses: ['dispatched', 'driver_enroute', 'en_route', 'out_for_delivery'] },
+    { id: 'completed', statuses: ['completed', 'picked_up'] },
+    { id: 'canceled', statuses: ['canceled', 'order_canceled'] },
+];
+
+export function rankOf(status) {
+    return STATUS_RANK[String(status ?? '').toLowerCase()] ?? 1;
+}
+
+function number(value) {
+    const parsed = parseFloat(value);
+
+    return Number.isFinite(parsed) ? parsed : 0;
+}
+
+export function orderStoreId(order) {
+    return get(order, 'meta.storefront_id') ?? get(order, 'meta.storefront.public_id') ?? null;
+}
+
+export function orderStoreName(order) {
+    const storefront = get(order, 'meta.storefront');
+
+    return typeof storefront === 'string' ? storefront : (storefront?.name ?? null);
+}
+
+export function groupKeyOf(order) {
+    return get(order, 'meta.checkout_id') ?? get(order, 'meta.master_order_id') ?? null;
+}
+
+/**
+ * Groups the orders of one checkout into a single row. An order without a checkout, or
+ * alone in its checkout, stays a plain order row.
+ *
+ * @param {Array} orders
+ * @returns {Array} group rows and order rows in the orders' original sequence
+ */
+export function groupOrdersByCheckout(orders = []) {
+    const list = orders?.toArray?.() ?? Array.from(orders ?? []);
+    const groups = new Map();
+    const rows = [];
+
+    list.forEach((order) => {
+        const key = groupKeyOf(order);
+
+        if (!key) {
+            rows.push(order);
+            return;
+        }
+
+        if (!groups.has(key)) {
+            const group = { id: key, isGroup: true, orders: [], expanded: false };
+            groups.set(key, group);
+            rows.push(group);
+        }
+
+        groups.get(key).orders.push(order);
+    });
+
+    return rows.map((row) => {
+        if (!row.isGroup) {
+            return row;
+        }
+
+        if (row.orders.length === 1) {
+            return row.orders[0];
+        }
+
+        return summarizeGroup(row);
+    });
+}
+
+export function summarizeGroup(group) {
+    const { orders } = group;
+    const first = orders[0];
+    const statuses = orders.map((order) => String(order.status ?? '').toLowerCase());
+    const leastAdvanced = orders.reduce((lowest, order) => (rankOf(order.status) < rankOf(lowest.status) ? order : lowest), first);
+    const leastRank = rankOf(leastAdvanced.status);
+    const atLeast = orders.filter((order) => rankOf(order.status) === leastRank).length;
+    const drivers = orders.map((order) => order.driver_assigned ?? null).filter(Boolean);
+    const driverIds = new Set(orders.map((order) => order.driver_assigned_uuid ?? order.driver_assigned?.id).filter(Boolean));
+    const currency = get(first, 'meta.currency') ?? first.currency;
+
+    return Object.assign(group, {
+        public_id: group.id,
+        orderCount: orders.length,
+        itemCount: orders.reduce((sum, order) => sum + number(order.item_count ?? order.total_entities), 0),
+        customer: first.customer ?? null,
+        customer_name: first.customer_name ?? first.customer?.name ?? null,
+        customer_type: first.customer_type,
+        storeIds: [...new Set(orders.map(orderStoreId).filter(Boolean))],
+        storeNames: [...new Set(orders.map(orderStoreName).filter(Boolean))],
+        is_pickup: orders.every((order) => get(order, 'meta.is_pickup')),
+        total: orders.reduce((sum, order) => sum + number(get(order, 'meta.total') ?? order.transaction_amount), 0),
+        tip: orders.reduce((sum, order) => sum + number(get(order, 'meta.tip')) + number(get(order, 'meta.delivery_tip')), 0),
+        currency,
+        driver: driverIds.size === 1 ? (drivers[0] ?? null) : null,
+        driverCount: driverIds.size,
+        status: leastAdvanced.status,
+        statuses,
+        statusSummary: { count: atLeast, total: orders.length, status: leastAdvanced.status },
+        created_at: first.created_at,
+        createdAtShort: first.createdAtShort,
+        allTerminal: orders.every((order) => rankOf(order.status) >= 4),
+    });
+}
diff --git a/app/components/select-option/store.js b/app/components/select-option/store.js
new file mode 100644
index 00000000..3db1e2ec
--- /dev/null
+++ b/app/components/select-option/store.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/select-option/store';
diff --git a/app/components/storefront/catalog/card.js b/app/components/storefront/catalog/card.js
new file mode 100644
index 00000000..4fdcfbb5
--- /dev/null
+++ b/app/components/storefront/catalog/card.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/catalog/card';
diff --git a/app/components/storefront/hours-strip.js b/app/components/storefront/hours-strip.js
new file mode 100644
index 00000000..68c42b03
--- /dev/null
+++ b/app/components/storefront/hours-strip.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/hours-strip';
diff --git a/app/components/storefront/network/card.js b/app/components/storefront/network/card.js
new file mode 100644
index 00000000..216a419b
--- /dev/null
+++ b/app/components/storefront/network/card.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/card';
diff --git a/app/components/storefront/network/invite-panel.js b/app/components/storefront/network/invite-panel.js
new file mode 100644
index 00000000..4320f607
--- /dev/null
+++ b/app/components/storefront/network/invite-panel.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/invite-panel';
diff --git a/app/components/storefront/network/orders/cell/actions.js b/app/components/storefront/network/orders/cell/actions.js
new file mode 100644
index 00000000..9444505e
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/actions.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/actions';
diff --git a/app/components/storefront/network/orders/cell/driver.js b/app/components/storefront/network/orders/cell/driver.js
new file mode 100644
index 00000000..baa196db
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/driver.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/driver';
diff --git a/app/components/storefront/network/orders/cell/fulfillment.js b/app/components/storefront/network/orders/cell/fulfillment.js
new file mode 100644
index 00000000..6cb97846
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/fulfillment.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/fulfillment';
diff --git a/app/components/storefront/network/orders/cell/placed.js b/app/components/storefront/network/orders/cell/placed.js
new file mode 100644
index 00000000..1b11e0e1
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/placed.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/placed';
diff --git a/app/components/storefront/network/orders/cell/reference.js b/app/components/storefront/network/orders/cell/reference.js
new file mode 100644
index 00000000..0c0ec923
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/reference.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/reference';
diff --git a/app/components/storefront/network/orders/cell/status.js b/app/components/storefront/network/orders/cell/status.js
new file mode 100644
index 00000000..3f73de26
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/status.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/status';
diff --git a/app/components/storefront/network/orders/cell/stores.js b/app/components/storefront/network/orders/cell/stores.js
new file mode 100644
index 00000000..5ce35c2f
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/stores.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/stores';
diff --git a/app/components/storefront/network/orders/cell/total.js b/app/components/storefront/network/orders/cell/total.js
new file mode 100644
index 00000000..0763cf9d
--- /dev/null
+++ b/app/components/storefront/network/orders/cell/total.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/network/orders/cell/total';
diff --git a/app/components/storefront/truck/card.js b/app/components/storefront/truck/card.js
new file mode 100644
index 00000000..faab9e76
--- /dev/null
+++ b/app/components/storefront/truck/card.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/components/storefront/truck/card';
diff --git a/app/controllers/networks/index/network/settings.js b/app/controllers/networks/index/network/settings.js
new file mode 100644
index 00000000..6a274f1f
--- /dev/null
+++ b/app/controllers/networks/index/network/settings.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/controllers/networks/index/network/settings';
diff --git a/app/controllers/networks/index/network/trucks.js b/app/controllers/networks/index/network/trucks.js
new file mode 100644
index 00000000..91eb4b7a
--- /dev/null
+++ b/app/controllers/networks/index/network/trucks.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/controllers/networks/index/network/trucks';
diff --git a/app/helpers/width-style-px.js b/app/helpers/width-style-px.js
new file mode 100644
index 00000000..081345a0
--- /dev/null
+++ b/app/helpers/width-style-px.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/helpers/width-style-px';
diff --git a/app/helpers/width-style.js b/app/helpers/width-style.js
new file mode 100644
index 00000000..945636d4
--- /dev/null
+++ b/app/helpers/width-style.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/helpers/width-style';
diff --git a/app/routes/networks/index/network/settings.js b/app/routes/networks/index/network/settings.js
new file mode 100644
index 00000000..fa6bfdb4
--- /dev/null
+++ b/app/routes/networks/index/network/settings.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/routes/networks/index/network/settings';
diff --git a/app/routes/networks/index/network/trucks.js b/app/routes/networks/index/network/trucks.js
new file mode 100644
index 00000000..e23a4acd
--- /dev/null
+++ b/app/routes/networks/index/network/trucks.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/routes/networks/index/network/trucks';
diff --git a/app/templates/networks/index/network/settings.js b/app/templates/networks/index/network/settings.js
new file mode 100644
index 00000000..bbbc3329
--- /dev/null
+++ b/app/templates/networks/index/network/settings.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/templates/networks/index/network/settings';
diff --git a/app/templates/networks/index/network/trucks.js b/app/templates/networks/index/network/trucks.js
new file mode 100644
index 00000000..a3d22412
--- /dev/null
+++ b/app/templates/networks/index/network/trucks.js
@@ -0,0 +1 @@
+export { default } from '@fleetbase/storefront-engine/templates/networks/index/network/trucks';
diff --git a/index.js b/index.js
index 005d7714..10a66128 100644
--- a/index.js
+++ b/index.js
@@ -8,8 +8,14 @@ const path = require('path');
 module.exports = buildEngine({
     name,
 
+    // Lazy loading keeps the engine out of the host bundle, but it also keeps the
+    // engine's modules out of the dummy app that `ember test` builds, so every test
+    // importing `@fleetbase/storefront-engine/*` fails to load. Eager loading is
+    // scoped to `ember test` run from this package, so host apps consuming the
+    // engine, including their own test builds, keep lazy loading. Addon index
+    // files are evaluated before ember-cli assigns EMBER_ENV, hence the argv check.
     lazyLoading: {
-        enabled: true,
+        enabled: !(process.argv.includes('test') && process.cwd() === __dirname),
     },
 
     isDevelopingAddon() {
diff --git a/package.json b/package.json
index 344a57db..33417fed 100644
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
         "@babel/core": "^7.23.2",
         "@fleetbase/ember-core": "^0.3.25",
         "@fleetbase/ember-ui": "^0.4.5",
-        "@fleetbase/fleetops-data": "^0.2.3",
+        "@fleetbase/fleetops-data": "^0.2.2",
         "@fortawesome/ember-fontawesome": "^2.0.0",
         "@fortawesome/fontawesome-svg-core": "6.4.0",
         "@fortawesome/free-brands-svg-icons": "6.4.0",
@@ -61,6 +61,7 @@
     "devDependencies": {
         "@babel/eslint-parser": "^7.22.15",
         "@babel/plugin-proposal-decorators": "^7.23.2",
+        "@ember/legacy-built-in-components": "^0.4.2",
         "@ember/optional-features": "^2.0.0",
         "@ember/test-helpers": "^3.2.0",
         "@embroider/test-setup": "^3.0.2",
@@ -71,7 +72,6 @@
         "broccoli-funnel": "^3.0.8",
         "broccoli-merge-trees": "^4.2.0",
         "concurrently": "^8.2.2",
-        "ember-classic-decorator": "^3.0.0",
         "ember-cli": "~5.4.1",
         "ember-cli-clean-css": "^3.0.0",
         "ember-cli-dependency-checker": "^3.3.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 676fd872..091b4870 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -18,8 +18,8 @@ importers:
         specifier: ^0.4.5
         version: 0.4.5(fd4e3593913b6af1971bbb09f229d016)
       '@fleetbase/fleetops-data':
-        specifier: ^0.1.37
-        version: 0.1.37(d08c013ce78c1181b04d076f9e3ef4de)
+        specifier: ^0.2.2
+        version: 0.2.2(d08c013ce78c1181b04d076f9e3ef4de)
       '@fortawesome/ember-fontawesome':
         specifier: ^2.0.0
         version: 2.0.0(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(rollup@2.80.0)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3))
@@ -57,6 +57,9 @@ importers:
       '@babel/plugin-proposal-decorators':
         specifier: ^7.23.2
         version: 7.29.7(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
+      '@ember/legacy-built-in-components':
+        specifier: ^0.4.2
+        version: 0.4.2(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)
       '@ember/optional-features':
         specifier: ^2.0.0
         version: 2.3.0(supports-color@8.1.1)
@@ -87,9 +90,6 @@ importers:
       concurrently:
         specifier: ^8.2.2
         version: 8.2.2
-      ember-classic-decorator:
-        specifier: ^3.0.0
-        version: 3.0.1(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
       ember-cli:
         specifier: ~5.4.1
         version: 5.4.2(@babel/core@7.29.7(supports-color@8.1.1))(@types/node@25.9.1)(debug@4.4.3(supports-color@8.1.1))(handlebars@4.7.9)(supports-color@8.1.1)(underscore@1.13.8)
@@ -116,7 +116,7 @@ importers:
         version: 4.12.8(@babel/core@7.29.7(supports-color@8.1.1))(@ember/string@3.1.1(supports-color@8.1.1))(@glimmer/tracking@1.1.2)(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3))
       ember-engines:
         specifier: ^0.9.0
-        version: 0.9.0(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)
+        version: 0.9.0(@babel/core@7.29.7(supports-color@8.1.1))(@ember/legacy-built-in-components@0.4.2(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)
       ember-load-initializers:
         specifier: ^2.1.2
         version: 2.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
@@ -1147,6 +1147,12 @@ packages:
   '@ember/edition-utils@1.2.0':
     resolution: {integrity: sha512-VmVq/8saCaPdesQmftPqbFtxJWrzxNGSQ+e8x8LLe3Hjm36pJ04Q8LeORGZkAeOhldoUX9seLGmSaHeXkIqoog==}
 
+  '@ember/legacy-built-in-components@0.4.2':
+    resolution: {integrity: sha512-rJulbyVQIVe1zEDQDqAQHechHy44DsS2qxO24+NmU/AYxwPFSzWC/OZNCDFSfLU+Y5BVd/00qjxF0pu7Nk+TNA==}
+    engines: {node: 12.* || 14.* || >= 16}
+    peerDependencies:
+      ember-source: '*'
+
   '@ember/optional-features@2.3.0':
     resolution: {integrity: sha512-+M8CkPledQEaDbfIlwlq6Phgpm5jdT3a6WVDJk7b/zadw5xAJkuQKVK7DgR0SFgHGiWlyn6a8AU5p2mCA706RA==}
     engines: {node: 10.* || 12.* || >= 14}
@@ -1283,14 +1289,14 @@ packages:
     resolution: {integrity: sha512-C/+OvMpH5fCKYY5v+CteR6Tx6IAI33nfvOrmo7mFGDnyKDsjplsVVgWpsecLG94fJvpuVVI+CFvaiH50GUM3Mg==}
     engines: {node: '>= 18'}
 
-  '@fleetbase/fleetops-data@0.1.37':
-    resolution: {integrity: sha512-VGVWaGlwQAqHWA9/A80jKAjoDkAM7U9Ve1UVmKkCTlolqUd5/k/Z66rVC0iFUijj8qzkMCdahdh3mBPQ6x71WA==}
-    engines: {node: '>= 18'}
-
   '@fleetbase/fleetops-data@0.1.40':
     resolution: {integrity: sha512-bp4tWaS2cpnitjtmH9hm3T7milwSqgt4j3T/KA8cvsFpbg7p303ADb5CNml5RsribgdBcRYtMsLEFYeYnU9dpg==}
     engines: {node: '>= 18'}
 
+  '@fleetbase/fleetops-data@0.2.2':
+    resolution: {integrity: sha512-HDgcGpJAk8q+sSmV070nCh02o4S0kuFCvwrf+Ltb+IrUkQ2RhDL/w8gdrqM65HrgbgWxQnslIeqzKfF6pV4/DA==}
+    engines: {node: '>= 18'}
+
   '@fleetbase/intl-lint@0.0.1':
     resolution: {integrity: sha512-LkjxJr15hSiGmqh3JwixcpjmkhXNieNAEgQUVv1Duo50jTr/D5WXEyOaeI8wuVnVFhT+FS/DMqm403DgSKlsEg==}
     hasBin: true
@@ -3140,6 +3146,7 @@ packages:
 
   concat-stream@1.6.2:
     resolution: {integrity: sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==}
+    engines: {'0': node >= 0.8}
 
   concurrently@8.2.2:
     resolution: {integrity: sha512-1dP4gpXFhei8IOtlXRE/T/4H88ElHgTiUzh71YUmtjTEHMSRS2Z/fgOxHSxxusGHogsRfxNq1vyAwxSC+EVyDg==}
@@ -3750,10 +3757,6 @@ packages:
       ember-resolver: '>= 8.0.0'
       ember-source: ^3.28.0 || ^4.0.0 || >=5.0.0
 
-  ember-classic-decorator@3.0.1:
-    resolution: {integrity: sha512-IoocHPX1cY93Sma7VeDGbF0M1+TkBWDJLus+RD01902eD+KHEL2+diwM+iayCyO+1/xaUzdzNGh35J+i+TCxoA==}
-    engines: {node: 12.* || 14.* || >= 16}
-
   ember-cli-babel-plugin-helpers@1.1.1:
     resolution: {integrity: sha512-sKvOiPNHr5F/60NLd7SFzMpYPte/nnGkq/tMIfXejfKHIhaiIkYFqX8Z9UFTKWLLn+V7NOaby6niNPZUdvKCRw==}
     engines: {node: 6.* || 8.* || >= 10.*}
@@ -9866,6 +9869,18 @@ snapshots:
 
   '@ember/edition-utils@1.2.0': {}
 
+  '@ember/legacy-built-in-components@0.4.2(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)':
+    dependencies:
+      '@embroider/macros': 1.20.3(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
+      ember-cli-babel: 7.26.11(supports-color@8.1.1)
+      ember-cli-htmlbars: 5.7.2(supports-color@8.1.1)
+      ember-cli-typescript: 4.2.1(supports-color@8.1.1)
+      ember-source: 5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3))
+    transitivePeerDependencies:
+      - '@babel/core'
+      - '@glint/template'
+      - supports-color
+
   '@ember/optional-features@2.3.0(supports-color@8.1.1)':
     dependencies:
       chalk: 4.1.2
@@ -9953,7 +9968,7 @@ snapshots:
       find-up: 5.0.0
       lodash: 4.18.1
       resolve: 1.22.12
-      semver: 7.8.1
+      semver: 7.8.5
     transitivePeerDependencies:
       - '@babel/core'
       - supports-color
@@ -10001,10 +10016,10 @@ snapshots:
       js-string-escape: 1.0.1
       lodash: 4.18.1
       minimatch: 3.1.5
-      pkg-entry-points: 1.1.1
+      pkg-entry-points: 1.1.2
       resolve-package-path: 4.0.3
       resolve.exports: 2.0.3
-      semver: 7.8.1
+      semver: 7.8.5
       typescript-memoize: 1.1.1
     transitivePeerDependencies:
       - supports-color
@@ -10249,6 +10264,7 @@ snapshots:
       - ember-cli-mirage
       - ember-resolver
       - ember-source
+      - encoding
       - eslint
       - miragejs
       - postcss
@@ -10263,7 +10279,7 @@ snapshots:
       - webpack-command
       - yaml
 
-  '@fleetbase/fleetops-data@0.1.37(d08c013ce78c1181b04d076f9e3ef4de)':
+  '@fleetbase/fleetops-data@0.1.40(d08c013ce78c1181b04d076f9e3ef4de)':
     dependencies:
       '@babel/core': 7.29.7(supports-color@8.1.1)
       '@fleetbase/ember-core': 0.3.25(d08c013ce78c1181b04d076f9e3ef4de)
@@ -10284,10 +10300,10 @@ snapshots:
       - utf-8-validate
       - webpack
 
-  '@fleetbase/fleetops-data@0.1.40(d08c013ce78c1181b04d076f9e3ef4de)':
+  '@fleetbase/fleetops-data@0.2.2(d08c013ce78c1181b04d076f9e3ef4de)':
     dependencies:
       '@babel/core': 7.29.7(supports-color@8.1.1)
-      '@fleetbase/ember-core': 0.3.24(d08c013ce78c1181b04d076f9e3ef4de)
+      '@fleetbase/ember-core': 0.3.25(d08c013ce78c1181b04d076f9e3ef4de)
       date-fns: 2.30.0
       ember-cli-babel: 8.3.1(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
       ember-cli-htmlbars: 6.3.0(supports-color@8.1.1)
@@ -10298,6 +10314,7 @@ snapshots:
       - bufferutil
       - ember-resolver
       - ember-source
+      - encoding
       - eslint
       - supports-color
       - typescript
@@ -11055,7 +11072,7 @@ snapshots:
 
   '@types/glob@9.0.0':
     dependencies:
-      glob: 8.1.0
+      glob: 13.0.6
 
   '@types/http-errors@2.0.5': {}
 
@@ -11080,7 +11097,7 @@ snapshots:
 
   '@types/minimatch@6.0.0':
     dependencies:
-      minimatch: 7.4.9
+      minimatch: 10.2.5
 
   '@types/minimist@1.2.5': {}
 
@@ -11586,7 +11603,7 @@ snapshots:
       babel-generator: 6.26.1
       babel-helpers: 6.24.1(supports-color@8.1.1)
       babel-messages: 6.23.0
-      babel-register: 6.26.0
+      babel-register: 6.26.0(supports-color@8.1.1)
       babel-runtime: 6.26.0
       babel-template: 6.26.0(supports-color@8.1.1)
       babel-traverse: 6.26.0(supports-color@8.1.1)
@@ -11742,7 +11759,7 @@ snapshots:
 
   babel-plugin-syntax-dynamic-import@6.18.0: {}
 
-  babel-register@6.26.0:
+  babel-register@6.26.0(supports-color@8.1.1):
     dependencies:
       babel-core: 6.26.3(supports-color@8.1.1)
       babel-runtime: 6.26.0
@@ -11751,6 +11768,8 @@ snapshots:
       lodash: 4.18.1
       mkdirp: 0.5.6
       source-map-support: 0.4.18
+    transitivePeerDependencies:
+      - supports-color
 
   babel-runtime@6.26.0:
     dependencies:
@@ -13512,17 +13531,6 @@ snapshots:
       - '@babel/core'
       - supports-color
 
-  ember-classic-decorator@3.0.1(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1):
-    dependencies:
-      '@embroider/macros': 1.20.3(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
-      babel-plugin-filter-imports: 4.0.0
-      ember-cli-babel: 7.26.11(supports-color@8.1.1)
-      ember-cli-htmlbars: 6.3.0(supports-color@8.1.1)
-    transitivePeerDependencies:
-      - '@babel/core'
-      - '@glint/template'
-      - supports-color
-
   ember-cli-babel-plugin-helpers@1.1.1: {}
 
   ember-cli-babel@7.26.11(supports-color@8.1.1):
@@ -13655,7 +13663,7 @@ snapshots:
       hash-for-dep: 1.5.2(supports-color@8.1.1)
       heimdalljs-logger: 0.1.10(supports-color@8.1.1)
       json-stable-stringify: 1.3.0
-      semver: 7.8.1
+      semver: 7.8.5
       silent-error: 1.1.1(supports-color@8.1.1)
       strip-bom: 4.0.0
       walk-sync: 2.2.0
@@ -14173,7 +14181,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  ember-engines@0.9.0(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1):
+  ember-engines@0.9.0(@babel/core@7.29.7(supports-color@8.1.1))(@ember/legacy-built-in-components@0.4.2(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1):
     dependencies:
       '@embroider/macros': 1.20.3(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1)
       amd-name-resolver: 1.3.1
@@ -14193,6 +14201,8 @@ snapshots:
       ember-cli-version-checker: 5.1.2(supports-color@8.1.1)
       ember-source: 5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3))
       lodash: 4.18.1
+    optionalDependencies:
+      '@ember/legacy-built-in-components': 0.4.2(@babel/core@7.29.7(supports-color@8.1.1))(ember-source@5.4.1(@babel/core@7.29.7(supports-color@8.1.1))(@glimmer/component@1.1.2(@babel/core@7.29.7(supports-color@8.1.1))(supports-color@8.1.1))(rsvp@4.8.5)(supports-color@8.1.1)(webpack@5.107.2(clean-css@5.3.3)(postcss@8.5.15)(uglify-js@3.19.3)))(supports-color@8.1.1)
     transitivePeerDependencies:
       - '@babel/core'
       - '@glint/template'
diff --git a/server/src/Http/Controllers/NetworkController.php b/server/src/Http/Controllers/NetworkController.php
index bb240e1b..f9f6fc99 100644
--- a/server/src/Http/Controllers/NetworkController.php
+++ b/server/src/Http/Controllers/NetworkController.php
@@ -2,6 +2,7 @@
 
 namespace Fleetbase\Storefront\Http\Controllers;
 
+use Fleetbase\FleetOps\Models\Order;
 use Fleetbase\FleetOps\Support\Utils;
 use Fleetbase\Models\Category;
 use Fleetbase\Models\Invite;
@@ -10,6 +11,9 @@
 use Fleetbase\Storefront\Mail\StorefrontNetworkInvite;
 use Fleetbase\Storefront\Models\Network;
 use Fleetbase\Storefront\Models\NetworkStore;
+use Fleetbase\Storefront\Models\Store;
+use Illuminate\Http\Request;
+use Illuminate\Support\Carbon;
 use Illuminate\Support\Facades\Mail;
 use Illuminate\Support\Str;
 
@@ -52,31 +56,253 @@ public function findNetwork(string $id)
      * @return \Illuminate\Http\Response
      */
     public function sendInvites(string $id, NetworkActionRequest $request)
+    {
+        $network       = Network::find($id);
+        $recipients    = collect($request->array('recipients'))->filter(fn ($email) => is_string($email) && filter_var($email, FILTER_VALIDATE_EMAIL))->map(fn ($email) => strtolower(trim($email)))->unique()->values();
+        $expiresInDays = $request->input('expires_in_days');
+        $meta          = array_filter([
+            'status'           => 'pending',
+            'category_uuid'    => $request->input('category_uuid'),
+            'message'          => $request->input('message'),
+            'require_approval' => (bool) $request->input('require_approval', false),
+        ], fn ($value) => $value !== null && $value !== '');
+
+        // One invitation per recipient so each can be resent, revoked or declined on its own.
+        $invitations = [];
+        foreach ($recipients as $email) {
+            $invitation = Invite::create([
+                'company_uuid'    => session('company'),
+                'created_by_uuid' => session('user'),
+                'subject_uuid'    => $network->uuid,
+                'subject_type'    => Utils::getMutationType($network),
+                'protocol'        => 'email',
+                'recipients'      => [$email],
+                'reason'          => 'join_storefront_network',
+                'meta'            => $meta,
+            ]);
+
+            if (is_numeric($expiresInDays) && (int) $expiresInDays > 0) {
+                $invitation->expires_at = Carbon::now()->addDays((int) $expiresInDays);
+                $invitation->save();
+            }
+
+            // make sure subject is set
+            $invitation->setRelation('subject', $network);
+            $invitation->setRelation('createdBy', $request->user());
+
+            // send invite
+            Mail::send(new StorefrontNetworkInvite($invitation));
+
+            $invitations[] = static::serializeInvitation($invitation);
+        }
+
+        return response()->json(['status' => 'ok', 'invitations' => $invitations]);
+    }
+
+    /**
+     * List the invitations a network has sent, newest first, with a derived state.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function invitations(string $id)
+    {
+        $network = Network::where('uuid', $id)->orWhere('public_id', $id)->first();
+
+        if (!$network) {
+            return response()->error('Network not found.', 404);
+        }
+
+        $invitations = Invite::where(['subject_uuid' => $network->uuid, 'reason' => 'join_storefront_network'])
+            ->orderBy('created_at', 'desc')
+            ->get()
+            ->map(fn (Invite $invitation) => static::serializeInvitation($invitation))
+            ->values();
+
+        return response()->json($invitations);
+    }
+
+    /**
+     * Resend a pending or expired invitation with a fresh expiry.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function resendInvitation(string $id, string $invitationId, Request $request)
     {
         $network    = Network::find($id);
-        $recipients = $request->input('recipients', []);
-
-        // create invitation
-        $invitation = Invite::create([
-            'company_uuid'    => session('company'),
-            'created_by_uuid' => session('user'),
-            'subject_uuid'    => $network->uuid,
-            'subject_type'    => Utils::getMutationType($network),
-            'protocol'        => 'email',
-            'recipients'      => $recipients,
-            'reason'          => 'join_storefront_network',
-        ]);
+        $invitation = Invite::where(['subject_uuid' => $network->uuid, 'reason' => 'join_storefront_network'])->where(fn ($query) => $query->where('uuid', $invitationId)->orWhere('public_id', $invitationId))->first();
+
+        if (!$invitation) {
+            return response()->error('Invitation not found.', 404);
+        }
 
-        // make sure subject is set
+        $meta           = $invitation->meta ?? [];
+        $meta['status'] = 'pending';
+        $meta['resent_at'] = Carbon::now()->toIso8601String();
+        $invitation->meta = $meta;
+
+        $expiresInDays = $request->input('expires_in_days');
+        if (is_numeric($expiresInDays) && (int) $expiresInDays > 0) {
+            $invitation->expires_at = Carbon::now()->addDays((int) $expiresInDays);
+        } elseif ($invitation->expires_at && Carbon::parse($invitation->expires_at)->isPast()) {
+            $invitation->expires_at = Carbon::now()->addDays(14);
+        }
+
+        $invitation->save();
         $invitation->setRelation('subject', $network);
         $invitation->setRelation('createdBy', $request->user());
 
-        // send invite
         Mail::send(new StorefrontNetworkInvite($invitation));
 
+        return response()->json(['status' => 'ok', 'invitation' => static::serializeInvitation($invitation)]);
+    }
+
+    /**
+     * Revoke an invitation so its link stops working.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function revokeInvitation(string $id, string $invitationId)
+    {
+        $network    = Network::find($id);
+        $invitation = Invite::where(['subject_uuid' => $network->uuid, 'reason' => 'join_storefront_network'])->where(fn ($query) => $query->where('uuid', $invitationId)->orWhere('public_id', $invitationId))->first();
+
+        if (!$invitation) {
+            return response()->error('Invitation not found.', 404);
+        }
+
+        $invitation->delete();
+
         return response()->json(['status' => 'ok']);
     }
 
+    /**
+     * Numbers the network overview shows: members, invitations, the last seven days of
+     * orders and revenue, customers, each member's share, and the latest orders.
+     *
+     * @return \Illuminate\Http\Response
+     */
+    public function overview(string $id)
+    {
+        $network = Network::where('uuid', $id)->orWhere('public_id', $id)->with(['stores'])->first();
+
+        if (!$network) {
+            return response()->error('Network not found.', 404);
+        }
+
+        $since        = Carbon::now()->subDays(7);
+        $monthStart   = Carbon::now()->startOfMonth();
+        $canceled     = ['canceled', 'order_canceled'];
+        $orders       = Order::where(['company_uuid' => $network->company_uuid, 'type' => 'storefront'])
+            ->where('meta->storefront_network_id', $network->public_id)
+            ->whereNull('deleted_at')
+            ->where('created_at', '>=', $since)
+            ->with(['customer'])
+            ->orderBy('created_at', 'desc')
+            ->get();
+        $liveOrders   = $orders->whereNotIn('status', $canceled);
+        $revenue      = round($liveOrders->sum(fn ($order) => (float) (data_get($order, 'meta.total') ?? 0)), 2);
+        $tips         = round($liveOrders->sum(fn ($order) => (float) (data_get($order, 'meta.tip') ?? 0) + (float) (data_get($order, 'meta.delivery_tip') ?? 0)), 2);
+        $multiStore   = $liveOrders->filter(fn ($order) => data_get($order, 'meta.checkout_id'))->groupBy(fn ($order) => data_get($order, 'meta.checkout_id'))->filter(fn ($group) => $group->count() > 1)->count();
+        $allCustomers = Order::where(['company_uuid' => $network->company_uuid, 'type' => 'storefront'])->where('meta->storefront_network_id', $network->public_id)->whereNull('deleted_at')->whereNotNull('customer_uuid');
+        $customers    = (clone $allCustomers)->distinct()->count('customer_uuid');
+        $newCustomers = (clone $allCustomers)->where('created_at', '>=', $monthStart)->distinct()->count('customer_uuid');
+
+        $invitations = Invite::where(['subject_uuid' => $network->uuid, 'reason' => 'join_storefront_network'])->orderBy('created_at', 'desc')->get()->map(fn (Invite $invitation) => static::serializeInvitation($invitation));
+        $byStore     = $liveOrders->groupBy(fn ($order) => data_get($order, 'meta.storefront_id'));
+        $stores      = $network->stores->map(function (Store $store) use ($byStore, $liveOrders, $revenue) {
+            $storeOrders  = $byStore->get($store->public_id, collect());
+            $storeRevenue = round($storeOrders->sum(fn ($order) => (float) (data_get($order, 'meta.total') ?? 0)), 2);
+
+            return [
+                'uuid'          => $store->uuid,
+                'public_id'     => $store->public_id,
+                'name'          => $store->name,
+                'logo_url'      => $store->logo_url,
+                'online'        => (bool) $store->online,
+                'currency'      => $store->currency,
+                'category_uuid' => $store->pivot->category_uuid ?? null,
+                'orders_7d'     => $storeOrders->count(),
+                'revenue_7d'    => $storeRevenue,
+                'share'         => $liveOrders->count() > 0 ? round(($storeOrders->count() / $liveOrders->count()) * 100) : 0,
+                'revenue_share' => $revenue > 0 ? round(($storeRevenue / $revenue) * 100) : 0,
+            ];
+        })->values();
+
+        return response()->json([
+            'currency' => $network->currency,
+            'stores'   => [
+                'total'  => $network->stores->count(),
+                'online' => $network->stores->where('online', true)->count(),
+            ],
+            'invitations' => [
+                'pending'  => $invitations->where('status', 'pending')->count(),
+                'declined' => $invitations->where('status', 'declined')->count(),
+                'expired'  => $invitations->where('status', 'expired')->count(),
+            ],
+            'orders' => [
+                'count_7d'       => $liveOrders->count(),
+                'multi_store_7d' => $multiStore,
+                'canceled_7d'    => $orders->count() - $liveOrders->count(),
+            ],
+            'revenue' => [
+                'total_7d' => $revenue,
+                'tips_7d'  => $tips,
+                'currency' => $network->currency,
+            ],
+            'customers' => [
+                'total'          => $customers,
+                'new_this_month' => $newCustomers,
+            ],
+            'members'       => $stores,
+            'recent_orders' => $orders->take(5)->map(fn ($order) => [
+                'public_id'     => $order->public_id,
+                'checkout_id'   => data_get($order, 'meta.checkout_id'),
+                'customer_name' => data_get($order, 'customer.name'),
+                'store_id'      => data_get($order, 'meta.storefront_id'),
+                'store_name'    => data_get($order, 'meta.storefront'),
+                'total'         => data_get($order, 'meta.total'),
+                'currency'      => data_get($order, 'meta.currency', $network->currency),
+                'status'        => $order->status,
+                'created_at'    => $order->created_at,
+            ])->values(),
+        ]);
+    }
+
+    /**
+     * The shape the console reads an invitation in: one recipient, a derived state and the
+     * options it was sent with.
+     */
+    public static function serializeInvitation(Invite $invitation): array
+    {
+        $meta      = $invitation->meta ?? [];
+        $status    = data_get($meta, 'status', 'pending');
+        $expiresAt = $invitation->expires_at ? Carbon::parse($invitation->expires_at) : null;
+
+        if ($status === 'pending' && $expiresAt && $expiresAt->isPast()) {
+            $status = 'expired';
+        }
+
+        return [
+            'id'               => $invitation->uuid,
+            'uuid'             => $invitation->uuid,
+            'public_id'        => $invitation->public_id,
+            'uri'              => $invitation->uri,
+            'code'             => $invitation->code,
+            'email'            => collect($invitation->recipients ?? [])->first(),
+            'recipients'       => $invitation->recipients ?? [],
+            'status'           => $status,
+            'category_uuid'    => data_get($meta, 'category_uuid'),
+            'message'          => data_get($meta, 'message'),
+            'require_approval' => (bool) data_get($meta, 'require_approval', false),
+            'resent_at'        => data_get($meta, 'resent_at'),
+            'declined_at'      => data_get($meta, 'declined_at'),
+            'accepted_at'      => data_get($meta, 'accepted_at'),
+            'expires_at'       => $expiresAt,
+            'created_at'       => $invitation->created_at,
+            'updated_at'       => $invitation->updated_at,
+        ];
+    }
+
     /**
      * Add stores to a network.
      *
diff --git a/server/src/Http/Controllers/v1/FoodTruckController.php b/server/src/Http/Controllers/v1/FoodTruckController.php
index be35a803..4f07070b 100644
--- a/server/src/Http/Controllers/v1/FoodTruckController.php
+++ b/server/src/Http/Controllers/v1/FoodTruckController.php
@@ -5,6 +5,7 @@
 use Fleetbase\Http\Controllers\Controller;
 use Fleetbase\Storefront\Http\Resources\FoodTruck as FoodTruckResource;
 use Fleetbase\Storefront\Models\FoodTruck;
+use Fleetbase\Storefront\Models\Network;
 use Illuminate\Database\Eloquent\ModelNotFoundException;
 use Illuminate\Http\Request;
 
@@ -17,25 +18,47 @@ class FoodTruckController extends Controller
      */
     public function query(Request $request)
     {
-        $limit   = $request->input('limit', false);
-        $offset  = $request->input('offset', false);
-        $results = [];
+        $limit    = $request->input('limit', false);
+        $offset   = $request->input('offset', false);
+        $storeIds = static::storeUuidsForStorefront();
+        if (empty($storeIds)) {
+            return FoodTruckResource::collection([]);
+        }
+
+        $results = FoodTruck::queryWithRequestCached($request, function (&$query) use ($limit, $offset, $storeIds) {
+            $query->whereIn('store_uuid', $storeIds)->with(['store', 'vehicle', 'zone', 'serviceArea', 'catalogs']);
+
+            if ($limit) {
+                $query->limit($limit);
+            }
+
+            if ($offset) {
+                $query->offset($offset);
+            }
+        });
 
+        return FoodTruckResource::collection($results);
+    }
+
+    /**
+     * The stores whose food trucks this storefront shows: a store's own, or in a network
+     * every member store's, so a network can run trucks alongside its stores.
+     *
+     * @return array<string>
+     */
+    protected static function storeUuidsForStorefront(): array
+    {
         if (session('storefront_store')) {
-            $results = FoodTruck::queryWithRequestCached($request, function (&$query) use ($limit, $offset) {
-                $query->where('store_uuid', session('storefront_store'));
+            return [session('storefront_store')];
+        }
 
-                if ($limit) {
-                    $query->limit($limit);
-                }
+        if (session('storefront_network')) {
+            $network = Network::where('uuid', session('storefront_network'))->first();
 
-                if ($offset) {
-                    $query->offset($offset);
-                }
-            });
+            return $network ? $network->stores()->pluck('stores.uuid')->all() : [];
         }
 
-        return FoodTruckResource::collection($results);
+        return [];
     }
 
     /**
@@ -52,6 +75,13 @@ public function find($id)
             return response()->error('Food Truck resource not found.');
         }
 
+        // Only a truck of this storefront (its own, or a network member store's).
+        if (!in_array($foodTruck->store_uuid, static::storeUuidsForStorefront(), true)) {
+            return response()->error('Food Truck resource not found.', 404);
+        }
+
+        $foodTruck->loadMissing(['store', 'vehicle', 'zone', 'serviceArea', 'catalogs']);
+
         // response the product resource
         return new FoodTruckResource($foodTruck);
     }
diff --git a/server/src/Http/Filter/CustomerFilter.php b/server/src/Http/Filter/CustomerFilter.php
index c641cdf4..fda8e2a1 100644
--- a/server/src/Http/Filter/CustomerFilter.php
+++ b/server/src/Http/Filter/CustomerFilter.php
@@ -15,4 +15,17 @@ function ($query) use ($storefront) {
             }
         );
     }
+
+    /**
+     * Customers who ordered through a network.
+     */
+    public function network($network)
+    {
+        $this->builder->whereHas(
+            'customerOrders',
+            function ($query) use ($network) {
+                $query->where('meta->storefront_network_id', $network);
+            }
+        );
+    }
 }
diff --git a/server/src/Http/Filter/FoodTruckFilter.php b/server/src/Http/Filter/FoodTruckFilter.php
index 67f34be2..4e7578ed 100644
--- a/server/src/Http/Filter/FoodTruckFilter.php
+++ b/server/src/Http/Filter/FoodTruckFilter.php
@@ -28,6 +28,19 @@ function ($query) use ($storefront) {
         );
     }
 
+    /**
+     * Trucks run by any store that is a member of the network.
+     */
+    public function network(?string $network)
+    {
+        $this->builder->whereHas(
+            'store.networks',
+            function ($query) use ($network) {
+                $query->where('network_uuid', $network);
+            }
+        );
+    }
+
     public function serviceArea(string $serviceAreaId)
     {
         $matchingServiceAreaIds = ServiceArea::on(config('fleetbase.connection.db'))
diff --git a/server/src/Http/Filter/OrderFilter.php b/server/src/Http/Filter/OrderFilter.php
index 6b114fb8..4438078b 100644
--- a/server/src/Http/Filter/OrderFilter.php
+++ b/server/src/Http/Filter/OrderFilter.php
@@ -49,4 +49,13 @@ public function storefront(string $storefront)
     {
         $this->builder->where('meta->storefront_id', $storefront);
     }
+
+    /**
+     * Orders placed through a network: the store is always `storefront_id`, the network
+     * that sold it is `storefront_network_id`.
+     */
+    public function network(string $network)
+    {
+        $this->builder->where('meta->storefront_network_id', $network);
+    }
 }
diff --git a/server/src/Http/Resources/FoodTruck.php b/server/src/Http/Resources/FoodTruck.php
index 942e3624..028be3e6 100644
--- a/server/src/Http/Resources/FoodTruck.php
+++ b/server/src/Http/Resources/FoodTruck.php
@@ -36,6 +36,14 @@ public function toArray($request)
             'location'                       => $this->vehicle ? $this->vehicle->location : null,
             'online'                         => $this->vehicle ? $this->vehicle->online : false,
             'status'                         => $this->status,
+            // The store the truck belongs to, so a network can name it and order from it.
+            'store'                          => $this->whenLoaded('store', fn () => $this->store ? [
+                'id'          => $this->store->public_id,
+                'name'        => $this->store->name,
+                'logo_url'    => $this->store->logo_url,
+                'currency'    => $this->store->currency,
+                'options'     => $this->store->options,
+            ] : null),
             'created_at'                     => $this->created_at,
             'updated_at'                     => $this->updated_at,
         ];
diff --git a/server/src/Http/Resources/Index/Order.php b/server/src/Http/Resources/Index/Order.php
index 75ef05b9..a51ccdac 100644
--- a/server/src/Http/Resources/Index/Order.php
+++ b/server/src/Http/Resources/Index/Order.php
@@ -35,6 +35,7 @@ private function storefrontOrderMeta(): array
             'storefront_id',
             'storefront_network',
             'storefront_network_id',
+            'checkout_id',
             'subtotal',
             'delivery_fee',
             'tip',
diff --git a/server/src/Http/Resources/Network.php b/server/src/Http/Resources/Network.php
index bf8d8987..5e89ae74 100644
--- a/server/src/Http/Resources/Network.php
+++ b/server/src/Http/Resources/Network.php
@@ -44,6 +44,7 @@ public function toArray($request)
             'rating'                    => $this->rating,
             'online'                    => $this->online,
             'stores'                    => $this->when($request->boolean('with_stores') || $request->inArray('with', 'stores'), Store::collection($this->stores)),
+            'stores_count'              => $this->when(Http::isInternalRequest(), (int) ($this->stores_count ?? $this->stores()->count())),
             'categories'                => $this->when($request->boolean('with_categories') || $request->inArray('with', 'categories'), Category::collection($this->categories)),
             'gateways'                  => $this->when($request->boolean('with_gateways') || $request->inArray('with', 'gateways'), Gateway::collection($this->gateways)),
             'notification_channels'     => $this->when($request->boolean('with_notification_channels') || $request->inArray('with', 'notification_channels'), NotificationChannel::collection($this->notificationChannels)),
diff --git a/server/src/routes.php b/server/src/routes.php
index 0f39a4d6..a44a9e4f 100644
--- a/server/src/routes.php
+++ b/server/src/routes.php
@@ -237,6 +237,10 @@ function ($router, $controller) {
                                 $router->post('{id}/add-stores', $controller('addStores'));
                                 $router->post('{id}/remove-stores', $controller('removeStores'));
                                 $router->post('{id}/invite', $controller('sendInvites'));
+                                $router->get('{id}/invitations', $controller('invitations'));
+                                $router->post('{id}/invitations/{invitationId}/resend', $controller('resendInvitation'));
+                                $router->delete('{id}/invitations/{invitationId}', $controller('revokeInvitation'));
+                                $router->get('{id}/overview', $controller('overview'));
                             }
                         );
                         $router->fleetbaseRoutes('customers');
diff --git a/server/tests/Unit/Http/Filter/StorefrontFilterContractsTest.php b/server/tests/Unit/Http/Filter/StorefrontFilterContractsTest.php
index 73c56f18..61ee5bdc 100644
--- a/server/tests/Unit/Http/Filter/StorefrontFilterContractsTest.php
+++ b/server/tests/Unit/Http/Filter/StorefrontFilterContractsTest.php
@@ -171,6 +171,19 @@ function applyStorefrontFilter(string $filter, Builder $builder, string $uri, ar
         ->and($public->toSql())->not->toContain('"food_trucks"."deleted_at" is null');
 });
 
+test('food truck network filter constrains trucks to the stores that are members of the network', function () {
+    $builder = applyStorefrontFilter(
+        FoodTruckFilter::class,
+        (new FoodTruck())->newQuery(),
+        'int/v1/storefront/food-trucks',
+        ['network' => 'network_uuid']
+    );
+
+    expect($builder->toSql())->toContain('exists')
+        ->and($builder->toSql())->toContain('"network_uuid" = ?')
+        ->and($builder->getBindings())->toContain('network_uuid');
+});
+
 test('food truck service-area filter resolves public ids and UUIDs before constraining trucks', function () {
     $connection = Model::getConnectionResolver()->connection('mysql');
     $schema     = $connection->getSchemaBuilder();
diff --git a/tests/dummy/app/services/intl.js b/tests/dummy/app/services/intl.js
new file mode 100644
index 00000000..90cd3308
--- /dev/null
+++ b/tests/dummy/app/services/intl.js
@@ -0,0 +1,18 @@
+import IntlService from 'ember-intl/services/intl';
+
+/**
+ * ember-intl builds a formatter for every bundled locale when the service is
+ * created. Headless Chrome ships no number-format data for some of them
+ * (Mongolian among them), which ember-intl's default handler turns into a thrown
+ * error inside whichever test first touches intl. Missing locale data and
+ * missing translations are not what any test here checks, so both are ignored.
+ */
+export default class DummyIntlService extends IntlService {
+    onIntlError(error) {
+        if (error?.code === 'MISSING_DATA' || error?.code === 'MISSING_TRANSLATION') {
+            return;
+        }
+
+        super.onIntlError(error);
+    }
+}
diff --git a/tests/dummy/config/environment.js b/tests/dummy/config/environment.js
index 61f3a09d..12eb0fdb 100644
--- a/tests/dummy/config/environment.js
+++ b/tests/dummy/config/environment.js
@@ -14,6 +14,20 @@ module.exports = function (environment) {
             },
         },
 
+        // `@fleetbase/ember-core`'s application adapter reads `config.API.host` at
+
+        // module scope, so the dummy application must declare it before any
+
+        // adapter module can even be evaluated. The values are deliberately
+
+        // obviously-fake: nothing in the suite performs a real request.
+
+        API: {
+            host: 'https://api.fleetbase.test',
+
+            namespace: 'int/v1',
+        },
+
         APP: {
             // Here you can pass flags/options to your application instance
             // when it is created
diff --git a/tests/integration/components/shared-identity-test.js b/tests/integration/components/shared-identity-test.js
index 00bf135c..aed5eba7 100644
--- a/tests/integration/components/shared-identity-test.js
+++ b/tests/integration/components/shared-identity-test.js
@@ -17,7 +17,7 @@ module('Integration | Component | shared identity components', function (hooks)
     });
 
     test('a driver identity cell renders the name, status dot and vehicle badge from the shared descriptor', async function (assert) {
-        this.set('row', { driver_assigned: { resourceType: 'driver', name: 'Ada Driver', status: 'available', vehicle_name: 'Truck 10' } });
+        this.set('row', { driver_assigned: { resourceType: 'driver', name: 'Ada Driver', status: 'available', online: true, vehicle_name: 'Truck 10' } });
         this.set('column', { resourceType: 'driver', resourcePath: 'driver_assigned', popover: false });
 
         await render(hbs`<Table::Cell::Identity @row={{this.row}} @column={{this.column}} />`);
@@ -52,7 +52,7 @@ module('Integration | Component | shared identity components', function (hooks)
         `);
 
         assert.dom('[data-test-customer] [data-test-resource-pill-title]').hasText('Ava Chen');
-        assert.dom('[data-test-customer] [data-test-resource-pill-subtitle]').hasText('Customer');
+        assert.dom('[data-test-customer] [data-test-resource-pill-subtitle]').hasText('Contact', 'the polymorphic type reads as a person would say it');
         assert.dom('[data-test-driver] [data-test-resource-pill-title]').hasText('Ada Driver');
         assert.dom('[data-test-driver] [data-test-resource-pill-subtitle]').hasText('+15550100');
         assert.dom('[data-test-place] [data-test-resource-pill-title]').hasText('Depot');
diff --git a/tests/integration/components/store-selector-test.js b/tests/integration/components/store-selector-test.js
index 4226febf..b631dc9a 100644
--- a/tests/integration/components/store-selector-test.js
+++ b/tests/integration/components/store-selector-test.js
@@ -2,9 +2,12 @@ import { module, test } from 'qunit';
 import { setupRenderingTest } from 'dummy/tests/helpers';
 import { click, render, triggerEvent, triggerKeyEvent } from '@ember/test-helpers';
 import { hbs } from 'ember-cli-htmlbars';
+import { setupIntl } from 'ember-intl/test-support';
 
 module('Integration | Component | store-selector', function (hooks) {
     setupRenderingTest(hooks);
+    // The trigger reads a translation while rendering, so intl must exist before the first render.
+    setupIntl(hooks, 'en-us');
 
     hooks.afterEach(function () {
         document.querySelectorAll('.store-selector-dropdown-menu').forEach((menu) => menu.remove());
@@ -51,9 +54,7 @@ module('Integration | Component | store-selector', function (hooks) {
         assert.ok(dropdownContent, 'dropdown content renders when opened');
         assert.false(this.element.contains(dropdownContent), 'dropdown content renders outside the sidebar-clipped component tree');
         assert.strictEqual(dropdownContent.style.position, 'fixed', 'dropdown uses fixed positioning');
-        assert.strictEqual(dropdownContent.style.height, 'auto', 'dropdown height hugs its content');
-        assert.strictEqual(dropdownContent.style.minHeight, '0px', 'dropdown does not inherit full-height menu sizing');
-        assert.strictEqual(dropdownContent.querySelector('[role="group"]').style.overflowY, 'auto', 'store list only scrolls when needed');
+        assert.ok(dropdownContent.querySelector('[role="group"]'), 'stores render as a group');
         assert.dom('.ember-basic-dropdown-content').doesNotExist('does not use BasicDropdown content');
     });
 
@@ -80,7 +81,7 @@ module('Integration | Component | store-selector', function (hooks) {
         `);
         await click('button');
         assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).exists('dropdown opens');
-        await click(document.body.querySelectorAll('.store-selector-dropdown-menu .next-dd-item')[1]);
+        await click(document.body.querySelectorAll('.store-selector-dropdown-menu .storefront-switcher-menu__item')[1]);
 
         assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).doesNotExist('dropdown closes after switching stores');
     });
@@ -105,7 +106,7 @@ module('Integration | Component | store-selector', function (hooks) {
         `);
         await click('button');
         assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).exists('dropdown opens');
-        await click(document.body.querySelector('.store-selector-dropdown-menu .px-1:last-child .next-dd-item'));
+        await click(document.body.querySelector('[data-test-store-selector-actions] .storefront-switcher-menu__item'));
 
         assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).doesNotExist('dropdown closes after create action');
     });
@@ -135,4 +136,114 @@ module('Integration | Component | store-selector', function (hooks) {
         await triggerEvent(document.body, 'mousedown');
         assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).doesNotExist('outside click closes dropdown');
     });
+
+    test('a user with stores and no networks sees the plain store menu', async function (assert) {
+        this.set('activeStore', { id: 'store_1', name: 'Fleetbase Market' });
+        this.set('stores', [{ id: 'store_1', name: 'Fleetbase Market' }]);
+        this.set('noop', () => {});
+
+        await render(hbs`<StoreSelector @stores={{this.stores}} @activeStore={{this.activeStore}} @onCreateStore={{this.noop}} @onSwitchStore={{this.noop}} />`);
+        await click('button');
+
+        const menu = document.body.querySelector('.store-selector-dropdown-menu');
+        assert.dom('[data-test-store-selector-trigger]').hasAttribute('data-context', 'store');
+        assert.dom(menu.querySelector('[data-test-store-selector-networks]')).doesNotExist('no networks group');
+        assert.dom(menu.querySelector('.storefront-switcher-menu__head')).doesNotExist('no group labels when there is only one group');
+        assert.dom(menu.querySelector('[aria-current="true"]')).hasText('Fleetbase Market', 'the active store is marked');
+        assert.strictEqual(menu.querySelectorAll('[data-test-store-selector-actions] .storefront-switcher-menu__item').length, 1, 'only the new store action');
+    });
+
+    test('it lists networks as a second group and switches into one', async function (assert) {
+        assert.expect(7);
+
+        this.set('activeStore', { id: 'store_1', name: 'Fleetbase Market' });
+        this.set('stores', [{ id: 'store_1', name: 'Fleetbase Market' }]);
+        this.set('networks', [
+            { id: 'network_1', name: 'Downtown Market' },
+            { id: 'network_2', name: 'Uptown Market' },
+        ]);
+        this.set('noop', () => {});
+        this.set('switchNetwork', (network) => {
+            assert.strictEqual(network.id, 'network_2', 'passes the selected network');
+        });
+
+        await render(hbs`
+            <StoreSelector
+                @stores={{this.stores}}
+                @networks={{this.networks}}
+                @activeStore={{this.activeStore}}
+                @onCreateStore={{this.noop}}
+                @onSwitchStore={{this.noop}}
+                @onSwitchNetwork={{this.switchNetwork}}
+                @onCreateNetwork={{this.noop}}
+            />
+        `);
+        await click('button');
+
+        const menu = document.body.querySelector('.store-selector-dropdown-menu');
+        assert.deepEqual(
+            Array.from(menu.querySelectorAll('.storefront-switcher-menu__head')).map((label) => label.textContent),
+            ['Stores', 'Networks'],
+            'both groups are labelled'
+        );
+        const networkItems = menu.querySelectorAll('[data-test-store-selector-networks] .storefront-switcher-menu__item');
+        assert.deepEqual(
+            Array.from(networkItems).map((item) => item.textContent),
+            ['Downtown Market', 'Uptown Market']
+        );
+        assert.dom(menu.querySelector('[data-test-store-selector-stores] [aria-current="true"]')).hasText('Fleetbase Market');
+        assert.dom(menu.querySelector('[data-test-store-selector-networks] [aria-current="true"]')).doesNotExist('no network is active in the store context');
+        assert.strictEqual(menu.querySelectorAll('[data-test-store-selector-actions] .storefront-switcher-menu__item').length, 2, 'new store and new network actions');
+
+        await click(networkItems[1]);
+        assert.dom(document.body.querySelector('.store-selector-dropdown-menu')).doesNotExist('dropdown closes after switching networks');
+    });
+
+    test('in the network context the trigger shows the network and marks it active', async function (assert) {
+        this.set('activeStore', { id: 'store_1', name: 'Fleetbase Market' });
+        this.set('activeNetwork', { id: 'network_1', name: 'Downtown Market' });
+        this.set('stores', [{ id: 'store_1', name: 'Fleetbase Market' }]);
+        this.set('networks', [{ id: 'network_1', name: 'Downtown Market' }]);
+        this.set('noop', () => {});
+
+        await render(hbs`
+            <StoreSelector
+                @stores={{this.stores}}
+                @networks={{this.networks}}
+                @activeStore={{this.activeStore}}
+                @activeNetwork={{this.activeNetwork}}
+                @onCreateStore={{this.noop}}
+                @onSwitchStore={{this.noop}}
+                @onSwitchNetwork={{this.noop}}
+            />
+        `);
+
+        assert.dom('[data-test-store-selector-trigger]').hasAttribute('data-context', 'network');
+        assert.dom('[data-test-store-selector-trigger]').containsText('Downtown Market');
+        assert.dom('[data-test-store-selector-trigger]').hasAttribute('title', 'Network: Downtown Market');
+
+        await click('button');
+        const menu = document.body.querySelector('.store-selector-dropdown-menu');
+        assert.dom(menu.querySelector('[data-test-store-selector-networks] [aria-current="true"]')).hasText('Downtown Market');
+        assert.dom(menu.querySelector('[data-test-store-selector-stores] [aria-current="true"]')).doesNotExist('the store is not marked while a network is active');
+        assert.dom(menu.querySelector('[data-test-store-selector-actions]').lastElementChild).hasText('New store', 'no new network action without a handler');
+    });
+
+    test('it creates a network and closes the dropdown', async function (assert) {
+        assert.expect(2);
+
+        this.set('activeStore', { id: 'store_1', name: 'Fleetbase Market' });
+        this.set('stores', [{ id: 'store_1', name: 'Fleetbase Market' }]);
+        this.set('noop', () => {});
+        this.set('createNetwork', () => assert.ok(true, 'calls create network action'));
+
+        await render(
+            hbs`<StoreSelector @stores={{this.stores}} @activeStore={{this.activeStore}} @onCreateStore={{this.noop}} @onSwitchStore={{this.noop}} @onCreateNetwork={{this.createNetwork}} />`
+        );
+        await click('button');
+
+        const menu = document.body.querySelector('.store-selector-dropdown-menu');
+        assert.dom(menu.querySelector('[data-test-store-selector-networks] .storefront-switcher-menu__empty')).hasText('No networks yet');
+        await click(menu.querySelector('[data-test-store-selector-actions] .storefront-switcher-menu__item:last-child'));
+    });
 });
diff --git a/tests/integration/components/storefront/catalog/card-test.js b/tests/integration/components/storefront/catalog/card-test.js
new file mode 100644
index 00000000..fad39c71
--- /dev/null
+++ b/tests/integration/components/storefront/catalog/card-test.js
@@ -0,0 +1,53 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import { render, click } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | storefront/catalog/card', function (hooks) {
+    setupRenderingTest(hooks);
+    setupIntl(hooks, 'en-us');
+
+    test('it renders the catalog, its categories with counts, its hours and its product total', async function (assert) {
+        const edited = [];
+        this.set('catalog', {
+            name: 'Lunch menu',
+            description: 'Weekday lunch service',
+            status: 'published',
+            updatedAgo: '5 days',
+            categories: [
+                { name: 'Mains', products: [{}, {}, {}] },
+                { name: 'Drinks', products: [{}] },
+            ],
+            hours: [{ day_of_week: 'Monday', start: '11:00', end: '15:00' }],
+        });
+        this.set('edit', (catalog) => edited.push(catalog));
+        this.set('remove', () => {});
+
+        await render(hbs`<Storefront::Catalog::Card @catalog={{this.catalog}} @onEdit={{this.edit}} @onDelete={{this.remove}} />`);
+
+        assert.dom('[data-test-storefront-catalog-card]').exists().doesNotHaveClass('is-draft');
+        assert.dom('[data-test-catalog-name]').hasText('Lunch menu');
+        assert.dom('[data-test-catalog-status]').includesText('Published');
+        assert.dom('[data-test-catalog-category]').exists({ count: 2 });
+        assert.dom('[data-test-catalog-category]:first-child').hasText('Mains 3');
+        assert.dom('[data-test-catalog-products-count]').hasText('4 products');
+        assert.dom('[data-test-hours-day="monday"]').hasAttribute('data-open', 'true');
+        assert.dom('[data-test-catalog-edit]').exists();
+        assert.dom('[data-test-catalog-delete]').exists();
+
+        await click('[data-test-catalog-name]');
+        assert.strictEqual(edited[0], this.catalog, 'the name opens the editor');
+    });
+
+    test('a draft catalog with nothing in it says so', async function (assert) {
+        this.set('catalog', { name: 'Festive hampers', status: 'draft', categories: [], hours: [] });
+
+        await render(hbs`<Storefront::Catalog::Card @catalog={{this.catalog}} />`);
+
+        assert.dom('[data-test-storefront-catalog-card]').hasClass('is-draft');
+        assert.dom('[data-test-catalog-empty]').hasText('No categories yet');
+        assert.dom('[data-test-catalog-products-count]').hasText('No products');
+        assert.dom('[data-test-catalog-edit]').doesNotExist('no edit handler, no edit button');
+    });
+});
diff --git a/tests/integration/components/storefront/hours-strip-test.js b/tests/integration/components/storefront/hours-strip-test.js
new file mode 100644
index 00000000..32ebe043
--- /dev/null
+++ b/tests/integration/components/storefront/hours-strip-test.js
@@ -0,0 +1,33 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'dummy/tests/helpers';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | storefront/hours-strip', function (hooks) {
+    setupRenderingTest(hooks);
+
+    test('it fills the days a schedule covers and labels each with its hours', async function (assert) {
+        this.set('hours', [
+            { day_of_week: 'Monday', start: '11:00', end: '15:00' },
+            { day_of_week: 'tuesday', start: '11:00', end: '15:00' },
+            { day_of_week: 'Sat', start: '09:00', end: '12:00' },
+            { day_of_week: 'Saturday', start: '17:00', end: '21:00' },
+        ]);
+
+        await render(hbs`<Storefront::HoursStrip @hours={{this.hours}} />`);
+
+        assert.dom('[data-test-hours-day]').exists({ count: 7 });
+        assert.dom('[data-test-hours-day="monday"]').hasAttribute('data-open', 'true').hasAttribute('title', 'Monday: 11:00 to 15:00');
+        assert.dom('[data-test-hours-day="tuesday"]').hasAttribute('data-open', 'true');
+        assert.dom('[data-test-hours-day="saturday"]').hasAttribute('title', 'Saturday: 09:00 to 12:00, 17:00 to 21:00');
+        assert.dom('[data-test-hours-day="sunday"]').hasAttribute('data-open', 'false').hasAttribute('title', 'Sunday: closed');
+        assert.dom('[data-test-hours-strip]').hasAttribute('aria-label', '3 of 7 days');
+    });
+
+    test('no hours means seven closed days', async function (assert) {
+        await render(hbs`<Storefront::HoursStrip />`);
+
+        assert.dom('[data-test-hours-day][data-open="true"]').doesNotExist();
+        assert.dom('[data-test-hours-strip]').hasAttribute('aria-label', '0 of 7 days');
+    });
+});
diff --git a/tests/integration/components/storefront/network/card-test.js b/tests/integration/components/storefront/network/card-test.js
new file mode 100644
index 00000000..81576fdd
--- /dev/null
+++ b/tests/integration/components/storefront/network/card-test.js
@@ -0,0 +1,48 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import { render, click } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Component | storefront/network/card', function (hooks) {
+    setupRenderingTest(hooks);
+    setupIntl(hooks, 'en-us');
+
+    test('it renders the network, its member count, its logo and its actions', async function (assert) {
+        const opened = [];
+        this.set('network', {
+            name: 'Fleetbase Marketplace',
+            currency: 'SGD',
+            online: true,
+            stores_count: 5,
+            logo_url: 'https://cdn.test/logo.png',
+            backdrop_url: 'https://cdn.test/backdrop.png',
+        });
+        this.set('open', (network) => opened.push(network));
+        this.set('noop', () => {});
+
+        await render(hbs`<Storefront::Network::Card @network={{this.network}} @onOpen={{this.open}} @onInvite={{this.noop}} @onDelete={{this.noop}} />`);
+
+        assert.dom('[data-test-network-name]').hasText('Fleetbase Marketplace');
+        assert.dom('[data-test-network-indicator]').hasClass('text-green-500');
+        assert.dom('[data-test-storefront-network-card]').includesText('SGD · 5 stores');
+        assert.dom('[data-test-network-logo]').hasAttribute('src', 'https://cdn.test/logo.png');
+        assert.dom('[data-test-network-status]').includesText('Online');
+        assert.dom('[data-test-network-open]').exists();
+        assert.dom('[data-test-network-invite]').exists();
+        assert.dom('[data-test-network-delete]').exists();
+
+        await click('[data-test-network-name]');
+        assert.strictEqual(opened[0], this.network);
+    });
+
+    test('an offline network counts its loaded stores when no count is given', async function (assert) {
+        this.set('network', { name: 'Night market', online: false, stores: [{}, {}] });
+
+        await render(hbs`<Storefront::Network::Card @network={{this.network}} />`);
+
+        assert.dom('[data-test-network-indicator]').hasClass('text-gray-400');
+        assert.dom('[data-test-network-status]').includesText('Offline');
+        assert.dom('[data-test-storefront-network-card]').includesText('2 stores');
+    });
+});
diff --git a/tests/integration/components/storefront/order/details-test.js b/tests/integration/components/storefront/order/details-test.js
index 981b8944..185ebc4a 100644
--- a/tests/integration/components/storefront/order/details-test.js
+++ b/tests/integration/components/storefront/order/details-test.js
@@ -1,13 +1,49 @@
 import { module, test } from 'qunit';
 import { setupRenderingTest } from 'dummy/tests/helpers';
-import { render } from '@ember/test-helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import { render, findAll } from '@ember/test-helpers';
+import Service from '@ember/service';
 import { hbs } from 'ember-cli-htmlbars';
 import { initialize } from '@fleetbase/fleetops-data/instance-initializers/register-shared-resource-descriptors';
 
 module('Integration | Component | storefront/order/details', function (hooks) {
     setupRenderingTest(hooks);
+    setupIntl(hooks, 'en-us');
 
     hooks.beforeEach(function () {
+        // The activity, route and tracking panels fetch on insert and the dummy app has
+        // no API. A request that never answers leaves each task pending, and ember-concurrency
+        // cancels it with its component, so nothing writes to a torn-down panel.
+        this.owner.register(
+            'service:fetch',
+            class extends Service {
+                get() {
+                    return new Promise(() => {});
+                }
+
+                post() {
+                    return new Promise(() => {});
+                }
+            }
+        );
+        // The app cache keeps a proxy that outlives a test's owner; the activity panel reads
+        // it while initialising, so give it an inert cache like the widget tests do.
+        this.owner.register(
+            'service:app-cache',
+            class extends Service {
+                get() {
+                    return undefined;
+                }
+
+                set() {}
+
+                setEmberData() {}
+
+                getEmberData() {
+                    return [];
+                }
+            }
+        );
         initialize(this.owner);
     });
 
@@ -55,13 +91,14 @@ module('Integration | Component | storefront/order/details', function (hooks) {
 
         await render(hbs`<Storefront::Order::Details @resource={{this.order}} />`);
 
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Activity');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Store');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Order');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Details');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Customer Insights');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Route');
-        assert.dom('.next-content-panel-title-container').hasTextContaining('Metadata');
+        const titles = findAll('.next-content-panel-title-container').map((element) => element.textContent.trim());
+
+        for (const title of ['Activity', 'Store', 'Order', 'Details', 'Customer Insights', 'Route', 'Metadata']) {
+            assert.ok(
+                titles.some((text) => text.includes(title)),
+                `a panel titled ${title} renders`
+            );
+        }
         assert.dom('.storefront-order-person__name').hasTextContaining('Tasty Store');
         assert.dom('[data-test-order-driver-pill] [data-test-resource-pill-title]').hasText('No driver assigned', 'an unassigned driver is a static pill with the fallback title');
         assert.dom('[data-test-order-customer-pill] [data-test-resource-pill-title]').hasText('No customer');
diff --git a/tests/integration/components/storefront/truck/card-test.js b/tests/integration/components/storefront/truck/card-test.js
new file mode 100644
index 00000000..47237858
--- /dev/null
+++ b/tests/integration/components/storefront/truck/card-test.js
@@ -0,0 +1,59 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+import { initialize } from '@fleetbase/fleetops-data/instance-initializers/register-shared-resource-descriptors';
+
+module('Integration | Component | storefront/truck/card', function (hooks) {
+    setupRenderingTest(hooks);
+    setupIntl(hooks, 'en-us');
+
+    hooks.beforeEach(function () {
+        initialize(this.owner);
+    });
+
+    test('an online truck with catalogs renders its vehicle pill, area, photo and presence', async function (assert) {
+        this.set('truck', {
+            status: 'active',
+            online: true,
+            vehicle: { id: 'vehicle_1', resourceType: 'vehicle', display_name: 'Truck 10', plate_number: 'SKZ 1049 A', photo_url: 'https://cdn.test/truck.png', online: true },
+            service_area: { name: 'Central' },
+            zone: { name: 'Zone 3' },
+            catalogs: [{ name: 'Lunch menu' }, { name: 'Breakfast' }],
+            store: { name: 'Fleetbase Market' },
+        });
+        this.set('noop', () => {});
+
+        await render(hbs`<Storefront::Truck::Card @truck={{this.truck}} @onEdit={{this.noop}} @onAssignCatalogs={{this.noop}} @onDelete={{this.noop}} />`);
+
+        assert.dom('[data-test-storefront-truck-card]').exists();
+        assert.dom('[data-test-truck-vehicle] [data-test-resource-pill-title]').hasText('Truck 10');
+        assert.dom('[data-test-truck-vehicle] [data-test-pill-online-indicator]').hasClass('text-green-500');
+        assert.dom('[data-test-truck-area]').hasText('Central · Zone 3');
+        assert.dom('[data-test-truck-photo]').hasAttribute('src', 'https://cdn.test/truck.png');
+        assert.dom('[data-test-truck-presence]').includesText('Online');
+        assert.dom('[data-test-truck-catalogs-count]').hasText('2 catalogs');
+        assert.dom('[data-test-truck-store]').hasText('Owned by Fleetbase Market');
+        assert.dom('[data-test-truck-edit]').exists();
+        assert.dom('[data-test-truck-catalogs]').exists();
+        assert.dom('[data-test-truck-delete]').exists();
+    });
+
+    test('presence reads inactive, offline, or online with nothing to sell', async function (assert) {
+        this.set('truck', { status: 'inactive', online: true, catalogs: [{}] });
+        await render(hbs`<Storefront::Truck::Card @truck={{this.truck}} />`);
+        assert.dom('[data-test-truck-presence]').includesText('Inactive');
+
+        this.set('truck', { status: 'active', online: false, catalogs: [{}] });
+        await render(hbs`<Storefront::Truck::Card @truck={{this.truck}} />`);
+        assert.dom('[data-test-truck-presence]').includesText('Offline');
+
+        this.set('truck', { status: 'active', online: true, catalogs: [] });
+        await render(hbs`<Storefront::Truck::Card @truck={{this.truck}} />`);
+        assert.dom('[data-test-truck-presence]').includesText('Online, no catalog');
+        assert.dom('[data-test-truck-catalogs-count]').hasText('No catalogs');
+        assert.dom('[data-test-truck-area]').hasText('No service area');
+        assert.dom('[data-test-truck-vehicle] [data-test-resource-pill-title]').hasText('No vehicle assigned');
+    });
+});
diff --git a/tests/integration/components/widget/customers-test.js b/tests/integration/components/widget/customers-test.js
index 4aa03639..9a9f20b2 100644
--- a/tests/integration/components/widget/customers-test.js
+++ b/tests/integration/components/widget/customers-test.js
@@ -26,6 +26,14 @@ class FetchStubService extends Service {
 }
 
 class IntlStubService extends Service {
+    exists() {
+        return false;
+    }
+
+    onLocaleChanged() {
+        return () => {};
+    }
+
     t(key) {
         if (key === 'storefront.component.widget.customers.widget-title') {
             return 'Recent Customers';
diff --git a/tests/test-helper.js b/tests/test-helper.js
index 4efd6e58..d355f8d0 100644
--- a/tests/test-helper.js
+++ b/tests/test-helper.js
@@ -5,6 +5,17 @@ import { setApplication } from '@ember/test-helpers';
 import { setup } from 'qunit-dom';
 import { start } from 'ember-qunit';
 
+// The universe extension manager imports a module the console host generates at build
+// time. The engine's dummy app has no host, so provide an inert stand-in before boot.
+if (typeof window.define === 'function' && !window.requirejs?.entries?.['@fleetbase/console/extensions']) {
+    window.define('@fleetbase/console/extensions', ['exports'], function (exports) {
+        exports.getExtensionLoader = function () {
+            return null;
+        };
+        exports.default = {};
+    });
+}
+
 setApplication(Application.create(config.APP));
 
 setup(QUnit.assert);
diff --git a/tests/unit/controllers/application-test.js b/tests/unit/controllers/application-test.js
index 1ea16503..71546df1 100644
--- a/tests/unit/controllers/application-test.js
+++ b/tests/unit/controllers/application-test.js
@@ -29,10 +29,20 @@ class StorefrontStub {
         public_id: 'store_123',
         currency: 'USD',
     };
+    activeNetwork = null;
+    createNetworkCalls = [];
+
+    get isNetworkContext() {
+        return Boolean(this.activeNetwork);
+    }
 
     setActiveStorefront(store) {
         this.activeStore = store;
     }
+
+    createNewNetwork(options) {
+        this.createNetworkCalls.push(options);
+    }
 }
 
 class AbilitiesStub {
@@ -101,11 +111,21 @@ class LoaderStub {
 
 class HostRouterStub {
     refreshCount = 0;
+    transitions = [];
 
     refresh() {
         this.refreshCount++;
         return Promise.resolve();
     }
+
+    transitionTo(...args) {
+        this.transitions.push(args);
+        return Promise.resolve();
+    }
+
+    isActive() {
+        return false;
+    }
 }
 
 module('Unit | Controller | application', function (hooks) {
@@ -132,25 +152,25 @@ module('Unit | Controller | application', function (hooks) {
 
         assert.deepEqual(
             items.map((item) => item.label),
-            ['Dashboard', 'Products', 'Catalogs', 'Customers', 'Orders', 'Networks', 'Food Trucks', 'Promotions', 'Settings', 'Launch App'],
+            ['Dashboard', 'Orders', 'Products', 'Catalogs', 'Customers', 'Trucks', 'Promotions', 'Settings', 'Launch App'],
             'root items match the Storefront sidebar sections'
         );
         assert.deepEqual(
             items.map((item) => item.icon),
-            ['home', 'box', 'book-open', 'users', 'file-invoice-dollar', 'network-wired', 'truck', 'bullhorn', 'cogs', 'rocket'],
+            ['home', 'file-invoice-dollar', 'box', 'book-open', 'users', 'truck', 'bullhorn', 'cogs', 'rocket'],
             'root items keep Storefront-specific icons'
         );
         assert.strictEqual(items[0].route, 'console.storefront.home');
-        assert.strictEqual(items[1].permission, 'storefront list product');
-        assert.true(items[1].visible, 'product visibility uses the abilities service');
-        assert.false(items[1].disabled, 'resource items are enabled when an active store exists');
+        assert.strictEqual(items[2].permission, 'storefront list product');
+        assert.true(items[2].visible, 'product visibility uses the abilities service');
+        assert.false(items[2].disabled, 'resource items are enabled when an active store exists');
         assert.deepEqual(
-            items[1].children.map((item) => item.label),
+            items[2].children.map((item) => item.label),
             ['All Products', 'Pizza'],
             'products includes all products plus active store product categories'
         );
-        assert.strictEqual(items[1].children[0].route, 'console.storefront.products.index.index', 'all products does not match category routes');
-        const categoryItem = items[1].children[1];
+        assert.strictEqual(items[2].children[0].route, 'console.storefront.products.index.index', 'all products does not match category routes');
+        const categoryItem = items[2].children[1];
         assert.strictEqual(categoryItem.id, 'product-category:category_uuid', 'category navigation has a stable unique identifier');
         assert.strictEqual(categoryItem.route, undefined, 'categories do not fall back to shared route-name matching');
         const hostRouter = this.owner.lookup('service:host-router');
@@ -168,7 +188,7 @@ module('Unit | Controller | application', function (hooks) {
         };
         categoryItem.onClick();
         assert.deepEqual(
-            items[8].children.map((item) => item.route),
+            items[7].children.map((item) => item.route),
             [
                 'console.storefront.settings.index',
                 'console.storefront.settings.locations',
@@ -178,7 +198,7 @@ module('Unit | Controller | application', function (hooks) {
             ],
             'settings children use the requested order'
         );
-        assert.strictEqual(items[9].url, 'https://github.com/fleetbase/storefront-app', 'launch app remains an external URL item');
+        assert.strictEqual(items[8].url, 'https://github.com/fleetbase/storefront-app', 'launch app remains an external URL item');
     });
 
     test('it loads active store product categories for the sidebar navigator', async function (assert) {
@@ -285,8 +305,8 @@ module('Unit | Controller | application', function (hooks) {
         const items = controller.navigationItems;
 
         assert.false(items[0].disabled, 'dashboard remains available');
-        assert.true(items[1].disabled, 'products are disabled without an active store');
-        assert.true(items[8].disabled, 'settings are disabled without an active store');
+        assert.true(items[2].disabled, 'products are disabled without an active store');
+        assert.true(items[7].disabled, 'settings are disabled without an active store');
     });
 
     test('it fetches Storefront resource search results for the sidebar navigator', async function (assert) {
@@ -338,4 +358,79 @@ module('Unit | Controller | application', function (hooks) {
 
         assert.deepEqual(results, []);
     });
+
+    test('it rewrites the sidebar for the network context', function (assert) {
+        const storefront = this.owner.lookup('service:storefront');
+        const hostRouter = this.owner.lookup('service:host-router');
+        storefront.activeNetwork = { id: 'network_uuid', public_id: 'network_123', name: 'Downtown Market' };
+
+        const controller = this.owner.lookup('controller:application');
+        const items = controller.navigationItems;
+
+        assert.true(controller.isNetworkContext);
+        assert.deepEqual(
+            items.map((item) => item.label),
+            ['Overview', 'Stores', 'Trucks', 'Orders', 'Customers', 'Settings'],
+            'network sections replace the store sections'
+        );
+        assert.deepEqual(
+            items.map((item) => item.id),
+            [
+                'network:network_123:index',
+                'network:network_123:stores',
+                'network:network_123:trucks',
+                'network:network_123:orders',
+                'network:network_123:customers',
+                'network:network_123:settings',
+            ],
+            'items are keyed by network so two networks never share an entry'
+        );
+        assert.ok(
+            items.every((item) => item.route === undefined),
+            'network items do not use shared route-name matching'
+        );
+
+        hostRouter.isActive = (route, publicId) => route === 'console.storefront.networks.index.network.trucks' && publicId === 'network_123';
+        assert.true(items[2].activeWhen(), 'the trucks section is active on the network trucks route');
+        assert.false(items[1].activeWhen(), 'the stores section is not');
+
+        items[3].onClick();
+        assert.deepEqual(hostRouter.transitions, [['console.storefront.networks.index.network.orders', 'network_123']], 'sections transition with the network id');
+    });
+
+    test('switching to a network enters its stores page', function (assert) {
+        const controller = this.owner.lookup('controller:application');
+        const hostRouter = this.owner.lookup('service:host-router');
+
+        controller.switchActiveNetwork({ id: 'network_uuid', public_id: 'network_123' });
+
+        assert.deepEqual(hostRouter.transitions, [['console.storefront.networks.index.network.stores', 'network_123']]);
+    });
+
+    test('switching to a store from a network lands on the store dashboard', async function (assert) {
+        const storefront = this.owner.lookup('service:storefront');
+        const hostRouter = this.owner.lookup('service:host-router');
+        const store = this.owner.lookup('service:store');
+        storefront.activeNetwork = { id: 'network_uuid', public_id: 'network_123', name: 'Downtown Market' };
+
+        const controller = this.owner.lookup('controller:application');
+        await controller.switchActiveStore({ id: 'next_store_uuid', public_id: 'store_456', name: 'Next Store' });
+
+        assert.deepEqual(hostRouter.transitions, [['console.storefront.home']], 'leaves the network page instead of refreshing it');
+        assert.strictEqual(hostRouter.refreshCount, 0);
+        assert.strictEqual(storefront.activeStore.id, 'next_store_uuid', 'the selected store becomes active');
+        assert.strictEqual(store.requests[store.requests.length - 1].params.owner_uuid, 'next_store_uuid', 'categories load for the selected store');
+    });
+
+    test('creating a network switches into it once it is saved', function (assert) {
+        const controller = this.owner.lookup('controller:application');
+        const storefront = this.owner.lookup('service:storefront');
+        const hostRouter = this.owner.lookup('service:host-router');
+
+        controller.createNewNetwork();
+        assert.strictEqual(storefront.createNetworkCalls.length, 1, 'delegates to the storefront service');
+
+        storefront.createNetworkCalls[0].onSuccess({ id: 'network_uuid', public_id: 'network_123' });
+        assert.deepEqual(hostRouter.transitions, [['console.storefront.networks.index.network.stores', 'network_123']]);
+    });
 });
diff --git a/tests/unit/controllers/customers/index-test.js b/tests/unit/controllers/customers/index-test.js
index d8189724..d29291a8 100644
--- a/tests/unit/controllers/customers/index-test.js
+++ b/tests/unit/controllers/customers/index-test.js
@@ -1,8 +1,10 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
 
 module('Unit | Controller | customers/index', function (hooks) {
     setupTest(hooks);
+    setupIntl(hooks, 'en-us');
 
     test('it exists', function (assert) {
         let controller = this.owner.lookup('controller:customers/index');
diff --git a/tests/unit/controllers/networks/index/network/customers-test.js b/tests/unit/controllers/networks/index/network/customers-test.js
index bd90c9fb..b86fd691 100644
--- a/tests/unit/controllers/networks/index/network/customers-test.js
+++ b/tests/unit/controllers/networks/index/network/customers-test.js
@@ -1,8 +1,16 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import Service from '@ember/service';
 
 module('Unit | Controller | networks/index/network/customers', function (hooks) {
     setupTest(hooks);
+    setupIntl(hooks, 'en-us');
+
+    hooks.beforeEach(function () {
+        // The engine's dummy app has no console host to provide the host router.
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
 
     test('it exists', function (assert) {
         let controller = this.owner.lookup('controller:networks/index/network/customers');
diff --git a/tests/unit/controllers/networks/index/network/orders-test.js b/tests/unit/controllers/networks/index/network/orders-test.js
index 141a91cc..a6b26e5d 100644
--- a/tests/unit/controllers/networks/index/network/orders-test.js
+++ b/tests/unit/controllers/networks/index/network/orders-test.js
@@ -1,8 +1,16 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
+import Service from '@ember/service';
 
 module('Unit | Controller | networks/index/network/orders', function (hooks) {
     setupTest(hooks);
+    setupIntl(hooks, 'en-us');
+
+    hooks.beforeEach(function () {
+        // The engine's dummy app has no console host to provide the host router.
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
 
     test('it exists', function (assert) {
         let controller = this.owner.lookup('controller:networks/index/network/orders');
diff --git a/tests/unit/controllers/networks/index/network/index-test.js b/tests/unit/controllers/networks/index/network/settings-test.js
similarity index 74%
rename from tests/unit/controllers/networks/index/network/index-test.js
rename to tests/unit/controllers/networks/index/network/settings-test.js
index 873bd803..85693ec9 100644
--- a/tests/unit/controllers/networks/index/network/index-test.js
+++ b/tests/unit/controllers/networks/index/network/settings-test.js
@@ -1,12 +1,12 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
 
-module('Unit | Controller | networks/index/network/index', function (hooks) {
+module('Unit | Controller | networks/index/network/settings', function (hooks) {
     setupTest(hooks);
 
     // TODO: Replace this with your real tests.
     test('it exists', function (assert) {
-        let controller = this.owner.lookup('controller:networks/index/network/index');
+        let controller = this.owner.lookup('controller:networks/index/network/settings');
         assert.ok(controller);
     });
 });
diff --git a/tests/unit/controllers/orders/index-test.js b/tests/unit/controllers/orders/index-test.js
index 6c9ca5d4..5a2748a1 100644
--- a/tests/unit/controllers/orders/index-test.js
+++ b/tests/unit/controllers/orders/index-test.js
@@ -1,9 +1,11 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import { setupIntl } from 'ember-intl/test-support';
 import Service from '@ember/service';
 
 module('Unit | Controller | orders/index', function (hooks) {
     setupTest(hooks);
+    setupIntl(hooks, 'en-us');
 
     test('it exists', function (assert) {
         let controller = this.owner.lookup('controller:orders/index');
diff --git a/tests/unit/routes/networks/index-test.js b/tests/unit/routes/networks/index-test.js
index 158ecb69..9d05d470 100644
--- a/tests/unit/routes/networks/index-test.js
+++ b/tests/unit/routes/networks/index-test.js
@@ -1,9 +1,15 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import Service from '@ember/service';
 
 module('Unit | Route | networks/index', function (hooks) {
     setupTest(hooks);
 
+    hooks.beforeEach(function () {
+        // The engine's dummy app has no console host to provide the host router.
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
+
     test('it exists', function (assert) {
         let route = this.owner.lookup('route:networks/index');
         assert.ok(route);
diff --git a/tests/unit/routes/networks/index/network-test.js b/tests/unit/routes/networks/index/network-test.js
index 9d0e38c8..381a9d97 100644
--- a/tests/unit/routes/networks/index/network-test.js
+++ b/tests/unit/routes/networks/index/network-test.js
@@ -1,11 +1,39 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import Service from '@ember/service';
+
+class StorefrontStub extends Service {
+    calls = [];
+
+    setActiveNetwork(network) {
+        this.calls.push(['set', network?.id]);
+    }
+
+    clearActiveNetwork() {
+        this.calls.push(['clear']);
+    }
+}
 
 module('Unit | Route | networks/index/network', function (hooks) {
     setupTest(hooks);
 
+    hooks.beforeEach(function () {
+        this.owner.register('service:storefront', StorefrontStub);
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
+
     test('it exists', function (assert) {
         let route = this.owner.lookup('route:networks/index/network');
         assert.ok(route);
     });
+
+    test('entering a network sets the network context and leaving clears it', function (assert) {
+        const route = this.owner.lookup('route:networks/index/network');
+        const storefront = this.owner.lookup('service:storefront');
+
+        route.afterModel({ id: 'network_uuid' });
+        route.deactivate();
+
+        assert.deepEqual(storefront.calls, [['set', 'network_uuid'], ['clear']]);
+    });
 });
diff --git a/tests/unit/routes/networks/index/network/customers-test.js b/tests/unit/routes/networks/index/network/customers-test.js
index 96637fab..33bbf498 100644
--- a/tests/unit/routes/networks/index/network/customers-test.js
+++ b/tests/unit/routes/networks/index/network/customers-test.js
@@ -1,11 +1,26 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import Service from '@ember/service';
 
 module('Unit | Route | networks/index/network/customers', function (hooks) {
     setupTest(hooks);
 
-    test('it exists', function (assert) {
-        let route = this.owner.lookup('route:networks/index/network/customers');
-        assert.ok(route);
+    hooks.beforeEach(function () {
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
+
+    test('it lists the customers who ordered through the network, not the active store', async function (assert) {
+        const route = this.owner.lookup('route:networks/index/network/customers');
+        const store = this.owner.lookup('service:store');
+        const requests = [];
+        store.query = (modelName, params) => {
+            requests.push({ modelName, params });
+            return Promise.resolve([]);
+        };
+        route.modelFor = () => ({ id: 'network_uuid', public_id: 'network_123' });
+
+        await route.model({ page: 1 });
+
+        assert.deepEqual(requests, [{ modelName: 'customer', params: { page: 1, network: 'network_123' } }]);
     });
 });
diff --git a/tests/unit/routes/networks/index/network/orders-test.js b/tests/unit/routes/networks/index/network/orders-test.js
index d958a2b1..c4c66a97 100644
--- a/tests/unit/routes/networks/index/network/orders-test.js
+++ b/tests/unit/routes/networks/index/network/orders-test.js
@@ -2,14 +2,6 @@ import Service, { inject as service } from '@ember/service';
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
 
-class StorefrontStubService extends Service {
-    getActiveStore(key) {
-        if (key === 'public_id') {
-            return 'store_123';
-        }
-    }
-}
-
 class FetchStubService extends Service {
     @service store;
 
@@ -47,21 +39,24 @@ module('Unit | Route | networks/index/network/orders', function (hooks) {
     setupTest(hooks);
 
     hooks.beforeEach(function () {
-        this.owner.register('service:storefront', StorefrontStubService);
         this.owner.register('service:fetch', FetchStubService);
     });
 
-    test('it loads orders from the Storefront internal namespace as Ember Data models', async function (assert) {
+    test('it loads the network orders from the Storefront internal namespace as Ember Data models', async function (assert) {
         let route = this.owner.lookup('route:networks/index/network/orders');
         let fetch = this.owner.lookup('service:fetch');
 
         assert.ok(route);
+        route.modelFor = (name) => {
+            assert.strictEqual(name, 'networks.index.network', 'orders are scoped to the network being viewed');
+            return { id: 'network_uuid', public_id: 'network_123' };
+        };
 
         let orders = await route.model({ page: 2, limit: undefined, sort: '-created_at', query: undefined, status: '', customer: null });
         let request = fetch.calls[0];
 
         assert.strictEqual(request.path, 'orders');
-        assert.deepEqual(request.params, { page: 2, sort: '-created_at', storefront: 'store_123' });
+        assert.deepEqual(request.params, { page: 2, sort: '-created_at', network: 'network_123' });
         assert.deepEqual(request.options, { namespace: 'storefront/int/v1' });
         assert.strictEqual(fetch.normalized.modelType, 'orders');
         assert.strictEqual(orders[0].constructor.modelName, 'order');
diff --git a/tests/unit/routes/networks/index/network/index-test.js b/tests/unit/routes/networks/index/network/settings-test.js
similarity index 73%
rename from tests/unit/routes/networks/index/network/index-test.js
rename to tests/unit/routes/networks/index/network/settings-test.js
index bb0e77fe..f78a5b93 100644
--- a/tests/unit/routes/networks/index/network/index-test.js
+++ b/tests/unit/routes/networks/index/network/settings-test.js
@@ -1,11 +1,11 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
 
-module('Unit | Route | networks/index/network/index', function (hooks) {
+module('Unit | Route | networks/index/network/settings', function (hooks) {
     setupTest(hooks);
 
     test('it exists', function (assert) {
-        let route = this.owner.lookup('route:networks/index/network/index');
+        let route = this.owner.lookup('route:networks/index/network/settings');
         assert.ok(route);
     });
 });
diff --git a/tests/unit/routes/networks/index/network/stores-test.js b/tests/unit/routes/networks/index/network/stores-test.js
index 09ab0323..fcaf341e 100644
--- a/tests/unit/routes/networks/index/network/stores-test.js
+++ b/tests/unit/routes/networks/index/network/stores-test.js
@@ -1,9 +1,15 @@
 import { module, test } from 'qunit';
 import { setupTest } from 'dummy/tests/helpers';
+import Service from '@ember/service';
 
 module('Unit | Route | networks/index/network/stores', function (hooks) {
     setupTest(hooks);
 
+    hooks.beforeEach(function () {
+        // The engine's dummy app has no console host to provide the host router.
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
+
     test('it exists', function (assert) {
         let route = this.owner.lookup('route:networks/index/network/stores');
         assert.ok(route);
diff --git a/tests/unit/routes/networks/index/network/trucks-test.js b/tests/unit/routes/networks/index/network/trucks-test.js
new file mode 100644
index 00000000..cccb4629
--- /dev/null
+++ b/tests/unit/routes/networks/index/network/trucks-test.js
@@ -0,0 +1,30 @@
+import { module, test } from 'qunit';
+import { setupTest } from 'dummy/tests/helpers';
+import Service from '@ember/service';
+
+module('Unit | Route | networks/index/network/trucks', function (hooks) {
+    setupTest(hooks);
+
+    hooks.beforeEach(function () {
+        this.owner.register('service:hostRouter', class extends Service {});
+    });
+
+    test('it lists the trucks of the stores in the network', async function (assert) {
+        const route = this.owner.lookup('route:networks/index/network/trucks');
+        const store = this.owner.lookup('service:store');
+        const requests = [];
+        store.query = (modelName, params) => {
+            requests.push({ modelName, params });
+            return Promise.resolve([]);
+        };
+        route.modelFor = (name) => {
+            assert.strictEqual(name, 'networks.index.network');
+            return { id: 'network_uuid' };
+        };
+
+        await route.model({ query: 'taco' });
+
+        assert.deepEqual(requests, [{ modelName: 'food-truck', params: { query: 'taco', network: 'network_uuid' } }]);
+        assert.strictEqual(route.queryParams.query.as, 't_query', 'the search param does not collide with the networks list search');
+    });
+});
diff --git a/tests/unit/services/storefront-test.js b/tests/unit/services/storefront-test.js
index 869cc814..f8204762 100644
--- a/tests/unit/services/storefront-test.js
+++ b/tests/unit/services/storefront-test.js
@@ -31,10 +31,16 @@ class StoreStub {
         };
     }
 
+    networks = [{ id: 'network_uuid', name: 'Downtown Market', public_id: 'network_123' }];
+
     peekRecord(modelName, id) {
         if (modelName === 'store') {
             return this.stores.find((store) => store.id === id);
         }
+
+        if (modelName === 'network') {
+            return this.networks.find((network) => network.id === id);
+        }
     }
 }
 
@@ -96,4 +102,51 @@ module('Unit | Service | storefront', function (hooks) {
         assert.strictEqual(service.activeStoreId, undefined, 'clears tracked selection outside render');
         assert.strictEqual(service.activeStore, null, 'empty state remains safe to consume from widgets');
     });
+
+    test('it is in the store context until a network is entered', function (assert) {
+        const service = this.owner.lookup('service:storefront');
+        service.synchronizeActiveStore();
+
+        assert.strictEqual(service.activeNetwork, null, 'no network is active by default');
+        assert.false(service.isNetworkContext, 'defaults to the store context');
+        assert.strictEqual(service.activeContextType, 'store');
+        assert.strictEqual(service.activeContext.id, 'store_uuid', 'the active context is the active store');
+        assert.strictEqual(service.getActiveNetwork('name'), null, 'network lookups are empty outside a network');
+    });
+
+    test('entering a network scopes the console to it without touching the active store', function (assert) {
+        const service = this.owner.lookup('service:storefront');
+        const currentUser = this.owner.lookup('service:current-user');
+        const events = [];
+        service.synchronizeActiveStore();
+        service.on('storefront.context.changed', (type, context) => events.push([type, context?.id]));
+
+        service.setActiveNetwork({ id: 'network_uuid' });
+
+        assert.true(service.isNetworkContext, 'the network context is active');
+        assert.strictEqual(service.activeContextType, 'network');
+        assert.strictEqual(service.activeNetwork.name, 'Downtown Market', 'resolves the network from the store');
+        assert.strictEqual(service.activeContext.id, 'network_uuid', 'the active context is the network');
+        assert.strictEqual(service.getActiveNetwork('public_id'), 'network_123', 'reads properties of the active network');
+        assert.strictEqual(service.activeStore.id, 'store_uuid', 'the active store is kept for when the user leaves the network');
+        assert.strictEqual(currentUser.getOption('activeStorefront'), 'store_uuid', 'the network context is not persisted as the storefront');
+
+        service.setActiveNetwork({ id: 'network_uuid' });
+        assert.deepEqual(events, [['network', 'network_uuid']], 'setting the same network again does not re-announce the context');
+
+        service.clearActiveNetwork();
+        assert.false(service.isNetworkContext, 'leaving the network returns to the store context');
+        assert.deepEqual(events, [
+            ['network', 'network_uuid'],
+            ['store', 'store_uuid'],
+        ]);
+    });
+
+    test('a network that is not loaded leaves the console in the store context', function (assert) {
+        const service = this.owner.lookup('service:storefront');
+        service.setActiveNetwork({ id: 'missing_network_uuid' });
+
+        assert.strictEqual(service.activeNetwork, null, 'an unknown network does not resolve');
+        assert.false(service.isNetworkContext, 'the store context stays in charge');
+    });
 });
diff --git a/translations/en-us.yaml b/translations/en-us.yaml
index 6ed1d6bd..65322fe6 100644
--- a/translations/en-us.yaml
+++ b/translations/en-us.yaml
@@ -1,6 +1,9 @@
 storefront:
   extension-name: Storefront
   common:
+    off: Off
+    on: On
+    all: All
     address: Address
     alerts: Alerts
     amount: Amount
@@ -37,6 +40,8 @@ storefront:
     name: Name
     neighborhood: Neighborhood
     online: Online
+    offline: Offline
+    last-modified: Last modified
     orders: Orders
     phone: Phone
     photos: Photos
@@ -70,7 +75,7 @@ storefront:
     facebook: Facebook
     instagram: Instagram
     twitter: Twitter
-    food-trucks: Food Trucks
+    food-trucks: Trucks
     catalog: Catalog
     catalogs: Catalogs
   sidebar:
@@ -78,7 +83,7 @@ storefront:
     dashboard: Dashboard
     products: Products
     catalogs: Catalogs
-    food-trucks: Food Trucks
+    food-trucks: Trucks
     customers: Customers
     orders: Orders
     networks: Networks
@@ -296,6 +301,14 @@ storefront:
     store-selector:
       no-stores: No stores to select
       create-storefront: Create a new
+      store: Store
+      network: Network
+      stores: Stores
+      networks: Networks
+      no-networks: No networks yet
+      new-store: New store
+      new-network: New network
+      badge-title: "{count, plural, one {# network invitation} other {# network invitations}}"
   home:
     title: Storefront Dashboard
   customers:
@@ -314,8 +327,144 @@ storefront:
       edit-button: Edit customer
       cancel-edit-button: Cancel edit customer
       cancel-new-button: Cancel new customer
+  catalogs:
+    index:
+      empty-state: Create a catalog to group products into a menu with its own categories and hours.
+      create-catalog: Create catalog
+    card:
+      no-description: No description
+      no-categories: No categories yet
+      products-count: "{count, plural, =0 {No products} one {# product} other {# products}}"
+  trucks:
+    index:
+      empty-state: Add a truck to sell from a vehicle inside a service area.
+      create-truck: Add truck
+    card:
+      no-vehicle: No vehicle assigned
+      no-service-area: No service area
+      inactive: Inactive
+      offline: Offline
+      no-catalog: Online, no catalog
+      online: Online
+      assign-catalogs: Assign catalogs
+      catalogs-count: "{count, plural, =0 {No catalogs} one {# catalog} other {# catalogs}}"
+      owned-by: "Owned by {name}"
   networks:
+    card:
+      stores-count: "{count, plural, =0 {No stores} one {# store} other {# stores}}"
+    overview:
+      online-count: "{count, plural, =0 {none online} one {# online} other {# online}}"
+      invitations-hint: "pending, {declined} declined"
+      orders-7d: Orders · 7 days
+      multi-store-count: "{count, plural, =0 {no multi-store} one {# multi-store} other {# multi-store}}"
+      revenue-7d: Revenue · 7 days
+      tips-hint: "tips {tips}, split across stores"
+      new-customers: "{count, plural, =0 {none new this month} one {# new this month} other {# new this month}}"
+      members-title: "{count, plural, =0 {Stores} one {Stores · # member} other {Stores · # members}}"
+      orders-count-7d: "{count, plural, =0 {no orders · 7d} one {# order · 7d} other {# orders · 7d}}"
+      share-of-network: "{share}% of network"
+      no-members: No stores sell through this network yet.
+      recent-orders: Recent network orders
+      all-orders: All orders
+      no-orders: No orders through this network in the last seven days.
+    orders:
+      subtitle: Everything placed through the marketplace app, grouped by checkout
+      group-by-checkout: Group by checkout
+      flat: Flat
+      tabs:
+        all: All
+        needs-action: Needs action
+        preparing: Preparing
+        ready: Ready for pickup
+        dispatched: Out for delivery
+        completed: Completed
+        canceled: Canceled
+        custom: Filtered
+      columns:
+        reference: Checkout / order
+        fulfillment: Fulfillment
+        total: Total
+        placed: Placed
+      group-summary: "{orders, plural, one {# order} other {# orders}} · {items, plural, one {# item} other {# items}}"
+      part-of: "part of {checkout}"
+      items-count: "{count, plural, one {# item} other {# items}}"
+      no-customer: No customer
+      no-store: No store
+      delivery: Delivery
+      tip-split: "tip {tip} split {count} ways"
+      tip-shared: "+ tip {tip} shared"
+      tip-to-store: "tip {tip} to store"
+      driver-shared: "shared across {count} orders"
+      no-driver-needed: No driver needed
+      drivers-count: "{count} drivers"
+      assign-driver: Assign driver
+      unassigned: Unassigned
+      group-status: "{count} of {total} {status}"
+      expand-hint: Expand for each store's order
+      group-note: Group status is the least-advanced child; a group leaves "Needs action" when every child has a driver or is ready for pickup.
+    invitations:
+      title: Invitations
+      invite-stores: Invite stores
+      invited: Invited
+      none: No open invitations.
+      sent-ago: "Sent {ago}"
+      resend: Resend
+      revoke: Revoke
+      invite-again: Invite again
+      resent: "Invitation re-sent to {email}."
+      revoke-title: "Revoke the invitation to {email}?"
+      revoke-body: The link in the email stops working immediately. You can invite this address again later.
+      shareable-link: Shareable link
+      manage-link: Manage link
+      link: Link
+      link-hint: Anyone with the link can request to join. Turning the link off invalidates it immediately.
+      status:
+        pending: Pending
+        declined: Declined
+        expired: Expired
+        accepted: Accepted
+        revoked: Revoked
+      stores-subtitle: "{members, plural, =0 {No members} one {# member} other {# members}} · {pending, plural, =0 {no invitations pending} one {# invitation pending} other {# invitations pending}}"
+      add-existing-store: Add existing store
+      edit-category: Edit category
+      delete-category: Delete category
+      selected-count: "{count, plural, one {# selected} other {# selected}}"
+      clear: Clear
+      rows-note: Invited rows are invitations, not members; they leave the list when accepted or revoked.
+      assign-category-count: "Assign a category to {count, plural, one {# store} other {# stores}}"
+      pick-a-category: Pick a category first.
+      remove-count-title: "Remove {count, plural, one {# store} other {# stores}} from {networkName}?"
+      remove-body: The store keeps its own catalog and orders. Open network orders that include this store stay open; new multi-store carts will no longer offer its products.
+      panel-title: "Invite stores to {network}"
+      panel-lede: A store that accepts joins with its own catalog, prices and hours. You choose its category.
+      tab-email: By email
+      tab-link: Shareable link
+      tab-own: Add a store you manage
+      email-addresses: Email addresses
+      email-help: Paste a list; one invitation per address. Members and pending invitees are flagged before sending.
+      already-flagged: "{count, plural, one {# address is already a member or already invited and will be skipped.} other {# addresses are already members or already invited and will be skipped.}}"
+      invalid-flagged: "{count, plural, one {# address is not a valid email.} other {# addresses are not valid emails.}}"
+      category-on-joining: Category on joining
+      let-store-choose: Let the store choose
+      expires: Invitation expires
+      expires-14: In 14 days
+      expires-7: In 7 days
+      expires-30: In 30 days
+      expires-never: Never
+      message: Message (optional)
+      message-placeholder: "Hi, we would like your store on {network}. Accept to list your catalog in the app."
+      require-approval: Require my approval after the store accepts
+      require-approval-help: You review the store before it appears in the app.
+      send-count: "{count, plural, =0 {Send invitations} one {Send # invitation} other {Send # invitations}}"
+      sent: "{count, plural, one {# invitation sent.} other {# invitations sent.}}"
+      own-stores: Stores in your organisation
+      own-stores-help: Stores you administer join immediately; no invitation is sent.
+      pick-stores: Pick stores
+      add-to-network: Add to network
+      own-stores-added: "{count, plural, one {# store added to the network.} other {# stores added to the network.}}"
     index:
+      empty-state: Create a network to sell from several stores through one app.
+      create-network: Create network
       network-option: Network Options
       manage-network: Manage Network
       send-invite: Send Invites
@@ -325,9 +474,13 @@ storefront:
       delete-this-network-all-assigned-stores-customer-order: Are you sure you wish to delete this network ({networkName})? All assigned stores, customers, orders will no longer be reachable.
       network:
         manage-network: Manage Network
+        all-networks: All networks
+        overview: Overview
         settings: Settings
         customers: Customers
         orders: Orders
+        trucks:
+          empty-state: No trucks yet. Trucks are created from a store and appear here for every store in the network.
         Network-changes-not-save: Network changes not saved!
         going-back-will-rollback-all-unsaved-changes: Going back will rollback all unsaved changes, are you sure you wish to continue?
         index: