Correctly wrap content in pre tag so it doesn't overflow

Author: DaneEveritt

resources/scripts/components/elements/activity/ActivityLogMetaButton.tsx

@@ -9,7 +9,11 @@ export default ({ meta }: { meta: Record<string, unknown> }) => {
     return (
         <div className={'self-center md:px-4'}>
             <Dialog open={open} onClose={() => setOpen(false)} hideCloseIcon title={'Metadata'}>
-                <pre className={'bg-gray-900 rounded p-2 overflow-x-scroll font-mono text-sm leading-relaxed'}>
+                <pre
+                    className={
+                        'bg-gray-900 rounded p-2 font-mono text-sm leading-relaxed overflow-x-scroll whitespace-pre-wrap'
+                    }
+                >
                     {JSON.stringify(meta, null, 2)}
                 </pre>
                 <Dialog.Footer>