Skip to content

Commit

Permalink
Merge pull request #790 from openstad/develop
Browse files Browse the repository at this point in the history 
Update main with develop changes
  • Loading branch information
@iandebruin98
iandebruin98 authored Feb 27, 2025
2 parents 5f3eb86 + c822902 commit 4b6cfeb
Show file tree
Hide file tree
Showing 15 changed files with 402 additions and 331 deletions.
11 changes: 10 additions & 1 deletion apps/admin-server/src/pages/projects/[project]/widgets/choiceguide/[id]/items.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -356,7 +356,16 @@ export default function WidgetChoiceGuideItems(
}, [ form.watch('type') ])

function handleSaveItems() {
props.updateConfig({ ...props, items });
const updatedProps = { ...props };

Object.keys(updatedProps).forEach((key: string) => {
if (key.startsWith("options.")) {
// @ts-ignore
delete updatedProps[key];
}
});

props.updateConfig({ ...updatedProps, items });
window.location.reload();
}

Expand Down
245 changes: 122 additions & 123 deletions apps/admin-server/src/pages/projects/[project]/widgets/enquete/[id]/items.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ import * as z from 'zod';
import InfoDialog from '@/components/ui/info-hover';
import { useRouter } from 'next/router';
import {YesNoSelect} from "@/lib/form-widget-helpers";
import {ProjectSettingProps} from "@openstad-headless/types";

