Merge branch 'main' into merx-1259-new-home-page-layout

saleor · Nov 19, 2024 · 9d7d480 · 9d7d480
2 parents d608749 + 163d0a2
commit 9d7d480
Show file tree

Hide file tree

Showing 35 changed files with 209 additions and 159 deletions.
diff --git a/.changeset/chilly-hotels-melt.md b/.changeset/chilly-hotels-melt.md
diff --git a/.changeset/cuddly-spiders-wave.md b/.changeset/cuddly-spiders-wave.md
diff --git a/.changeset/grumpy-worms-love.md b/.changeset/grumpy-worms-love.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+List item links are no longer rendered outside of cursor. This means you can now copy the item's URL with mouse right click or use middle click to open page in new tab.
diff --git a/.changeset/nasty-grapes-attend.md b/.changeset/nasty-grapes-attend.md
diff --git a/.changeset/rare-mirrors-sell.md b/.changeset/rare-mirrors-sell.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+The "Save" button in Change Password form now submits the form data to Saleor.
diff --git a/.changeset/soft-bears-repair.md b/.changeset/soft-bears-repair.md
@@ -0,0 +1,5 @@
+---
+"saleor-dashboard": patch
+---
+
+You can now select attribute value from dropdown in datagrid cell 
diff --git a/.changeset/wicked-meals-change.md b/.changeset/wicked-meals-change.md
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -38,7 +38,7 @@
     "@material-ui/styles": "^4.11.4",
     "@reach/auto-id": "^0.16.0",
     "@saleor/macaw-ui": "npm:@saleor/[email protected]",
-    "@saleor/macaw-ui-next": "npm:@saleor/[email protected].12",
+    "@saleor/macaw-ui-next": "npm:@saleor/[email protected].15",
     "@saleor/sdk": "0.6.0",
     "@sentry/react": "^8.21.0",
     "@sentry/vite-plugin": "^2.21.1",

