@capytale/meta-player 0.8.2 → 0.8.3

package/src/features/activitySettings/index.tsx

@@ -1,43 +1,43 @@
-import { Fieldset } from "primereact/fieldset";
-import {
-  ActivitySettingsFormDisplay,
-  ActivitySettingsOptionsDisplay,
-} from "./ui";
-import { useActivitySettingsStore } from "./store";
-import { useAppSelector } from "../../app/hooks";
-import { selectMode } from "../activityData/activityDataSlice";
-
-type ActivitySettingsDisplayProps = {};
-
-export function ActivitySettingsDisplay({}: ActivitySettingsDisplayProps) {
-  const settings = useActivitySettingsStore((state) => state.settings);
-  const mode = useAppSelector(selectMode) as
-    | "assignment"
-    | "create"
-    | "review"
-    | "view"
-    | null;
-  if (!settings) return null;
-  return (
-    <div>
-      {settings.map((section, i) => {
-        if (!mode || (section.modes && !section.modes.includes(mode))) {
-          return null;
-        }
-        return (
-          <Fieldset
-            key={`section-${i}`}
-            legend={section.title}
-            className="sidebarFieldset"
-          >
-            {section.type === "form" ? (
-              <ActivitySettingsFormDisplay form={section} mode={mode} />
-            ) : (
-              <ActivitySettingsOptionsDisplay section={section} />
-            )}
-          </Fieldset>
-        );
-      })}
-    </div>
-  );
-}
+import { Fieldset } from "primereact/fieldset";
+import {
+  ActivitySettingsFormDisplay,
+  ActivitySettingsOptionsDisplay,
+} from "./ui";
+import { useActivitySettingsStore } from "./store";
+import { useAppSelector } from "../../app/hooks";
+import { selectMode } from "../activityData/activityDataSlice";
+
+type ActivitySettingsDisplayProps = {};
+
+export function ActivitySettingsDisplay({}: ActivitySettingsDisplayProps) {
+  const settings = useActivitySettingsStore((state) => state.settings);
+  const mode = useAppSelector(selectMode) as
+    | "assignment"
+    | "create"
+    | "review"
+    | "view"
+    | null;
+  if (!settings) return null;
+  return (
+    <div>
+      {settings.map((section, i) => {
+        if (!mode || (section.modes && !section.modes.includes(mode))) {
+          return null;
+        }
+        return (
+          <Fieldset
+            key={`section-${i}`}
+            legend={section.title}
+            className="sidebarFieldset"
+          >
+            {section.type === "form" ? (
+              <ActivitySettingsFormDisplay form={section} mode={mode} />
+            ) : (
+              <ActivitySettingsOptionsDisplay section={section} />
+            )}
+          </Fieldset>
+        );
+      })}
+    </div>
+  );
+}

package/src/features/activitySettings/store.ts

