wip

progressively-crew · Jan 16, 2023 · f8f94d4 · f8f94d4
1 parent 99ef840
commit f8f94d4
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 28 deletions.
diff --git a/packages/frontend/app/modules/scheduling/types.ts b/packages/frontend/app/modules/scheduling/types.ts
@@ -14,12 +14,29 @@ export interface Schedule {
   type: SchedulingType;
 }
 
-export interface SchedulingCreateDTO {
+export interface SchedulingUpdateVariantEntry {
+  variantId: string;
+  variantNewPercentage: number;
+}
+
+export interface SchedulingUpdatePercentageData {
+  rolloutPercentage: number;
+}
+
+export type SchedulingCreateDTO = {
   utc: string;
-  data: { rolloutPercentage?: number };
   status: FlagStatus;
   type: SchedulingType;
-}
+} & (
+  | {
+      type: SchedulingType.UpdatePercentage;
+      data: SchedulingUpdatePercentageData;
+    }
+  | {
+      type: SchedulingType.UpdateVariantPercentage;
+      data: Array<SchedulingUpdateVariantEntry>;
+    }
+);
 
 export enum SchedulingType {
   UpdatePercentage = "UpdatePercentage",

diff --git a/packages/frontend/app/modules/strategies/components/MultiVariantFields.tsx b/packages/frontend/app/modules/strategies/components/MultiVariantFields.tsx
@@ -1,6 +1,7 @@
 import { useState } from "react";
 import { SliderInput } from "~/components/Fields/SliderInput";
 import { FlagEnv } from "~/modules/flags/types";
+import { SchedulingType } from "~/modules/scheduling/types";
 import { Variant } from "~/modules/variants/types";
 
 interface VariantRowProps {
@@ -23,12 +24,22 @@ const VariantRow = ({ variant }: VariantRowProps) => {
 interface MultiVariantFieldsProps {
   variants: FlagEnv["variants"];
 }
+
 export const MultiVariantFields = ({ variants }: MultiVariantFieldsProps) => {
   return (
     <div>
       {variants.map((variant) => (
-        <VariantRow variant={variant} key={variant.uuid} />
+        <>
+          <VariantRow variant={variant} key={variant.uuid} />
+          <input type="hidden" name="variantId" value={variant.uuid} />
+        </>
       ))}
+
+      <input
+        type="hidden"
+        name="type"
+        value={SchedulingType.UpdateVariantPercentage}
+      />
     </div>
   );
 };
diff --git a/...d/app/routes/dashboard/projects/$id/environments/$env/flags/$flagId/scheduling/create.tsx b/...d/app/routes/dashboard/projects/$id/environments/$env/flags/$flagId/scheduling/create.tsx
@@ -6,9 +6,7 @@ import { useActionData, Form, useTransition } from "@remix-run/react";
 import { CreateSchedulingFrom } from "~/modules/strategies/components/CreateSchedulingForm";
 import {
   SchedulingCreateDTO,
-  SchedulingStatus,
   SchedulingType,
-  SchedulingTypes,
 } from "~/modules/scheduling/types";
 import { createScheduling } from "~/modules/scheduling/services/createScheduling";
 import { useProject } from "~/modules/projects/contexts/useProject";
@@ -53,44 +51,55 @@ export const action: ActionFunction = async ({
   const formData = await request.formData();
   const session = await getSession(request.headers.get("Cookie"));
 
+  // Shared fields between single and multi variants
   const utc = formData.get("utc-dateTime")?.toString();
   const type = formData.get("type")?.toString() as SchedulingType | undefined;
-
   const status =
     (formData.get("nextStatus") as unknown as FlagStatus) || undefined;
 
-  const rolloutPercentageFormData = formData
-    .get("rolloutPercentage")
-    ?.toString();
-  const rolloutPercentage = rolloutPercentageFormData
-    ? Number(rolloutPercentageFormData)
-    : undefined;
-
-  const createSchedulingDto: Partial<SchedulingCreateDTO> = {
-    utc,
-    status,
-    data: { rolloutPercentage },
-    type,
-  };
+  let createSchedulingDto: Partial<SchedulingCreateDTO> = {};
+
+  if (type === SchedulingType.UpdatePercentage) {
+    const rolloutPercentageFormData = formData
+      .get("rolloutPercentage")
+      ?.toString();
+
+    const rolloutPercentage = rolloutPercentageFormData
+      ? Number(rolloutPercentageFormData)
+      : undefined;
+
+    createSchedulingDto = {
+      utc,
+      status,
+      data: { rolloutPercentage },
+      type,
+    };
+  } else if (SchedulingType.UpdateVariantPercentage) {
+    const variants = formData.getAll("variantId");
+    const rolloutPercentages = formData.getAll("rolloutPercentage");
+
+    createSchedulingDto = {
+      utc,
+      status,
+      data: variants.map((variantId, index: number) => ({
+        variantId,
+        variantNewPercentage: rolloutPercentages[index],
+      })),
+      type,
+    };
+  }
 
   const errors = validateScheduling(createSchedulingDto);
 
   if (Object.keys(errors).length > 0) {
     return { errors };
   }
 
-  const scheduling: SchedulingCreateDTO = {
-    utc: utc!,
-    status,
-    data: { rolloutPercentage },
-    type: type!,
-  };
-
   try {
     await createScheduling(
       params.env!,
       params.flagId!,
-      scheduling,
+      createSchedulingDto,
       session.get("auth-cookie")
     );