feat: Add widget integration option (#14)

* wip: add widget integrations

* feat: Add integration option to widgets

* feat: Add translation for widget integration select

* fix: formatting issue

* chore: address pull request feedback

packages/widgets/src/_inputs/form.ts

@@ -2,5 +2,7 @@
 
 import { createFormContext } from "@homarr/form";
 
+import type { WidgetEditModalState } from "../modals/widget-edit-modal";
+
 export const [FormProvider, useFormContext, useForm] =
-  createFormContext<Record<string, unknown>>();
+  createFormContext<WidgetEditModalState>();

packages/widgets/src/_inputs/widget-multiselect-input.tsx

@@ -19,7 +19,7 @@ export const WidgetMultiSelectInput = ({
       label={t("label")}
       data={options.options as unknown as string[]}
       description={options.withDescription ? t("description") : undefined}
-      {...form.getInputProps(property)}
+      {...form.getInputProps(`options.${property}`)}
     />
   );
 };

packages/widgets/src/_inputs/widget-number-input.tsx

@@ -21,7 +21,7 @@ export const WidgetNumberInput = ({
       min={options.validate.minValue ?? undefined}
       max={options.validate.maxValue ?? undefined}
       step={options.step}
-      {...form.getInputProps(property)}
+      {...form.getInputProps(`options.${property}`)}
     />
   );
 };

packages/widgets/src/_inputs/widget-select-input.tsx

@@ -19,7 +19,7 @@ export const WidgetSelectInput = ({
       label={t("label")}
       data={options.options as unknown as string[]}
       description={options.withDescription ? t("description") : undefined}
-      {...form.getInputProps(property)}
+      {...form.getInputProps(`options.${property}`)}
     />
   );
 };

packages/widgets/src/_inputs/widget-slider-input.tsx

@@ -23,7 +23,7 @@ export const WidgetSliderInput = ({
         min={options.validate.minValue ?? undefined}
         max={options.validate.maxValue ?? undefined}
         step={options.step}
-        {...form.getInputProps(property)}
+        {...form.getInputProps(`options.${property}`)}
       />
     </InputWrapper>
   );

packages/widgets/src/_inputs/widget-switch-input.tsx

@@ -18,7 +18,7 @@ export const WidgetSwitchInput = ({
     <Switch
       label={t("label")}
       description={options.withDescription ? t("description") : undefined}
-      {...form.getInputProps(property, { type: "checkbox" })}
+      {...form.getInputProps(`options.${property}`, { type: "checkbox" })}
     />
   );
 };

packages/widgets/src/_inputs/widget-text-input.tsx

@@ -18,7 +18,7 @@ export const WidgetTextInput = ({
     <TextInput
       label={t("label")}
       description={options.withDescription ? t("description") : undefined}
-      {...form.getInputProps(property)}
+      {...form.getInputProps(`options.${property}`)}
     />
   );
 };