@@ -1,108 +1,108 @@
-import { create } from "zustand";
-import type {
-  ActivitySettings,
-  ActivitySettingsSection,
-  ActivitySettingsFormSection,
-  ActivitySettingsMultipleOptionsSection,
-  ActivitySettingsRadioOptionsSection,
-} from "./types";
-
-function getFormSectionInitialValues(
-  section: ActivitySettingsFormSection,
-): Record<string, any> {
-  const values: Record<string, any> = {};
-  for (const field of section.fields) {
-    values[field.name] = field.defaultValue;
-  }
-  return values;
-}
-
-function getMultipleOptionsSectionInitialValues(
-  section: ActivitySettingsMultipleOptionsSection,
-): Record<string, any> {
-  return { [section.name]: section.defaultValues };
-}
-
-function getRadioOptionsSectionInitialValues(
-  section: ActivitySettingsRadioOptionsSection,
-): Record<string, any> {
-  return { [section.name]: section.defaultValue };
-}
-
-function getSectionInitialValues(
-  section: ActivitySettingsSection,
-): Record<string, any> {
-  switch (section.type) {
-    case "form":
-      return getFormSectionInitialValues(section);
-    case "checkboxes":
-    case "switches":
-      return getMultipleOptionsSectionInitialValues(section);
-    case "radio":
-      return getRadioOptionsSectionInitialValues(section);
-    default:
-      return {};
-  }
-}
-
-function getSettingsInitialValues(
-  settings: ActivitySettings,
-): Record<string, any> {
-  const values: Record<string, any> = {};
-  for (const section of settings) {
-    Object.assign(values, getSectionInitialValues(section));
-  }
-  return values;
-}
-
-type ActivitySettingsState = {
-  settings: ActivitySettings;
-  values: Record<string, any>;
-  onChange: null | ((name: string, value: any) => void);
-
-  setSettings: (
-    settings: ActivitySettings,
-    onChange: null | ((name: string, value: any) => void),
-  ) => void;
-  updateValue: (key: string, value: any) => void;
-  toggleContainsValue: (key: string, value: any) => void;
-};
-
-export const useActivitySettingsStore = create<ActivitySettingsState>()(
-  (set) => ({
-    settings: [],
-    values: {},
-    onChange: null,
-
-    setSettings: (settings, onChange) =>
-      set(() => ({
-        settings,
-        values: getSettingsInitialValues(settings),
-        onChange,
-      })),
-    updateValue: (key: string, value: any) =>
-      set((state) => {
-        if (!(key in state.values)) {
-          throw new Error(`Unknown settings key: ${key}`);
-        }
-        state.onChange && state.onChange(key, value);
-        return { values: { ...state.values, [key]: value } };
-      }),
-    toggleContainsValue: (key: string, value: any) =>
-      set((state) => {
-        if (!(key in state.values)) {
-          throw new Error(`Unknown settings key: ${key}`);
-        }
-        const currentValues = state.values[key];
-        if (!Array.isArray(currentValues)) {
-          throw new Error(`Value for key ${key} is not an array`);
-        }
-        const containsValue = currentValues.includes(value);
-        const newValues = containsValue
-          ? currentValues.filter((v: any) => v !== value)
-          : [...currentValues, value];
-        state.onChange && state.onChange(key, newValues);
-        return { values: { ...state.values, [key]: newValues } };
-      }),
-  }),
-);
+import { create } from "zustand";
+import type {
+  ActivitySettings,
+  ActivitySettingsSection,
+  ActivitySettingsFormSection,
+  ActivitySettingsMultipleOptionsSection,
+  ActivitySettingsRadioOptionsSection,
+} from "./types";
+
+function getFormSectionInitialValues(
+  section: ActivitySettingsFormSection,
+): Record<string, any> {
+  const values: Record<string, any> = {};
+  for (const field of section.fields) {
+    values[field.name] = field.defaultValue;
+  }
+  return values;
+}
+
+function getMultipleOptionsSectionInitialValues(
+  section: ActivitySettingsMultipleOptionsSection,
+): Record<string, any> {
+  return { [section.name]: section.defaultValues };
+}
+
+function getRadioOptionsSectionInitialValues(
+  section: ActivitySettingsRadioOptionsSection,
+): Record<string, any> {
+  return { [section.name]: section.defaultValue };
+}
+
+function getSectionInitialValues(
+  section: ActivitySettingsSection,
+): Record<string, any> {
+  switch (section.type) {
+    case "form":
+      return getFormSectionInitialValues(section);
+    case "checkboxes":
+    case "switches":
+      return getMultipleOptionsSectionInitialValues(section);
+    case "radio":
+      return getRadioOptionsSectionInitialValues(section);
+    default:
+      return {};
+  }
+}
+
+function getSettingsInitialValues(
+  settings: ActivitySettings,
+): Record<string, any> {
+  const values: Record<string, any> = {};
+  for (const section of settings) {
+    Object.assign(values, getSectionInitialValues(section));
+  }
+  return values;
+}
+
+type ActivitySettingsState = {
+  settings: ActivitySettings;
+  values: Record<string, any>;
+  onChange: null | ((name: string, value: any) => void);
+
+  setSettings: (
+    settings: ActivitySettings,
+    onChange: null | ((name: string, value: any) => void),
+  ) => void;
+  updateValue: (key: string, value: any) => void;
+  toggleContainsValue: (key: string, value: any) => void;
+};
+
+export const useActivitySettingsStore = create<ActivitySettingsState>()(
+  (set) => ({
+    settings: [],
+    values: {},
+    onChange: null,
+
+    setSettings: (settings, onChange) =>
+      set(() => ({
+        settings,
+        values: getSettingsInitialValues(settings),
+        onChange,
+      })),
+    updateValue: (key: string, value: any) =>
+      set((state) => {
+        if (!(key in state.values)) {
+          throw new Error(`Unknown settings key: ${key}`);
+        }
+        state.onChange && state.onChange(key, value);
+        return { values: { ...state.values, [key]: value } };
+      }),
+    toggleContainsValue: (key: string, value: any) =>
+      set((state) => {
+        if (!(key in state.values)) {
+          throw new Error(`Unknown settings key: ${key}`);
+        }
+        const currentValues = state.values[key];
+        if (!Array.isArray(currentValues)) {
+          throw new Error(`Value for key ${key} is not an array`);
+        }
+        const containsValue = currentValues.includes(value);
+        const newValues = containsValue
+          ? currentValues.filter((v: any) => v !== value)
+          : [...currentValues, value];
+        state.onChange && state.onChange(key, newValues);
+        return { values: { ...state.values, [key]: newValues } };
+      }),
+  }),
+);

