fix(admin-ui): Make copy on manage locations modal better when no locations (#3666)

.changeset/cool-pumpkins-confess.md

@@ -0,0 +1,5 @@
+---
+"@medusajs/admin-ui": patch
+---
+
+fix(admin-ui): Make copy and UI on manage locations modal better when no locations

packages/admin-ui/ui/src/components/forms/product/variant-inventory-form/variant-stock-form/index.tsx

@@ -1,7 +1,7 @@
 import { Controller, useFieldArray, UseFormReturn } from "react-hook-form"
 import { nestedForm } from "../../../../../utils/nested-form"
 import React, { useMemo, useState } from "react"
-
+import clsx from "clsx"
 import Accordion from "../../../../organisms/accordion"
 import BuildingsIcon from "../../../../fundamentals/icons/buildings-icon"
 import Button from "../../../../fundamentals/button"
@@ -342,24 +342,39 @@ const ManageLocationsForm = ({
     setSelectedLocations(locationOptions.map((l) => l.id))
   }
 
+  const locationsAvailable = !!locationOptions.length
+
   return (
     <div className="h-full w-full">
       <form onSubmit={handleSubmit}>
         <Modal.Content>
           <div>
-            <div className="border-grey-20 pb-base text-grey-50 flex w-full items-center justify-between border-b">
+            <div
-              <div className="">
+              className={clsx(
-                <p>Select locations that stock the selected variant</p>
+                "border-grey-20 text-grey-50 flex w-full items-center justify-between",
-                <p>{`(${selectedLocations.length} of ${locationOptions.length} selected)`}</p>
+                { "pb-base border-b": locationsAvailable }
+              )}
+            >
+              <div>
+                <p>
+                  {locationsAvailable
+                    ? "Select locations that stock the selected variant"
+                    : "You don't have any locations"}
+                </p>
+                {locationsAvailable && (
+                  <p>{`(${selectedLocations.length} of ${locationOptions.length} selected)`}</p>
+                )}
               </div>
-              <Button
+              {locationsAvailable && (
-                size="small"
+                <Button
-                variant="ghost"
+                  size="small"
-                className="border"
+                  variant="ghost"
-                onClick={handleSelectAll}
+                  className="border"
-              >
+                  onClick={handleSelectAll}
-                Select all
+                >
-              </Button>
+                  Select all
+                </Button>
+              )}
             </div>
             {locationOptions.map((loc) => {
               const existingLevel = selectedLocations.find((l) => l === loc.id)