diff --git a/frontend/demo/component/upload/react/upload-all-files.tsx b/frontend/demo/component/upload/react/upload-all-files.tsx index 4d861964b0..1dbda5429f 100644 --- a/frontend/demo/component/upload/react/upload-all-files.tsx +++ b/frontend/demo/component/upload/react/upload-all-files.tsx @@ -1,7 +1,7 @@ import { reactExample } from 'Frontend/demo/react-example'; // hidden-source-line -import React, { useEffect, useRef } from 'react'; +import React, { useRef } from 'react'; import { useSignals } from '@preact/signals-react/runtime'; // hidden-source-line -import { useComputed } from '@vaadin/hilla-react-signals'; +import { useComputed, useSignal } from '@vaadin/hilla-react-signals'; import { Button } from '@vaadin/react-components/Button.js'; import { Upload, type UploadElement } from '@vaadin/react-components/Upload.js'; import { createFakeFilesUploadAllFiles } from './upload-demo-mock-files'; // hidden-source-line @@ -9,21 +9,18 @@ import { createFakeFilesUploadAllFiles } from './upload-demo-mock-files'; // hid function Example() { useSignals(); // hidden-source-line const uploadRef = useRef(null); - - useEffect(() => { - if (!uploadRef.current) { - return; - } - uploadRef.current.i18n.addFiles.many = 'Select Files...'; - uploadRef.current.i18n = { ...uploadRef.current.i18n }; - }, [uploadRef.current]); + const uploadI18n = useSignal({ + addFiles: { + many: 'Select Files...', + }, + }); const files = useComputed(createFakeFilesUploadAllFiles); return ( <> {/* tag::snippet[] */} - +