@@ -6,15 +6,9 @@ import isEmpty from "lodash/isEmpty"
66import datasetManagerCognito from "udt-dataset-managers/dist/CognitoDatasetManager"
77import useAuth from "../../utils/auth-handlers/use-auth"
88import { Grid , TextField } from "@material-ui/core"
9+ import { useTranslation } from "react-i18next"
910const redText = { color : "orange" }
1011
11- const expandedAnnotationsColumns = [
12- { name : "Annotations" , selector : "annotation" } ,
13- { name : "Last Modified" , selector : "lastModified" , sortable : true } ,
14- ]
15-
16- const columns = [ { name : "Projects" , selector : "folder" , sortable : true } ]
17-
1812const customStyles = {
1913 headCells : {
2014 style : {
@@ -29,31 +23,6 @@ const customStyles = {
2923 } ,
3024}
3125
32- const ExpandedRow = ( { data } ) => {
33- const { rowAnnotations } = data
34- return (
35- < >
36- < DataTable
37- style = { {
38- boxSizing : "border-box" ,
39- paddingLeft : "50px" ,
40- paddingRight : "10px" ,
41- } }
42- dense
43- striped
44- noHeader
45- columns = { expandedAnnotationsColumns }
46- data = { rowAnnotations }
47- noDataComponent = 'Make sure the project has "samples" folder'
48- pagination = { rowAnnotations . length > 10 }
49- paginationPerPage = { 10 }
50- paginationRowsPerPageOptions = { [ 10 , 20 , 25 , 50 , 100 , 200 ] }
51- customStyles = { customStyles }
52- />
53- </ >
54- )
55- }
56-
5726export default ( { open, onClose } ) => {
5827 const [ dm , setDm ] = useState ( )
5928 const { authConfig } = useAuth ( )
@@ -62,6 +31,36 @@ export default ({ open, onClose }) => {
6231 const [ nameProjectToCreate , setNameProjectToCreate ] = useState ( "" )
6332 const [ nameProjectExist , setNameProjectExist ] = useState ( false )
6433 const [ currentDataset , setCurrentDataset ] = useState ( )
34+ const { t } = useTranslation ( )
35+ const columns = [ { name : t ( "projects" ) , selector : "folder" , sortable : true } ]
36+ const expandedAnnotationsColumns = [
37+ { name : t ( "annotations" ) , selector : "annotation" } ,
38+ { name : t ( "last-modified" ) , selector : "lastModified" , sortable : true } ,
39+ ]
40+ const ExpandedRow = ( { data } ) => {
41+ const { rowAnnotations } = data
42+ return (
43+ < >
44+ < DataTable
45+ style = { {
46+ boxSizing : "border-box" ,
47+ paddingLeft : "50px" ,
48+ paddingRight : "10px" ,
49+ } }
50+ dense
51+ striped
52+ noHeader
53+ columns = { expandedAnnotationsColumns }
54+ data = { rowAnnotations }
55+ noDataComponent = { t ( "has-samples-folder" ) }
56+ pagination = { rowAnnotations . length > 10 }
57+ paginationPerPage = { 10 }
58+ paginationRowsPerPageOptions = { [ 10 , 20 , 25 , 50 , 100 , 200 ] }
59+ customStyles = { customStyles }
60+ />
61+ </ >
62+ )
63+ }
6564
6665 const getCurrentDataset = async ( ) => {
6766 if ( currentDataset ) return currentDataset
@@ -143,12 +142,12 @@ export default ({ open, onClose }) => {
143142
144143 return (
145144 < SimpleDialog
146- title = "Export Project"
145+ title = { t ( "export-project" ) }
147146 open = { open }
148147 onClose = { onClose }
149148 actions = { [
150149 {
151- text : "Create project",
150+ text : t ( "create- project") ,
152151 onClick : ( ) => {
153152 handleCreateProject ( )
154153 } ,
@@ -159,18 +158,15 @@ export default ({ open, onClose }) => {
159158 < Grid container spacing = { 0 } >
160159 < Grid container item xs = { 12 } spacing = { 0 } justify = "center" >
161160 { nameProjectExist ? (
162- < p style = { redText } >
163- Warning : This project name already exist. If you continue the
164- existing project with the same name will be replaced
165- </ p >
161+ < p style = { redText } > { t ( "warning-project-exist" ) } </ p >
166162 ) : (
167163 < p > </ p >
168164 ) }
169165 </ Grid >
170166 < Grid container item xs = { 12 } spacing = { 0 } justify = "center" >
171167 < TextField
172168 id = "ProjectName"
173- label = "Project Name"
169+ label = { t ( "project-name" ) }
174170 variant = "outlined"
175171 onChange = { ( event ) => {
176172 setNameProjectToCreate ( event . target . value )
0 commit comments