diff --git a/src/attributes/components/AttributeListDatagrid/AttributeListDatagrid.tsx b/src/attributes/components/AttributeListDatagrid/AttributeListDatagrid.tsx
@@ -8,6 +8,7 @@ import {
 } from "@dashboard/components/Datagrid/hooks/useDatagridChange";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import { AttributeFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { ListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
@@ -69,9 +70,7 @@ export const AttributeListDatagrid = ({
 
       if (rowData) {
         navigate(attributeUrl(rowData.id), {
-          state: {
-            prevLocation: location,
-          },
+          state: getPrevLocationState(location),
         });
       }
     },
@@ -120,6 +119,7 @@ export const AttributeListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/categories/components/CategoryListDatagrid/CategoryListDatagrid.tsx b/src/categories/components/CategoryListDatagrid/CategoryListDatagrid.tsx
@@ -8,6 +8,7 @@ import {
 } from "@dashboard/components/Datagrid/hooks/useDatagridChange";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import { CategoryFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { PageListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
 import { Box } from "@saleor/macaw-ui-next";
@@ -105,11 +106,7 @@ export const CategoryListDatagrid = ({
             staticColumns={staticColumns}
           />
         )}
-        navigatorOpts={{
-          state: {
-            prevLocation: location,
-          },
-        }}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/collections/components/CollectionListDatagrid/CollectionListDatagrid.tsx b/src/collections/components/CollectionListDatagrid/CollectionListDatagrid.tsx
@@ -10,6 +10,7 @@ import {
 } from "@dashboard/components/Datagrid/hooks/useDatagridChange";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import { commonTooltipMessages } from "@dashboard/components/TooltipTableCellHeader/messages";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { ListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
 import { Box, useTheme } from "@saleor/macaw-ui-next";
@@ -157,6 +158,7 @@ export const CollectionListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/collections/components/CollectionListPage/CollectionListPage.tsx b/src/collections/components/CollectionListPage/CollectionListPage.tsx
@@ -12,6 +12,7 @@ import { DashboardCard } from "@dashboard/components/Card";
 import { getByName } from "@dashboard/components/Filter/utils";
 import { FilterPresetsSelect } from "@dashboard/components/FilterPresetsSelect";
 import { ListPageLayout } from "@dashboard/components/Layouts";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { sectionNames } from "@dashboard/intl";
 import { FilterPageProps, PageListProps, SortPage } from "@dashboard/types";
@@ -143,9 +144,7 @@ const CollectionListPage: React.FC<CollectionListPageProps> = ({
           filterDependency={filterDependency}
           onRowClick={id => {
             navigate(collectionUrl(id), {
-              state: {
-                prevLocation: location,
-              },
+              state: getPrevLocationState(location),
             });
           }}
           hasRowHover={!isFilterPresetOpen}

diff --git a/src/components/Card/Root.tsx b/src/components/Card/Root.tsx
@@ -5,14 +5,7 @@ export const Root: React.FC<PropsWithBox<{ children: React.ReactNode }>> = ({
   children,
   ...rest
 }) => (
-  <Box
-    display="flex"
-    flexDirection="column"
-    gap={5}
-    position="relative"
-    backgroundColor="default1"
-    {...rest}
-  >
+  <Box display="flex" flexDirection="column" gap={5} backgroundColor="default1" {...rest}>
     {children}
   </Box>
 );
diff --git a/src/customers/components/CustomerListDatagrid/CustomerListDatagrid.tsx b/src/customers/components/CustomerListDatagrid/CustomerListDatagrid.tsx
@@ -10,6 +10,7 @@ import { TablePaginationWithContext } from "@dashboard/components/TablePaginatio
 import { Customer, Customers } from "@dashboard/customers/types";
 import { CustomerListUrlSortField } from "@dashboard/customers/urls";
 import { PermissionEnum } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { ListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
 import { Box } from "@saleor/macaw-ui-next";
@@ -137,11 +138,7 @@ export const CustomerListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
-        navigatorOpts={{
-          state: {
-            prevLocation: location,
-          },
-        }}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/discounts/components/DiscountListDatagrid/DiscountListDatagrid.tsx b/src/discounts/components/DiscountListDatagrid/DiscountListDatagrid.tsx
@@ -9,6 +9,7 @@ import { useEmptyColumn } from "@dashboard/components/Datagrid/hooks/useEmptyCol
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import { DiscountListUrlSortField, discountUrl } from "@dashboard/discounts/discountsUrls";
 import { PromotionFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { ListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
 import { Box } from "@saleor/macaw-ui-next";
@@ -121,6 +122,7 @@ export const DiscountListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/discounts/components/DiscountListPage/DiscountListPage.tsx b/src/discounts/components/DiscountListPage/DiscountListPage.tsx
@@ -11,6 +11,7 @@ import {
   discountUrl,
 } from "@dashboard/discounts/discountsUrls";
 import { PromotionFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { commonMessages } from "@dashboard/intl";
 import { FilterPresetsProps, PageListProps, SortPage } from "@dashboard/types";
@@ -50,9 +51,7 @@ const DiscountListPage: React.FC<DiscountListPageProps> = ({
   const [isFilterPresetOpen, setFilterPresetOpen] = useState(false);
   const handleRowClick = (id: string) => {
     navigation(discountUrl(id), {
-      state: {
-        prevLocation: location,
-      },
+      state: getPrevLocationState(location),
     });
   };
 

diff --git a/src/discounts/components/SaleListDatagrid/SaleListDatagrid.tsx b/src/discounts/components/SaleListDatagrid/SaleListDatagrid.tsx
@@ -9,6 +9,7 @@ import { TablePaginationWithContext } from "@dashboard/components/TablePaginatio
 import { commonTooltipMessages } from "@dashboard/components/TooltipTableCellHeader/messages";
 import { SaleListUrlSortField, saleUrl } from "@dashboard/discounts/urls";
 import { SaleFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useLocale from "@dashboard/hooks/useLocale";
 import { ChannelProps, ListProps, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
@@ -141,6 +142,7 @@ export const SaleListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/discounts/components/SaleListPage/SaleListPage.tsx b/src/discounts/components/SaleListPage/SaleListPage.tsx
@@ -7,6 +7,7 @@ import { FilterPresetsSelect } from "@dashboard/components/FilterPresetsSelect";
 import { ListPageLayout } from "@dashboard/components/Layouts";
 import { saleAddUrl, SaleListUrlSortField, saleUrl } from "@dashboard/discounts/urls";
 import { SaleFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { commonMessages } from "@dashboard/intl";
 import {
@@ -60,9 +61,7 @@ const SaleListPage: React.FC<SaleListPageProps> = ({
   const filterDependency = structure.find(getByName("channel"));
   const handleRowClick = (id: string) => {
     navigation(saleUrl(id), {
-      state: {
-        prevLocation: location,
-      },
+      state: getPrevLocationState(location),
     });
   };
 

diff --git a/src/discounts/components/VoucherListDatagrid/VoucherListDatagrid.tsx b/src/discounts/components/VoucherListDatagrid/VoucherListDatagrid.tsx
@@ -10,6 +10,7 @@ import { commonTooltipMessages } from "@dashboard/components/TooltipTableCellHea
 import { VoucherListUrlSortField, voucherUrl } from "@dashboard/discounts/urls";
 import { canBeSorted } from "@dashboard/discounts/views/VoucherList/sort";
 import { VoucherFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useLocale from "@dashboard/hooks/useLocale";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import { ChannelProps, ListProps, SortPage } from "@dashboard/types";
@@ -80,9 +81,7 @@ export const VoucherListDatagrid = ({
 
       if (rowData) {
         navigate(voucherUrl(rowData.id), {
-          state: {
-            prevLocation: location,
-          },
+          state: getPrevLocationState(location),
         });
       }
     },

diff --git a/src/giftCards/GiftCardsList/GiftCardsListDatagrid/GiftCardsListDatagrid.tsx b/src/giftCards/GiftCardsList/GiftCardsListDatagrid/GiftCardsListDatagrid.tsx
@@ -8,6 +8,7 @@ import {
 import TablePagination from "@dashboard/components/TablePagination";
 import { commonTooltipMessages } from "@dashboard/components/TooltipTableCellHeader/messages";
 import { giftCardListUrl, giftCardUrl } from "@dashboard/giftCards/urls";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useNavigator from "@dashboard/hooks/useNavigator";
 import usePaginator from "@dashboard/hooks/usePaginator";
 import { Item } from "@glideapps/glide-data-grid";
@@ -171,11 +172,7 @@ export const GiftCardsListDatagrid = () => {
             onToggle={handlers.onToggle}
           />
         )}
-        navigatorOpts={{
-          state: {
-            prevLocation: location,
-          },
-        }}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/hooks/useBackLinkWithState.ts b/src/hooks/useBackLinkWithState.ts
@@ -2,12 +2,21 @@ import { useEffect, useState } from "react";
 import { useLocation } from "react-router";
 import urljoin from "url-join";
 
+type LocationData = Pick<Location, "pathname" | "search">;
+
 type LocationWithState = Location & {
   state?: {
-    prevLocation?: Location;
+    prevLocation?: LocationData;
   };
 };
 
+export const getPrevLocationState = (location: LocationData) => ({
+  prevLocation: {
+    pathname: location.pathname,
+    search: location.search,
+  },
+});
+
 const getPreviousUrl = (location: LocationWithState) => {
   if (!location.state?.prevLocation) {
     return null;

diff --git a/src/orders/components/OrderDraftListDatagrid/OrderDraftListDatagrid.tsx b/src/orders/components/OrderDraftListDatagrid/OrderDraftListDatagrid.tsx
@@ -6,6 +6,7 @@ import {
   useDatagridChangeState,
 } from "@dashboard/components/Datagrid/hooks/useDatagridChange";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import useLocale from "@dashboard/hooks/useLocale";
 import { OrderDraft } from "@dashboard/orders/types";
 import { OrderDraftListUrlSortField, orderUrl } from "@dashboard/orders/urls";
@@ -125,11 +126,7 @@ export const OrderDraftListDatagrid = ({
             onToggle={handlers.onToggle}
           />
         )}
-        navigatorOpts={{
-          state: {
-            prevLocation: location,
-          },
-        }}
+        navigatorOpts={{ state: getPrevLocationState(location) }}
       />
 
       <Box paddingX={6}>

diff --git a/src/orders/components/OrderListDatagrid/OrderListDatagrid.tsx b/src/orders/components/OrderListDatagrid/OrderListDatagrid.tsx
@@ -9,6 +9,7 @@ import {
 import { useEmptyColumn } from "@dashboard/components/Datagrid/hooks/useEmptyColumn";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import { OrderListQuery } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { OrderListUrlSortField } from "@dashboard/orders/urls";
 import { ListProps, RelayToFlat, SortPage } from "@dashboard/types";
 import { Item } from "@glideapps/glide-data-grid";
@@ -129,11 +130,7 @@ export const OrderListDatagrid: React.FC<OrderListDatagridProps> = ({
           )}
           onRowClick={handleRowClick}
           rowAnchor={handleRowAnchor}
-          navigatorOpts={{
-            state: {
-              prevLocation: location,
-            },
-          }}
+          navigatorOpts={{ state: getPrevLocationState(location) }}
         />
 
         <Box paddingX={6}>

diff --git a/src/pageTypes/components/PageTypeList/PageTypeList.tsx b/src/pageTypes/components/PageTypeList/PageTypeList.tsx
@@ -6,6 +6,7 @@ import TableHead from "@dashboard/components/TableHead";
 import { TablePaginationWithContext } from "@dashboard/components/TablePagination";
 import TableRowLink from "@dashboard/components/TableRowLink";
 import { PageTypeFragment } from "@dashboard/graphql";
+import { getPrevLocationState } from "@dashboard/hooks/useBackLinkWithState";
 import { PageTypeListUrlSortField, pageTypeUrl } from "@dashboard/pageTypes/urls";
 import { getArrowDirection } from "@dashboard/utils/sort";
 import { TableBody, TableCell, TableFooter } from "@material-ui/core";
@@ -86,7 +87,7 @@ const PageTypeList: React.FC<PageTypeListProps> = props => {
                   pageType
                     ? {
                         pathname: pageTypeUrl(pageType.id),
-                        state: { prevLocation: location },
+                        state: getPrevLocationState(location),
                       }
                     : undefined
                 }