TrizTech/ohif-viewer
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui(migrate) Migrate local view to new ui-next components (#4850)

Browse Source
This commit is contained in:
Dan Rukas 2025-03-17 11:05:11 -04:00 committed by GitHub
parent f916b2f40e
commit 951c21fda8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 19 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
platform/app/src/routes/Local/Local.tsx
View File

@ -8,8 +8,7 @@ import filesToStudies from './filesToStudies';
import { extensionManager } from '../../App'; import { extensionManager } from '../../App';
import { Button } from '@ohif/ui'; import { Button, Icons } from '@ohif/ui-next';
import { Icons } from '@ohif/ui-next';
const getLoadButton = (onDrop, text, isDir) => { const getLoadButton = (onDrop, text, isDir) => {
return ( return (
@ -20,11 +19,9 @@ const getLoadButton = (onDrop, text, isDir) => {
{({ getRootProps, getInputProps }) => ( {({ getRootProps, getInputProps }) => (
<div {...getRootProps()}> <div {...getRootProps()}>
<Button <Button
rounded="full" variant="default"
variant="contained" // outlined className="w-28"
disabled={false} disabled={false}
endIcon={<Icons.LaunchArrow />}
className={classnames('font-medium', 'ml-2')}
onClick={() => {}} onClick={() => {}}
> >
{text} {text}
@ -33,9 +30,13 @@ const getLoadButton = (onDrop, text, isDir) => {
{...getInputProps()} {...getInputProps()}
webkitdirectory="true" webkitdirectory="true"
mozdirectory="true" mozdirectory="true"
style={{ display: 'none' }}
/> />
) : ( ) : (
<input {...getInputProps()} /> <input
{...getInputProps()}
style={{ display: 'none' }}
/>
)} )}
</Button> </Button>
</div> </div>
@ -131,29 +132,29 @@ function Local({ modePath }: LocalProps) {
style={{ width: '100%', height: '100%' }} style={{ width: '100%', height: '100%' }}
> >
<div className="flex h-screen w-screen items-center justify-center"> <div className="flex h-screen w-screen items-center justify-center">
<div className="bg-secondary-dark mx-auto space-y-2 rounded-lg py-8 px-8 drop-shadow-md"> <div className="bg-muted border-primary/60 mx-auto space-y-2 rounded-xl border border-dashed py-12 px-12 drop-shadow-md">
<div className="flex items-center justify-center"> <div className="flex items-center justify-center">
<Icons.OHIFLogoColorDarkBackground className="h-28" /> <Icons.OHIFLogoColorDarkBackground className="h-18" />
</div> </div>
<div className="space-y-2 pt-4 text-center"> <div className="space-y-2 py-6 text-center">
{dropInitiated ? ( {dropInitiated ? (
<div className="flex flex-col items-center justify-center pt-48"> <div className="flex flex-col items-center justify-center pt-12">
<LoadingIndicatorProgress className={'h-full w-full bg-black'} /> <LoadingIndicatorProgress className={'h-full w-full bg-black'} />
</div> </div>
) : ( ) : (
<div className="space-y-2"> <div className="space-y-2">
<p className="text-base text-blue-300"> <p className="text-primary pt-0 text-xl">
Note: You data is not uploaded to any server, it will stay in your local Drag and drop your DICOM files & folders here <br />
browser application to load them locally.
</p> </p>
<p className="text-xg text-primary-active pt-6 font-semibold"> <p className="text-muted-foreground text-base">
Drag and Drop DICOM files here to load them in the Viewer Note: Your data remains locally within your browser
<br /> and is never uploaded to any server.
</p> </p>
<p className="text-lg text-blue-300">Or click to </p>
</div> </div>
)} )}
</div> </div>
<div className="flex justify-around pt-4"> <div className="flex justify-center gap-2 pt-4">
{getLoadButton(onDrop, 'Load files', false)} {getLoadButton(onDrop, 'Load files', false)}
{getLoadButton(onDrop, 'Load folders', true)} {getLoadButton(onDrop, 'Load folders', true)}
</div> </div>