const formSchema = z.object({
trigger: z.string(),
Expand All @@ -45,18 +46,17 @@ const formSchema = z.object({
.array(
z.object({
trigger: z.string(),
titles: z.array(z.object({ text: z.string().optional(), key: z.string(), isOtherOption: z.boolean().optional(), defaultValue: z.boolean().optional() })),
titles: z.array(z.object({
text: z.string().optional(),
key: z.string(),
image: z.string().optional(),
isOtherOption: z.boolean().optional(),
defaultValue: z.boolean().optional(),
hideLabel: z.boolean().optional()
})),
})
)
.optional(),
image1Upload: z.string().optional(),
image1: z.string().optional(),
text1: z.string().optional(),
key1: z.string().optional(),
image2: z.string().optional(),
image2Upload: z.string().optional(),
text2: z.string().optional(),
key2: z.string().optional(),
multiple: z.boolean().optional(),
image: z.string().optional(),
imageAlt: z.string().optional(),
Expand All @@ -66,6 +66,17 @@ const formSchema = z.object({
showSmileys: z.boolean().optional(),
placeholder: z.string().optional(),
defaultValue: z.string().optional(),
imageOptionUpload: z.string().optional(),

// Keeping these for backwards compatibility
image1Upload: z.string().optional(),
image1: z.string().optional(),
text1: z.string().optional(),
key1: z.string().optional(),
image2: z.string().optional(),
image2Upload: z.string().optional(),
text2: z.string().optional(),
key2: z.string().optional(),
});

export default function WidgetEnqueteItems(
Expand Down Expand Up @@ -109,12 +120,6 @@ export default function WidgetEnqueteItems(
maxCharacters: values.maxCharacters,
variant: values.variant || 'text input',
options: values.options || [],
image1: values.image1 || '',
text1: values.text1 || '',
key1: values.key1 || '',
image2: values.image2 || '',
text2: values.text2 || '',
key2: values.key2 || '',
multiple: values.multiple || false,
image: values.image || '',
imageAlt: values.imageAlt || '',
Expand All @@ -123,6 +128,14 @@ export default function WidgetEnqueteItems(
showSmileys: values.showSmileys || false,
defaultValue: values.defaultValue || '',
placeholder: values.placeholder || '',

// Keeping these for backwards compatibility
image1: values.image1 || '',
text1: values.text1 || '',
key1: values.key1 || '',
image2: values.image2 || '',
text2: values.text2 || '',
key2: values.key2 || '',
},
]);
}
Expand Down Expand Up @@ -172,12 +185,6 @@ export default function WidgetEnqueteItems(
maxCharacters: '',
variant: 'text input',
options: [],
image1: '',
text1: '',
key1: '',
image2: '',
text2: '',
key2: '',
multiple: false,
image: '',
imageAlt: '',
Expand All @@ -186,6 +193,14 @@ export default function WidgetEnqueteItems(
showSmileys: false,
defaultValue: '',
placeholder: '',

// Keeping these for backwards compatibility
image1: '',
text1: '',
key1: '',
image2: '',
text2: '',
key2: '',
});

const form = useForm<FormData>({
Expand Down Expand Up @@ -217,12 +232,6 @@ export default function WidgetEnqueteItems(
maxCharacters: selectedItem.maxCharacters || '',
variant: selectedItem.variant || '',
options: selectedItem.options || [],
image1: selectedItem.image1 || '',
text1: selectedItem.text1 || '',
key1: selectedItem.key1 || '',
image2: selectedItem.image2 || '',
text2: selectedItem.text2 || '',
key2: selectedItem.key2 || '',
multiple: selectedItem.multiple || false,
image: selectedItem.image || '',
imageAlt: selectedItem.imageAlt || '',
Expand All @@ -231,6 +240,14 @@ export default function WidgetEnqueteItems(
showSmileys: selectedItem.showSmileys || false,
defaultValue: selectedItem.defaultValue || '',
placeholder: selectedItem.placeholder || '',

// Keeping these for backwards compatibility
image1: selectedItem.image1 || '',
text1: selectedItem.text1 || '',
key1: selectedItem.key1 || '',
image2: selectedItem.image2 || '',
text2: selectedItem.text2 || '',
key2: selectedItem.key2 || '',
});
setOptions(selectedItem.options || []);
}
Expand Down Expand Up @@ -304,14 +321,24 @@ export default function WidgetEnqueteItems(
}

function handleSaveItems() {
props.updateConfig({ ...props, items });
const updatedProps = { ...props };

Object.keys(updatedProps).forEach((key: string) => {
if (key.startsWith("options.")) {
// @ts-ignore
delete updatedProps[key];
}
});

props.updateConfig({ ...updatedProps, items });
}


const hasOptions = () => {
switch (form.watch('questionType')) {
case 'multiplechoice':
return true;
case 'multiple':
case 'images':
return true;
default:
return false;
Expand All @@ -321,8 +348,8 @@ export default function WidgetEnqueteItems(
const hasList = () => {
switch (form.watch('questionType')) {
case 'multiplechoice':
return true;
case 'multiple':
case 'images':
return true;
default:
return false;
Expand Down Expand Up @@ -428,7 +455,7 @@ export default function WidgetEnqueteItems(
const currentOption = options.findIndex((option) => option.trigger === selectedOption?.trigger);
const activeOption = currentOption !== -1 ? currentOption : options.length;

return (
return form.watch("questionType") !== "images" ? (
<>
<FormField
control={form.control}
Expand Down Expand Up @@ -497,9 +524,71 @@ export default function WidgetEnqueteItems(
)}
/>
)}
</>
) : (
<>
<ImageUploader
form={form}
project={project as string}
fieldName="imageOptionUpload"
imageLabel="Afbeelding"
allowedTypes={["image/*"]}
onImageUploaded={(imageResult) => {
const image = imageResult ? imageResult.url : '';

form.setValue(`options.${activeOption}.titles.0.image`, image);
form.resetField('imageOptionUpload');
}}
/>

</>
{!!form.getValues(`options.${activeOption}.titles.0.image`) && (
<div style={{ position: 'relative' }}>
<img src={form.getValues(`options.${activeOption}.titles.0.image`)} />
</div>
)}

<FormField
control={form.control}
name={`options.${activeOption}.titles.0.key`}
render={({ field }) => (
<FormItem>
<FormLabel>Titel</FormLabel>
<FormDescription>
Dit veld wordt gebruikt voor de alt tekst van de afbeelding. Dit is nodig voor toegankelijkheid.
De titel wordt ook gebruikt als bijschrift onder de afbeelding, behalve als je de optie selecteert om de titel te verbergen.
</FormDescription>
<Input {...field} />
<FormMessage />
</FormItem>
)}
/>

<FormField
control={form.control}
// @ts-ignore
name={`options.${activeOption}.titles.0.hideLabel`}
render={({field}) => (
<>
<FormItem
style={{
display: 'flex',
alignItems: 'center',
justifyContent: 'flex-start',
flexDirection: 'row',
marginTop: '10px'
}}>
{YesNoSelect(field, props)}
<FormLabel
style={{marginTop: 0, marginLeft: '6px'}}>Titel verbergen?</FormLabel>
<FormMessage/>
</FormItem>
<FormDescription>
Als je deze optie selecteert, wordt de titel van de afbeelding verborgen.
</FormDescription>
</>
)}
/>
</>
);
})()
)}
Expand Down Expand Up @@ -688,7 +777,7 @@ export default function WidgetEnqueteItems(
Informatie blok
</SelectItem>
<SelectItem value="images">
Twee antwoordopties met afbeeldingen
Antwoordopties met afbeeldingen
</SelectItem>
<SelectItem value="multiplechoice">
Multiplechoice
Expand Down Expand Up @@ -804,96 +893,6 @@ export default function WidgetEnqueteItems(
</>
)}

{form.watch('questionType') === 'images' && (
<>
<ImageUploader
form={form}
project={project as string}
fieldName="image1Upload"
imageLabel="Afbeelding 1"
allowedTypes={["image/*"]}
onImageUploaded={(imageResult) => {
const image = imageResult ? imageResult.url : '';

form.setValue("image1", image);
form.resetField('image1Upload');
}}
/>

{!!form.getValues('image1') && (
<div style={{ position: 'relative' }}>
<img src={form.getValues('image1')} />
</div>
)}

<FormField
control={form.control}
name="key1"
render={({ field }) => (
<FormItem>
<FormLabel>Key afbeelding 1</FormLabel>
<Input {...field} />
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="text1"
render={({ field }) => (
<FormItem>
<FormLabel>Titel afbeelding 1</FormLabel>
<Input {...field} />
<FormMessage />
</FormItem>
)}
/>

<ImageUploader
form={form}
project={project as string}
fieldName="image2Upload"
imageLabel="Afbeelding 2"
allowedTypes={["image/*"]}
onImageUploaded={(imageResult) => {
const image = imageResult ? imageResult.url : '';

form.setValue("image2", image);
form.resetField('image2Upload');
}}
/>

{!!form.getValues('image2') && (
<div style={{ position: 'relative' }}>
<img src={form.getValues('image2')} />
</div>
)}

<FormField
control={form.control}
name="key2"
render={({ field }) => (
<FormItem>
<FormLabel>Key afbeelding 2</FormLabel>
<Input {...field} />
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="text2"
render={({ field }) => (
<FormItem>
<FormLabel>Titel afbeelding 2</FormLabel>
<Input {...field} />
<FormMessage />
</FormItem>
)}
/>
</>
)}

{form.watch('questionType') === 'imageUpload' && (
<FormField
control={form.control}
Expand Down
12 changes: 10 additions & 2 deletions apps/admin-server/src/pages/projects/[project]/widgets/resourceform/[id]/items.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -280,8 +280,16 @@ export default function WidgetResourceFormItems(
}

function handleSaveItems() {
console.log(items, props);
props.updateConfig({ ...props, items });
const updatedProps = { ...props };

Object.keys(updatedProps).forEach((key: string) => {
if (key.startsWith("options.")) {
// @ts-ignore
delete updatedProps[key];
}
});

props.updateConfig({ ...updatedProps, items });
}

const hasOptions = () => {
Expand Down
Loading

0 comments on commit 4b6cfeb

Please sign in to comment.