fix: Dynamically display accepted file types in FileAttachment (#1145)

Author: adriangohjw

apps/studio/src/components/PageEditor/FileAttachment.tsx

@@ -4,10 +4,7 @@ import { FormControl, Skeleton, Text } from "@chakra-ui/react"
 import { Attachment } from "@opengovsg/design-system-react"
 
 import { useImageUpload } from "~/features/editing-experience/components/form-builder/hooks/useImage"
-import {
-  ACCEPTED_FILE_TYPES_MESSAGE,
-  ONE_MB_IN_BYTES,
-} from "~/features/editing-experience/components/form-builder/renderers/controls/constants"
+import { ONE_MB_IN_BYTES } from "~/features/editing-experience/components/form-builder/renderers/controls/constants"
 import { useUploadAssetMutation } from "~/hooks/useUploadAssetMutation"
 import { getPresignedPutUrlSchema } from "~/schemas/asset"
 
@@ -83,7 +80,7 @@ export const FileAttachment = ({
       <Text textStyle="body-2" textColor="base.content.medium" pt="0.5rem">
         {`Maximum file size: ${maxSizeInBytes / ONE_MB_IN_BYTES} MB`}
         <br />
-        {`Accepted file types: ${ACCEPTED_FILE_TYPES_MESSAGE}`}
+        {`Accepted file types: ${Object.keys(acceptedFileTypes).join(", ")}`}
       </Text>
     </FormControl>
   )