asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

fix(dashboard): rq cache and pending flag (#9063)

Browse Source 
**What**
- fix issues from stale data on modal pages

---

FIXES CC-137
This commit is contained in:
Frane Polić
2024-09-09 21:06:10 +02:00
committed by GitHub
parent 6e46baa2cb
commit 0714315792
11 changed files with 65 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/admin/dashboard/src/hooks/api/fulfillment-sets.tsx
View File

@@ -42,7 +42,6 @@ export const useDeleteFulfillmentSet = (
// We need to invalidate all related entities. We invalidate using `all` keys to ensure that all relevant entities are invalidated.
await queryClient.invalidateQueries({
queryKey: stockLocationsQueryKeys.all,
refetchType: "all",
})
await queryClient.invalidateQueries({
queryKey: shippingOptionsQueryKeys.all,

6
packages/admin/dashboard/src/hooks/api/returns.tsx
View File

@@ -97,7 +97,7 @@ export const useCancelReturn = (
queryClient.invalidateQueries({
queryKey: ordersQueryKeys.preview(orderId),
refetchType: "all",
refetchType: "all", // We want preview to be updated in the cache immediately
})
queryClient.invalidateQueries({
@@ -163,7 +163,7 @@ export const useCancelReturnRequest = (
queryClient.invalidateQueries({
queryKey: ordersQueryKeys.preview(orderId),
refetchType: "all",
refetchType: "all", // We want preview to be updated in the cache immediately
})
queryClient.invalidateQueries({
@@ -625,7 +625,7 @@ export const useCancelReceiveReturn = (
queryClient.invalidateQueries({
queryKey: ordersQueryKeys.preview(orderId),
refetchType: "all", // For some reason RQ will refetch this but will return stale record from the cache
refetchType: "all", // We want preview to be updated in the cache immediately
})
queryClient.invalidateQueries({

1
packages/admin/dashboard/src/hooks/api/stock-locations.tsx
View File

@@ -168,7 +168,6 @@ export const useCreateStockLocationFulfillmentSet = (
onSuccess: async (data, variables, context) => {
await queryClient.invalidateQueries({
queryKey: stockLocationsQueryKeys.all,
refetchType: "all",
})
options?.onSuccess?.(data, variables, context)

16
packages/admin/dashboard/src/routes/locations/location-service-zone-create/location-service-zone-create.tsx
View File

@@ -8,25 +8,21 @@ import { FulfillmentSetType } from "../common/constants"
export function LocationCreateServiceZone() {
const { fset_id, location_id } = useParams()
const { stock_location, isLoading, isError, error } = useStockLocation(
location_id!,
{
const { stock_location, isPending, isFetching, isError, error } =
useStockLocation(location_id!, {
fields: "*fulfillment_sets",
}
)
})
const fulfillmentSet = stock_location?.fulfillment_sets?.find(
(f) => f.id === fset_id
)
const ready = !isLoading && !!stock_location && !!fulfillmentSet
const type: FulfillmentSetType =
fulfillmentSet?.type === FulfillmentSetType.Pickup
? FulfillmentSetType.Pickup
: FulfillmentSetType.Shipping
if (!isLoading && !fulfillmentSet) {
if (!isPending && !isFetching && !fulfillmentSet) {
throw json(
{ message: `Fulfillment set with ID: ${fset_id} was not found.` },
404
@@ -39,11 +35,11 @@ export function LocationCreateServiceZone() {
return (
<RouteFocusModal prev={`/settings/locations/${location_id}`}>
{ready && (
{fulfillmentSet && (
<CreateServiceZoneForm
fulfillmentSet={fulfillmentSet}
location={stock_location!}
type={type}
location={stock_location}
/>
)}
</RouteFocusModal>

20
packages/admin/dashboard/src/routes/locations/location-service-zone-edit/location-service-zone-edit.tsx
View File

@@ -10,34 +10,32 @@ export const LocationServiceZoneEdit = () => {
const { t } = useTranslation()
const { location_id, fset_id, zone_id } = useParams()
const { stock_location, isPending, isError, error } = useStockLocation(
location_id!,
{
const { stock_location, isPending, isFetching, isError, error } =
useStockLocation(location_id!, {
fields: "*fulfillment_sets.service_zones",
}
)
})
const serviceZone = stock_location?.fulfillment_sets
?.find((f) => f.id === fset_id)
?.service_zones.find((z) => z.id === zone_id)
if (isError) {
throw error
}
if (!isPending && !serviceZone) {
if (!isPending && !isFetching && !serviceZone) {
throw json(
{ message: `Service zone with ID ${zone_id} was not found` },
404
)
}
if (isError) {
throw error
}
return (
<RouteDrawer prev={`/settings/locations/${location_id}`}>
<RouteDrawer.Header>
<Heading>{t("stockLocations.serviceZones.edit.header")}</Heading>
</RouteDrawer.Header>
{!isPending && serviceZone && (
{serviceZone && (
<EditServiceZoneForm
zone={serviceZone}
fulfillmentSetId={fset_id!}

20
packages/admin/dashboard/src/routes/locations/location-service-zone-manage-areas/location-service-zone-manage-areas.tsx
View File

@@ -7,31 +7,29 @@ import { EditServiceZoneAreasForm } from "./components/edit-region-areas-form"
export const LocationServiceZoneManageAreas = () => {
const { location_id, fset_id, zone_id } = useParams()
const { stock_location, isPending, isError, error } = useStockLocation(
location_id!,
{
const { stock_location, isPending, isFetching, isError, error } =
useStockLocation(location_id!, {
fields: "*fulfillment_sets.service_zones.geo_zones",
}
)
})
const zone = stock_location?.fulfillment_sets
?.find((f) => f.id === fset_id)
?.service_zones.find((z) => z.id === zone_id)
if (isError) {
throw error
}
if (!isPending && !zone) {
if (!isPending && !isFetching && !zone) {
throw json(
{ message: `Service zone with ID ${zone_id} was not found` },
404
)
}
if (isError) {
throw error
}
return (
<RouteFocusModal prev={`/settings/locations/${location_id}`}>
{!isPending && zone && (
{zone && (
<EditServiceZoneAreasForm
zone={zone}
fulfillmentSetId={fset_id!}

14
packages/admin/dashboard/src/routes/locations/location-service-zone-shipping-option-create/location-service-zone-shipping-option-create.tsx
View File

@@ -10,18 +10,16 @@ export function LocationServiceZoneShippingOptionCreate() {
const [searchParams] = useSearchParams()
const isReturn = searchParams.has("is_return")
const { stock_location, isPending, isError, error } = useStockLocation(
location_id!,
{
const { stock_location, isPending, isFetching, isError, error } =
useStockLocation(location_id!, {
fields: LOC_CREATE_SHIPPING_OPTION_FIELDS,
}
)
})
const zone = stock_location?.fulfillment_sets
?.find((f) => f.id === fset_id)
?.service_zones?.find((z) => z.id === zone_id)
if (!isPending && !zone) {
if (!isPending && !isFetching && !zone) {
throw json(
{ message: `Service zone with ID ${zone_id} was not found` },
404
@@ -32,11 +30,9 @@ export function LocationServiceZoneShippingOptionCreate() {
throw error
}
const ready = !isPending && !!zone
return (
<RouteFocusModal prev={`/settings/locations/${location_id}`}>
{ready && (
{zone && (
<CreateShippingOptionsForm
zone={zone}
isReturn={isReturn}

19
packages/admin/dashboard/src/routes/locations/location-service-zone-shipping-option-edit/location-service-zone-shipping-option-edit.tsx
View File

@@ -11,29 +11,30 @@ export const LocationServiceZoneShippingOptionEdit = () => {
const { location_id, so_id } = useParams()
const { shipping_options, isPending, isError, error } = useShippingOptions({
id: so_id,
})
const { shipping_options, isPending, isFetching, isError, error } =
useShippingOptions({
id: so_id,
})
const shippingOption = shipping_options?.find((so) => so.id === so_id)
if (isError) {
throw error
}
if (!isPending && !shippingOption) {
if (!isPending && !isFetching && !shippingOption) {
throw json(
{ message: `Shipping option with ID ${so_id} was not found` },
404
)
}
if (isError) {
throw error
}
return (
<RouteDrawer>
<RouteDrawer.Header>
<Heading>{t("stockLocations.shippingOptions.edit.header")}</Heading>
</RouteDrawer.Header>
{!isPending && shippingOption && (
{shippingOption && (
<EditShippingOptionForm
shippingOption={shippingOption}
locationId={location_id!}

17
packages/admin/dashboard/src/routes/locations/location-service-zone-shipping-option-pricing/location-service-zone-shipping-option-pricing.tsx
View File

@@ -7,18 +7,23 @@ import { EditShippingOptionsPricingForm } from "./components/create-shipping-opt
export function LocationServiceZoneShippingOptionPricing() {
const { so_id, location_id } = useParams()
const { shipping_options, isPending } = useShippingOptions({
// TODO: change this when GET option by id endpoint is implemented
id: [so_id!],
fields: "*prices,*prices.price_rules",
})
const { shipping_options, isPending, isFetching, isError, error } =
useShippingOptions({
// TODO: change this when GET option by id endpoint is implemented
id: [so_id!],
fields: "*prices,*prices.price_rules",
})
const shippingOption = shipping_options?.find((so) => so.id === so_id)
if (!isPending && !shippingOption) {
if (!isPending && !isFetching && !shippingOption) {
throw json(`Shipping option with id: ${so_id} not found`, { status: 404 })
}
if (isError) {
throw error
}
return (
<RouteFocusModal prev={`/settings/locations/${location_id}`}>
{shippingOption && (

16
packages/admin/dashboard/src/routes/product-variants/product-variant-edit/product-variant-edit.tsx
View File

@@ -15,23 +15,25 @@ export const ProductVariantEdit = () => {
const { t } = useTranslation()
const { id, variant_id } = useParams()
const { product, isLoading, isError, error } = useProduct(id!, undefined, {
initialData,
})
const { product, isPending, isFetching, isError, error } = useProduct(
id!,
undefined,
{
initialData,
}
)
const variant = product?.variants.find(
(v: HttpTypes.AdminProductVariant) => v.id === variant_id
)
if (!isLoading && !variant) {
if (!isPending && !isFetching && !variant) {
throw json({
status: 404,
message: `Variant with ID ${variant_id} was not found.`,
})
}
const ready = !isLoading && !!product && !!variant
if (isError) {
throw error
}
@@ -41,7 +43,7 @@ export const ProductVariantEdit = () => {
<RouteDrawer.Header>
<Heading>{t("products.variant.edit.header")}</Heading>
</RouteDrawer.Header>
{ready && (
{variant && (
<ProductEditVariantForm
product={product}
variant={variant as unknown as HttpTypes.AdminProductVariant}

8
packages/admin/dashboard/src/routes/products/product-edit-option/product-edit-option.tsx
View File

@@ -9,13 +9,11 @@ export const ProductEditOption = () => {
const { id, option_id } = useParams()
const { t } = useTranslation()
const { product, isLoading, isError, error } = useProduct(id!)
const { product, isPending, isFetching, isError, error } = useProduct(id!)
const option = product?.options.find((o) => o.id === option_id)
const ready = !isLoading && option
if (!isLoading && !option) {
if (!isPending && !isFetching && !option) {
throw json({ message: `An option with ID ${option_id} was not found` }, 404)
}
@@ -28,7 +26,7 @@ export const ProductEditOption = () => {
<RouteDrawer.Header>
<Heading>{t("products.options.edit.header")}</Heading>
</RouteDrawer.Header>
{ready && <CreateProductOptionForm option={option} />}
{option && <CreateProductOptionForm option={option} />}
</RouteDrawer>
)
}