Dockery/Homarr
1
0
Fork 0
mirror of https://github.com/ajnart/homarr.git synced 2025-11-10 23:45:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

🐛 Fix nullable integration type

Browse Source
This commit is contained in:
Manuel Ruwe
2022-12-12 21:53:30 +01:00
parent 1861a8d9d2
commit 4840548946
2 changed files with 37 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/Components/InputElements/IntegrationSelector.tsx
View File

@@ -3,7 +3,6 @@ import { Group, Select, SelectItem, Text } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form'; import { UseFormReturnType } from '@mantine/form';
import { useTranslation } from 'next-i18next'; import { useTranslation } from 'next-i18next';
import { forwardRef } from 'react'; import { forwardRef } from 'react';
import { IntegrationsType } from '../../../../../../../../types/integration';
import { import {
IntegrationField, IntegrationField,
integrationFieldDefinitions, integrationFieldDefinitions,
@@ -54,12 +53,15 @@ export const IntegrationSelector = ({ form }: IntegrationSelectorProps) => {
}, },
].filter((x) => Object.keys(integrationFieldProperties).includes(x.value)); ].filter((x) => Object.keys(integrationFieldProperties).includes(x.value));
const inputProps = form.getInputProps('integration.type');
const getNewProperties = (value: string | null): ServiceIntegrationPropertyType[] => { const getNewProperties = (value: string | null): ServiceIntegrationPropertyType[] => {
if (!value) return []; if (!value) return [];
const integrationType = value as ServiceIntegrationType['type'];
if (integrationType === null) {
return [];
}
const requiredProperties = Object.entries(integrationFieldDefinitions).filter(([k, v]) => { const requiredProperties = Object.entries(integrationFieldDefinitions).filter(([k, v]) => {
const val = integrationFieldProperties[value as ServiceIntegrationType['type']]; const val = integrationFieldProperties[integrationType['type']];
return val.includes(k as IntegrationField); return val.includes(k as IntegrationField);
})!; })!;
return requiredProperties.map(([k, value]) => ({ return requiredProperties.map(([k, value]) => ({
@@ -70,36 +72,36 @@ export const IntegrationSelector = ({ form }: IntegrationSelectorProps) => {
})); }));
}; };
const inputProps = form.getInputProps('integration.type');
return ( return (
<> <Select
<Select label="Integration configuration"
label="Integration configuration" description="Treats this service as the selected integration and provides you with per-service configuration"
description="Treats this service as the selected integration and provides you with per-service configuration" placeholder="Select your desired configuration"
placeholder="Select your desired configuration" itemComponent={SelectItemComponent}
itemComponent={SelectItemComponent} data={data}
data={data} maxDropdownHeight={400}
maxDropdownHeight={400} clearable
clearable variant="default"
variant="default" mb="md"
mb="md" icon={
icon={ form.values.integration?.type && (
form.values.integration?.type && ( <img
<img src={data.find((x) => x.value === form.values.integration?.type)?.image}
src={data.find((x) => x.value === form.values.integration?.type)?.image} alt="test"
alt="test" width={20}
width={20} height={20}
height={20} />
/> )
) }
} onChange={(value) => {
{...inputProps} form.setFieldValue('integration.properties', getNewProperties(value));
onChange={(value) => { console.log(`changed to value ${value}`);
form.setFieldValue('integration.properties', getNewProperties(value)); inputProps.onChange(value);
console.log(`changed to value ${value}`); }}
inputProps.onChange(value); {...inputProps}
}} />
/>
</>
); );
}; };

4
src/types/service.ts
View File

@@ -16,7 +16,7 @@ export interface ServiceType extends TileBaseType {
behaviour: ServiceBehaviourType; behaviour: ServiceBehaviourType;
network: ServiceNetworkType; network: ServiceNetworkType;
appearance: ServiceAppearanceType; appearance: ServiceAppearanceType;
integration?: ServiceIntegrationType | null; integration: ServiceIntegrationType;
} }
export type ConfigServiceType = Omit<ServiceType, 'integration'> & { export type ConfigServiceType = Omit<ServiceType, 'integration'> & {
@@ -51,7 +51,7 @@ export type IntegrationType =
| 'nzbGet'; | 'nzbGet';
export type ServiceIntegrationType = { export type ServiceIntegrationType = {
type: IntegrationType; type: IntegrationType | null;
properties: ServiceIntegrationPropertyType[]; properties: ServiceIntegrationPropertyType[];
}; };