diff --git a/src/components/Dashboard/Modals/EditService/Tabs/AppereanceTab/AppereanceTab.tsx b/src/components/Dashboard/Modals/EditService/Tabs/AppereanceTab/AppereanceTab.tsx
index f6aaee8a1..1066a28df 100644
--- a/src/components/Dashboard/Modals/EditService/Tabs/AppereanceTab/AppereanceTab.tsx
+++ b/src/components/Dashboard/Modals/EditService/Tabs/AppereanceTab/AppereanceTab.tsx
@@ -1,4 +1,4 @@
-import { Tabs, TextInput } from '@mantine/core';
+import { Tabs, TextInput, createStyles } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { IconPhoto } from '@tabler/icons';
import { useTranslation } from 'next-i18next';
@@ -10,15 +10,37 @@ interface AppearanceTabProps {
export const AppearanceTab = ({ form }: AppearanceTabProps) => {
const { t } = useTranslation('');
+ const { classes } = useStyles();
+
+ const Image = () => {
+ if (form.values.appearance.iconUrl !== undefined) {
+ // disabled due to too many dynamic targets for next image cache
+ // eslint-disable-next-line @next/next/no-img-element
+ return
;
+ }
+
+ return ;
+ };
+
return (
}
+ icon={}
label="Service Icon"
variant="default"
defaultValue={form.values.appearance.iconUrl}
- {...form.getInputProps('serviceIcon')}
+ {...form.getInputProps('appearance.iconUrl')}
+ withAsterisk
+ required
/>
);
};
+
+const useStyles = createStyles(() => ({
+ iconImage: {
+ objectFit: 'contain',
+ width: 20,
+ height: 20,
+ },
+}));
diff --git a/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer.tsx b/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer.tsx
index cef289873..e7844ed35 100644
--- a/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer.tsx
+++ b/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/Components/IntegrationOptionsRenderer/IntegrationOptionsRenderer.tsx
@@ -1,7 +1,7 @@
import { Stack } from '@mantine/core';
import { UseFormReturnType } from '@mantine/form';
import { IconKey, IconKeyOff, IconLock, IconLockOff, IconUser, IconUserOff } from '@tabler/icons';
-import { ServiceType } from '../../../../../../../../../types/service';
+import { ServiceType } from '../../../../../../../../types/service';
import { GenericSecretInput } from '../InputElements/GenericSecretInput';
interface IntegrationOptionsRendererProps {
@@ -31,7 +31,7 @@ const secretMappings = [
export const IntegrationOptionsRenderer = ({ form }: IntegrationOptionsRendererProps) => (
- {Object.entries(form.values.integration.properties).map((entry) => {
+ {form.values.integration && Object.entries(form.values.integration.properties).map((entry) => {
const mapping = secretMappings.find((item) => item.label === entry[0]);
const isPresent = entry[1] !== undefined;
diff --git a/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/IntegrationTab.tsx b/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/IntegrationTab.tsx
index ae5930eb9..46e399ee2 100644
--- a/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/IntegrationTab.tsx
+++ b/src/components/Dashboard/Modals/EditService/Tabs/IntegrationTab/IntegrationTab.tsx
@@ -12,7 +12,8 @@ interface IntegrationTabProps {
export const IntegrationTab = ({ form }: IntegrationTabProps) => {
const { t } = useTranslation('');
- const hasIntegrationSelected = form.values.integration !== null;
+ const hasIntegrationSelected =
+ form.values.integration && Object.keys(form.values.integration.properties).length;
return (