chore: update gallery store

Author: iobuhov

packages/pluggableWidgets/gallery-web/src/components/HeaderWidgetsHost.tsx

@@ -1,8 +1,8 @@
-import { createElement } from "react";
-import { getGlobalSortContext } from "@mendix/widget-plugin-sorting/context";
+import { getGlobalFilterContextObject } from "@mendix/widget-plugin-filtering/context";
 import { getGlobalSelectionContext, useCreateSelectionContextValue } from "@mendix/widget-plugin-grid/selection";
+import { getGlobalSortContext } from "@mendix/widget-plugin-sorting/react/context";
+import { createElement } from "react";
 import { useGalleryRootScope } from "../helpers/root-context";
-import { getGlobalFilterContextObject } from "@mendix/widget-plugin-filtering/context";
 
 const SelectionContext = getGlobalSelectionContext();
 const SortAPI = getGlobalSortContext();

packages/pluggableWidgets/gallery-web/src/controllers/QueryParamsController.ts

@@ -3,21 +3,21 @@ import { CustomFilterHost } from "@mendix/widget-plugin-filtering/stores/generic
 import { DatasourceController } from "@mendix/widget-plugin-grid/query/DatasourceController";
 import { disposeBatch } from "@mendix/widget-plugin-mobx-kit/disposeBatch";
 import { ReactiveController, ReactiveControllerHost } from "@mendix/widget-plugin-mobx-kit/reactive-controller";
-import { ObservableSortStoreHost } from "@mendix/widget-plugin-sorting/ObservableSortStoreHost";
+import { SortStoreHost } from "@mendix/widget-plugin-sorting/stores/SortStoreHost";
 import { ListValue } from "mendix";
 import { FilterCondition } from "mendix/filters";
 import { makeAutoObservable, reaction } from "mobx";
 
 export class QueryParamsController implements ReactiveController {
     private readonly _query: DatasourceController;
     private readonly _filters: CustomFilterHost;
-    private readonly _sort: ObservableSortStoreHost;
+    private readonly _sort: SortStoreHost;
 
     constructor(
         host: ReactiveControllerHost,
         query: DatasourceController,
         filters: CustomFilterHost,
-        sort: ObservableSortStoreHost
+        sort: SortStoreHost
     ) {
         host.addController(this);
 

packages/pluggableWidgets/gallery-web/src/stores/GalleryStore.ts

@@ -6,8 +6,8 @@ import { RefreshController } from "@mendix/widget-plugin-grid/query/RefreshContr
 import { BaseControllerHost } from "@mendix/widget-plugin-mobx-kit/BaseControllerHost";
 import { DerivedPropsGate } from "@mendix/widget-plugin-mobx-kit/props-gate";
 import { generateUUID } from "@mendix/widget-plugin-platform/framework/generate-uuid";
-import { SortAPI } from "@mendix/widget-plugin-sorting/context";
-import { SortStoreHost } from "@mendix/widget-plugin-sorting/controllers/SortStoreHost";
+import { SortAPI } from "@mendix/widget-plugin-sorting/react/context";
+import { SortStoreHost } from "@mendix/widget-plugin-sorting/stores/SortStoreHost";
 import { ListValue } from "mendix";
 import { PaginationEnum } from "../../typings/GalleryProps";
 import { QueryParamsController } from "../controllers/QueryParamsController";
@@ -55,7 +55,6 @@ export class GalleryStore extends BaseControllerHost {
         });
 
         const filterObserver = new CustomFilterHost();
-
         const sortObserver = new SortStoreHost();
 
         const paramCtrl = new QueryParamsController(this, this._query, filterObserver, sortObserver);
@@ -68,7 +67,8 @@ export class GalleryStore extends BaseControllerHost {
 
         this.sortAPI = {
             version: 1,
-            sortObserver
+            host: sortObserver,
+            initSortOrder: spec.gate.props.datasource.sortOrder
         };
 
         new RefreshController(this, {

packages/shared/widget-plugin-sorting/src/controllers/SingleSortController.ts

@@ -46,6 +46,9 @@ export class SingleSortController {
 
     toggleDirection = (): void => {
         this.direction = this.direction === "asc" ? "desc" : "asc";
+        if (this.selected) {
+            this._sortOrderStore.replace([this.selected, this.direction]);
+        }
     };
 
     select = (value: string): void => {