Fix text overflows through out the front end (#2406)

resources/scripts/components/server/files/FileObjectRow.tsx

@@ -69,7 +69,7 @@ const FileObjectRow = ({ file }: { file: FileObject }) => (
                     <FontAwesomeIcon icon={faFolder}/>
                 }
             </div>
-            <div css={tw`flex-1`}>
+            <div css={tw`flex-1 break-all`}>
                 {file.name}
             </div>
             {file.isFile &&

resources/scripts/components/server/files/NewDirectoryButton.tsx

@@ -88,7 +88,7 @@ export default ({ className }: WithClassname) => {
                                 name={'directoryName'}
                                 label={'Directory Name'}
                             />
-                            <p css={tw`text-xs mt-2 text-neutral-400`}>
+                            <p css={tw`text-xs mt-2 text-neutral-400 break-all`}>
                                 <span css={tw`text-neutral-200`}>This directory will be created as</span>
                                 &nbsp;/home/container/
                                 <span css={tw`text-cyan-200`}>