package/src/features/activitySettings/style.module.scss

@@ -1,8 +1,8 @@
-.formLabel {
-}
-.formGroup {
-  margin-bottom: 1rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.3rem;
-}
+.formLabel {
+}
+.formGroup {
+  margin-bottom: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.3rem;
+}

package/src/features/activitySettings/types.ts

@@ -1,140 +1,140 @@
-export type ActivitySettingsSelect = {
-  type: "select";
-  options: {
-    label: string;
-    value: string;
-  }[];
-  defaultValue: string;
-};
-
-export type ActivitySettingsRange = {
-  type: "range";
-  min: number;
-  max: number;
-  step?: number;
-  defaultValue: number;
-};
-
-export type ActivitySettingsTextArea = {
-  type: "textarea";
-  defaultValue: string;
-};
-
-export type ActivitySettingsOption = {
-  type: "checkbox" | "switch";
-  defaultValue: boolean;
-};
-
-export type ActivitySettingsInput = {
-  type: "input";
-  inputType:
-    | "color"
-    | "date"
-    | "datetime-local"
-    | "email"
-    | "month"
-    | "password"
-    | "search"
-    | "tel"
-    | "text"
-    | "time"
-    | "url"
-    | "week";
-  defaultValue: string;
-};
-
-export type ActivitySettingsNumberInput = {
-  type: "input";
-  inputType: "number";
-  defaultValue: number;
-};
-
-export type FormField = (
-  | ActivitySettingsRange
-  | ActivitySettingsInput
-  | ActivitySettingsNumberInput
-  | ActivitySettingsTextArea
-  | ActivitySettingsOption
-  | ActivitySettingsSelect
-) & {
-  label: string;
-  name: string;
-  modes?: ("assignment" | "create" | "review" | "view")[];
-};
-
-export type ActivitySettingsFormSection = {
-  type: "form";
-  fields: FormField[];
-};
-
-export type ActivitySettingsMultipleOptionsSection = {
-  name: string;
-  type: "checkboxes" | "switches";
-  options: {
-    label: string;
-    value: string;
-  }[];
-  defaultValues: string[];
-};
-
-export type ActivitySettingsRadioOptionsSection = {
-  name: string;
-  type: "radio";
-  options: {
-    label: string;
-    value: string;
-  }[];
-  defaultValue: string | null;
-};
-
-export type ActivitySettingsSection = (
-  | ActivitySettingsMultipleOptionsSection
-  | ActivitySettingsRadioOptionsSection
-  | ActivitySettingsFormSection
-) & {
-  title: string;
-  modes?: ("assignment" | "create" | "review" | "view")[];
-};
-
-export type ActivitySettings = ActivitySettingsSection[];
-
-type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
-  k: infer I,
-) => void
-  ? I
-  : never;
-
-type InferFieldType<T> = T extends {
-  type: "checkboxes" | "switches";
-  options: readonly { value: infer V }[];
-}
-  ? V[]
-  : T extends { type: "radio"; options: readonly { value: infer V }[] }
-    ? V | null
-    : T extends { type: "select"; options: readonly { value: infer V }[] }
-      ? V
-      : T extends { type: "input"; inputType: "number" }
-        ? number
-        : T extends { type: "input" | "textarea" }
-          ? string
-          : T extends { type: "range" }
-            ? number
-            : T extends { type: "checkbox" | "switch" }
-              ? boolean
-              : never;
-
-export type InferValue<T> = T extends readonly (infer Section)[]
-  ? UnionToIntersection<
-      Section extends { type: "form"; fields: infer F extends readonly any[] }
-        ? UnionToIntersection<
-            {
-              [K in keyof F]: F[K] extends { name: infer N extends string }
-                ? { [P in N]: InferFieldType<F[K]> }
-                : never;
-            }[number]
-          >
-        : Section extends { name: infer N extends string }
-          ? { [P in N]: InferFieldType<Section> }
-          : never
-    >
-  : never;
+export type ActivitySettingsSelect = {
+  type: "select";
+  options: {
+    label: string;
+    value: string;
+  }[];
+  defaultValue: string;
+};
+
+export type ActivitySettingsRange = {
+  type: "range";
+  min: number;
+  max: number;
+  step?: number;
+  defaultValue: number;
+};
+
+export type ActivitySettingsTextArea = {
+  type: "textarea";
+  defaultValue: string;
+};
+
+export type ActivitySettingsOption = {
+  type: "checkbox" | "switch";
+  defaultValue: boolean;
+};
+
+export type ActivitySettingsInput = {
+  type: "input";
+  inputType:
+    | "color"
+    | "date"
+    | "datetime-local"
+    | "email"
+    | "month"
+    | "password"
+    | "search"
+    | "tel"
+    | "text"
+    | "time"
+    | "url"
+    | "week";
+  defaultValue: string;
+};
+
+export type ActivitySettingsNumberInput = {
+  type: "input";
+  inputType: "number";
+  defaultValue: number;
+};
+
+export type FormField = (
+  | ActivitySettingsRange
+  | ActivitySettingsInput
+  | ActivitySettingsNumberInput
+  | ActivitySettingsTextArea
+  | ActivitySettingsOption
+  | ActivitySettingsSelect
+) & {
+  label: string;
+  name: string;
+  modes?: ("assignment" | "create" | "review" | "view")[];
+};
+
+export type ActivitySettingsFormSection = {
+  type: "form";
+  fields: FormField[];
+};
+
+export type ActivitySettingsMultipleOptionsSection = {
+  name: string;
+  type: "checkboxes" | "switches";
+  options: {
+    label: string;
+    value: string;
+  }[];
+  defaultValues: string[];
+};
+
+export type ActivitySettingsRadioOptionsSection = {
+  name: string;
+  type: "radio";
+  options: {
+    label: string;
+    value: string;
+  }[];
+  defaultValue: string | null;
+};
+
+export type ActivitySettingsSection = (
+  | ActivitySettingsMultipleOptionsSection
+  | ActivitySettingsRadioOptionsSection
+  | ActivitySettingsFormSection
+) & {
+  title: string;
+  modes?: ("assignment" | "create" | "review" | "view")[];
+};
+
+export type ActivitySettings = ActivitySettingsSection[];
+
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
+  k: infer I,
+) => void
+  ? I
+  : never;
+
+type InferFieldType<T> = T extends {
+  type: "checkboxes" | "switches";
+  options: readonly { value: infer V }[];
+}
+  ? V[]
+  : T extends { type: "radio"; options: readonly { value: infer V }[] }
+    ? V | null
+    : T extends { type: "select"; options: readonly { value: infer V }[] }
+      ? V
+      : T extends { type: "input"; inputType: "number" }
+        ? number
+        : T extends { type: "input" | "textarea" }
+          ? string
+          : T extends { type: "range" }
+            ? number
+            : T extends { type: "checkbox" | "switch" }
+              ? boolean
+              : never;
+
+export type InferValue<T> = T extends readonly (infer Section)[]
+  ? UnionToIntersection<
+      Section extends { type: "form"; fields: infer F extends readonly any[] }
+        ? UnionToIntersection<
+            {
+              [K in keyof F]: F[K] extends { name: infer N extends string }
+                ? { [P in N]: InferFieldType<F[K]> }
+                : never;
+            }[number]
+          >
+        : Section extends { name: infer N extends string }
+          ? { [P in N]: InferFieldType<Section> }
+          : never
+    >
+  : never;