chore: update prettier configuration for print width (#519)

* feat: update prettier configuration for print width * chore: apply code formatting to entire repository * fix: remove build files * fix: format issue --------- Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>
2024-05-19 22:38:39 +02:00
parent 919161798e
commit f1b1ec59ec
234 changed files with 2444 additions and 5375 deletions
--- a/packages/widgets/src/_inputs/common.tsx
+++ b/packages/widgets/src/_inputs/common.tsx
@@ -9,9 +9,7 @@ export interface CommonWidgetInputProps<TKey extends WidgetOptionType> {
  options: Omit<WidgetOptionOfType<TKey>, "defaultValue" | "type">;
 }

-type UseWidgetInputTranslationReturnType = (
-  key: "label" | "description",
-) => string;
+type UseWidgetInputTranslationReturnType = (key: "label" | "description") => string;

 /**
 * Short description why as and unknown convertions are used below:
@@ -23,10 +21,7 @@ type UseWidgetInputTranslationReturnType = (
 * - The label translation can be used for every input, especially considering that all options should have defined a label for themself. The description translation should only be used when withDescription
 *   is defined for the option. The method does sadly not reconize issues with those definitions. So it does not yell at you when you somewhere show the label without having it defined in the translations.
 */
-export const useWidgetInputTranslation = (
-  kind: WidgetKind,
-  property: string,
-): UseWidgetInputTranslationReturnType => {
+export const useWidgetInputTranslation = (kind: WidgetKind, property: string): UseWidgetInputTranslationReturnType => {
  return useScopedI18n(
    `widget.${kind}.option.${property}` as never, // Because the type is complex and not recognized by typescript, we need to cast it to never to make it work.
  ) as unknown as UseWidgetInputTranslationReturnType;
--- a/packages/widgets/src/_inputs/form.ts
+++ b/packages/widgets/src/_inputs/form.ts
@@ -4,5 +4,4 @@ import { createFormContext } from "@homarr/form";

 import type { WidgetEditModalState } from "../modals/widget-edit-modal";

-export const [FormProvider, useFormContext, useForm] =
-  createFormContext<WidgetEditModalState>();
+export const [FormProvider, useFormContext, useForm] = createFormContext<WidgetEditModalState>();
--- a/packages/widgets/src/_inputs/index.ts
+++ b/packages/widgets/src/_inputs/index.ts
@@ -20,8 +20,6 @@ const mapping = {
  app: WidgetAppInput,
 } satisfies Record<WidgetOptionType, unknown>;

-export const getInputForType = <TType extends WidgetOptionType>(
-  type: TType,
-) => {
+export const getInputForType = <TType extends WidgetOptionType>(type: TType) => {
  return mapping[type];
 };
--- a/packages/widgets/src/_inputs/widget-app-input.tsx
+++ b/packages/widgets/src/_inputs/widget-app-input.tsx
@@ -12,11 +12,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetAppInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"app">) => {
+export const WidgetAppInput = ({ property, kind, options }: CommonWidgetInputProps<"app">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();
  const { data: apps, isPending } = clientApi.app.selectable.useQuery();
@@ -31,9 +27,7 @@ export const WidgetAppInput = ({
      label={t("label")}
      searchable
      limit={10}
-      leftSection={
-        <MemoizedLeftSection isPending={isPending} currentApp={currentApp} />
-      }
+      leftSection={<MemoizedLeftSection isPending={isPending} currentApp={currentApp} />}
      renderOption={renderSelectOption}
      data={
        apps?.map((app) => ({
@@ -55,18 +49,13 @@ const iconProps = {
  size: 18,
 };

-const renderSelectOption: SelectProps["renderOption"] = ({
-  option,
-  checked,
-}) => (
+const renderSelectOption: SelectProps["renderOption"] = ({ option, checked }) => (
  <Group flex="1" gap="xs">
    {"iconUrl" in option && typeof option.iconUrl === "string" ? (
      <img width={20} height={20} src={option.iconUrl} alt={option.label} />
    ) : null}
    {option.label}
-    {checked && (
-      <IconCheck style={{ marginInlineStart: "auto" }} {...iconProps} />
-    )}
+    {checked && <IconCheck style={{ marginInlineStart: "auto" }} {...iconProps} />}
  </Group>
 );

@@ -82,14 +71,7 @@ const LeftSection = ({ isPending, currentApp }: LeftSectionProps) => {
  }

  if (currentApp) {
-    return (
-      <img
-        width={size}
-        height={size}
-        src={currentApp.iconUrl}
-        alt={currentApp.name}
-      />
-    );
+    return <img width={size} height={size} src={currentApp.iconUrl} alt={currentApp.name} />;
  }

  return null;
--- a/packages/widgets/src/_inputs/widget-location-input.tsx
+++ b/packages/widgets/src/_inputs/widget-location-input.tsx
@@ -28,10 +28,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetLocationInput = ({
-  property,
-  kind,
-}: CommonWidgetInputProps<"location">) => {
+export const WidgetLocationInput = ({ property, kind }: CommonWidgetInputProps<"location">) => {
  const t = useWidgetInputTranslation(kind, property);
  const tLocation = useScopedI18n("widget.common.location");
  const form = useFormContext();
@@ -39,8 +36,7 @@ export const WidgetLocationInput = ({
  const value = form.values.options[property] as OptionLocation;
  const selectionEnabled = value.name.length > 1;

-  const handleChange = form.getInputProps(`options.${property}`)
-    .onChange as LocationOnChange;
+  const handleChange = form.getInputProps(`options.${property}`).onChange as LocationOnChange;
  const unknownLocation = tLocation("unknownLocation");

  const onQueryChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {
@@ -95,16 +91,8 @@ export const WidgetLocationInput = ({
    <Fieldset legend={t("label")}>
      <Stack gap="xs">
        <Group wrap="nowrap" align="end">
-          <TextInput
-            w="100%"
-            label={tLocation("query")}
-            value={value.name}
-            onChange={onQueryChange}
-          />
-          <Tooltip
-            hidden={selectionEnabled}
-            label={tLocation("disabledTooltip")}
-          >
+          <TextInput w="100%" label={tLocation("query")} value={value.name} onChange={onQueryChange} />
+          <Tooltip hidden={selectionEnabled} label={tLocation("disabledTooltip")}>
            <div>
              <Button
                disabled={!selectionEnabled}
@@ -151,61 +139,57 @@ interface LocationSearchInnerProps {
  onLocationSelect: (location: OptionLocation) => void;
 }

-const LocationSearchModal = createModal<LocationSearchInnerProps>(
-  ({ actions, innerProps }) => {
-    const t = useScopedI18n("widget.common.location.table");
-    const tCommon = useScopedI18n("common");
-    const { data, isPending, error } = clientApi.location.searchCity.useQuery({
-      query: innerProps.query,
-    });
+const LocationSearchModal = createModal<LocationSearchInnerProps>(({ actions, innerProps }) => {
+  const t = useScopedI18n("widget.common.location.table");
+  const tCommon = useScopedI18n("common");
+  const { data, isPending, error } = clientApi.location.searchCity.useQuery({
+    query: innerProps.query,
+  });

-    if (error) {
-      throw error;
-    }
+  if (error) {
+    throw error;
+  }

-    return (
-      <Stack>
-        <Table striped>
-          <Table.Thead>
+  return (
+    <Stack>
+      <Table striped>
+        <Table.Thead>
+          <Table.Tr>
+            <Table.Th style={{ width: "70%" }}>{t("header.city")}</Table.Th>
+            <Table.Th style={{ width: "50%" }}>{t("header.country")}</Table.Th>
+            <Table.Th>{t("header.coordinates")}</Table.Th>
+            <Table.Th>{t("header.population")}</Table.Th>
+            <Table.Th style={{ width: 40 }} />
+          </Table.Tr>
+        </Table.Thead>
+        <Table.Tbody>
+          {isPending && (
            <Table.Tr>
-              <Table.Th style={{ width: "70%" }}>{t("header.city")}</Table.Th>
-              <Table.Th style={{ width: "50%" }}>
-                {t("header.country")}
-              </Table.Th>
-              <Table.Th>{t("header.coordinates")}</Table.Th>
-              <Table.Th>{t("header.population")}</Table.Th>
-              <Table.Th style={{ width: 40 }} />
+              <Table.Td colSpan={5}>
+                <Group justify="center">
+                  <Loader />
+                </Group>
+              </Table.Td>
            </Table.Tr>
-          </Table.Thead>
-          <Table.Tbody>
-            {isPending && (
-              <Table.Tr>
-                <Table.Td colSpan={5}>
-                  <Group justify="center">
-                    <Loader />
-                  </Group>
-                </Table.Td>
-              </Table.Tr>
-            )}
-            {data?.results.map((city) => (
-              <LocationSelectTableRow
-                key={city.id}
-                city={city}
-                onLocationSelect={innerProps.onLocationSelect}
-                closeModal={actions.closeModal}
-              />
-            ))}
-          </Table.Tbody>
-        </Table>
-        <Group justify="right">
-          <Button variant="light" onClick={actions.closeModal}>
-            {tCommon("action.cancel")}
-          </Button>
-        </Group>
-      </Stack>
-    );
-  },
-).withOptions({
+          )}
+          {data?.results.map((city) => (
+            <LocationSelectTableRow
+              key={city.id}
+              city={city}
+              onLocationSelect={innerProps.onLocationSelect}
+              closeModal={actions.closeModal}
+            />
+          ))}
+        </Table.Tbody>
+      </Table>
+      <Group justify="right">
+        <Button variant="light" onClick={actions.closeModal}>
+          {tCommon("action.cancel")}
+        </Button>
+      </Group>
+    </Stack>
+  );
+}).withOptions({
  defaultTitle(t) {
    return t("widget.common.location.search");
  },
@@ -218,11 +202,7 @@ interface LocationSearchTableRowProps {
  closeModal: () => void;
 }

-const LocationSelectTableRow = ({
-  city,
-  onLocationSelect,
-  closeModal,
-}: LocationSearchTableRowProps) => {
+const LocationSelectTableRow = ({ city, onLocationSelect, closeModal }: LocationSearchTableRowProps) => {
  const t = useScopedI18n("widget.common.location.table");
  const onSelect = useCallback(() => {
    onLocationSelect({
@@ -244,10 +224,7 @@ const LocationSelectTableRow = ({
        <Text style={{ whiteSpace: "nowrap" }}>{city.country}</Text>
      </Table.Td>
      <Table.Td>
-        <Anchor
-          target="_blank"
-          href={`https://www.google.com/maps/place/${city.latitude},${city.longitude}`}
-        >
+        <Anchor target="_blank" href={`https://www.google.com/maps/place/${city.latitude},${city.longitude}`}>
          <Text style={{ whiteSpace: "nowrap" }}>
            {city.latitude}, {city.longitude}
          </Text>
@@ -255,9 +232,7 @@ const LocationSelectTableRow = ({
      </Table.Td>
      <Table.Td>
        {city.population ? (
-          <Text style={{ whiteSpace: "nowrap" }}>
-            {formatter.format(city.population)}
-          </Text>
+          <Text style={{ whiteSpace: "nowrap" }}>{formatter.format(city.population)}</Text>
        ) : (
          <Text c="gray"> {t("population.fallback")}</Text>
        )}
--- a/packages/widgets/src/_inputs/widget-multiselect-input.tsx
+++ b/packages/widgets/src/_inputs/widget-multiselect-input.tsx
@@ -7,11 +7,7 @@ import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";
 import type { SelectOption } from "./widget-select-input";

-export const WidgetMultiSelectInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"multiSelect">) => {
+export const WidgetMultiSelectInput = ({ property, kind, options }: CommonWidgetInputProps<"multiSelect">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();

--- a/packages/widgets/src/_inputs/widget-number-input.tsx
+++ b/packages/widgets/src/_inputs/widget-number-input.tsx
@@ -6,11 +6,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetNumberInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"number">) => {
+export const WidgetNumberInput = ({ property, kind, options }: CommonWidgetInputProps<"number">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();

--- a/packages/widgets/src/_inputs/widget-select-input.tsx
+++ b/packages/widgets/src/_inputs/widget-select-input.tsx
@@ -13,18 +13,13 @@ export type SelectOption =
    }
  | string;

-export type inferSelectOptionValue<TOption extends SelectOption> =
-  TOption extends {
-    value: infer TValue;
-  }
-    ? TValue
-    : TOption;
+export type inferSelectOptionValue<TOption extends SelectOption> = TOption extends {
+  value: infer TValue;
+}
+  ? TValue
+  : TOption;

-export const WidgetSelectInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"select">) => {
+export const WidgetSelectInput = ({ property, kind, options }: CommonWidgetInputProps<"select">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();

--- a/packages/widgets/src/_inputs/widget-slider-input.tsx
+++ b/packages/widgets/src/_inputs/widget-slider-input.tsx
@@ -6,11 +6,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetSliderInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"slider">) => {
+export const WidgetSliderInput = ({ property, kind, options }: CommonWidgetInputProps<"slider">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();

--- a/packages/widgets/src/_inputs/widget-switch-input.tsx
+++ b/packages/widgets/src/_inputs/widget-switch-input.tsx
@@ -6,11 +6,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetSwitchInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"switch">) => {
+export const WidgetSwitchInput = ({ property, kind, options }: CommonWidgetInputProps<"switch">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();

--- a/packages/widgets/src/_inputs/widget-text-input.tsx
+++ b/packages/widgets/src/_inputs/widget-text-input.tsx
@@ -6,11 +6,7 @@ import type { CommonWidgetInputProps } from "./common";
 import { useWidgetInputTranslation } from "./common";
 import { useFormContext } from "./form";

-export const WidgetTextInput = ({
-  property,
-  kind,
-  options,
-}: CommonWidgetInputProps<"text">) => {
+export const WidgetTextInput = ({ property, kind, options }: CommonWidgetInputProps<"text">) => {
  const t = useWidgetInputTranslation(kind, property);
  const form = useFormContext();