Allow editing SKU value from the Edit SKU modal

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

web/src/api.ts

@@ -38,6 +38,7 @@ export const api = {
   updateProduct: (
     id: string,
     body: Partial<{
+      sku: string;
       type: string;
       kind: "bulk" | "discrete";
       strainId: string | null;

web/src/components/modals/SkuModals.tsx

@@ -169,6 +169,7 @@ export function EditSkuModal({
   const qc = useQueryClient();
   const strain = data.strains.find((s) => s.id === product.strainId);
 
+  const [skuValue, setSkuValue] = useState(product.sku);
   const [strainName, setStrainName] = useState(strain?.name ?? "");
   const [brandId, setBrandId] = useState(product.brandId ?? "");
   const [typeId, setTypeId] = useState(product.type);
@@ -188,6 +189,7 @@ export function EditSkuModal({
   const updateProduct = useMutation({
     mutationFn: async () => {
       await api.updateProduct(product.id, {
+        sku: skuValue.trim(),
         type: typeId,
         kind: selectedType.kind,
         strainName: strainName.trim(),
@@ -221,11 +223,18 @@ export function EditSkuModal({
           boxShadow: "var(--shadow-lg)",
         }}
       >
-        <ModalHeader title="Edit SKU" eyebrow={`SKU · ${product.sku}`} onClose={onClose} />
+        <ModalHeader title="Edit SKU" eyebrow="SKU" onClose={onClose} />
         <div style={{ padding: 32, display: "grid", gap: 16 }}>
-          <Field label="Strain name">
+          <Field label="SKU code">
             <Input
               autoFocus
+              value={skuValue}
+              onChange={(e) => setSkuValue(e.target.value)}
+              placeholder="e.g. SKU-0042"
+            />
+          </Field>
+          <Field label="Strain name">
+            <Input
               value={strainName}
               onChange={(e) => setStrainName(e.target.value)}
               placeholder="e.g. Blue Dream"
@@ -316,7 +325,7 @@ export function EditSkuModal({
             <Btn
               variant="primary"
               icon="check"
-              disabled={!strainName.trim() || updateProduct.isPending}
+              disabled={!skuValue.trim() || !strainName.trim() || updateProduct.isPending}
               onClick={() => updateProduct.mutate()}
             >
               {updateProduct.isPending ? "Saving..." : "Save changes"}