diff --git a/assets/src/App.js b/assets/src/App.js
index 20af220f..640c1022 100644
--- a/assets/src/App.js
+++ b/assets/src/App.js
@@ -1,62 +1,70 @@
 import React from "react";
 import "./App.css"
 import SearchFilterFields from './pages/SearchFilterFields'
 import Footer from './components/layout/Footer'
 import About from "./pages/About"
 import Help from "./pages/Help"
-import {Switch, Route,} from "react-router-dom"
+import DetailCard from "./components/DetailCard"
+import {Switch, Route } from "react-router-dom"
 import Container from '@material-ui/core/Container';
 import Box from '@material-ui/core/Box'
 import Nav from "./components/layout/Nav"
 import { makeStyles } from '@material-ui/core/styles';
+import Journal from "./components/Journal";
+import DetailsCard from "./components/DetailCard";
 
 const useStyles = makeStyles((theme) => ({
   root: {
     flexGrow: 1,
   }
 }));
 
 function App () {
 const classes = useStyles();
     return(
      
         
     <div className={classes.root}>
   
     
     <Nav />
  
   
    
     <Switch>
     
-        <Route exact path="/about" component={About} />
-        <Route exact path="/help" component={Help} />
-        <Route exact path='/api' component={() => { 
+        <Route  path="/about" exact component={About} />
+        <Route  path="/help" exact component={Help} />
+        <Route  path='/api' exact component={() => { 
               window.location.href = '/api/';
                 return null;
           }}/>
-          <Route exact path='/login' component={() => { 
+          <Route  path='/login' exact component={() => { 
               window.location.href = '/admin/';
                 return null;
           }}/>
-        <Route exact path="/">
-          <SearchFilterFields />
-        </Route>
+        <Route path="/" component={SearchFilterFields} />
+        {/* <Route path="/check" component={DetailsCard} />
+        
+        
+        <Route path="/:check/:checkName/:checkId" component={Journal} /> */}
+         
+       
+       
         
     </Switch>
     <Box style={{ marginTop: "8rem"}}>
       <Footer />
     </Box>
     
     </div>
 
     
 
 
     )
     
   
 }
 
 export default App
\ No newline at end of file
diff --git a/assets/src/components/DetailCard.js b/assets/src/components/DetailCard.js
index 98c05a05..4ed286b9 100644
--- a/assets/src/components/DetailCard.js
+++ b/assets/src/components/DetailCard.js
@@ -1,330 +1,343 @@
-import React, {useContext} from "react"
+import React, {useEffect} from "react"
 
 import { makeStyles } from '@material-ui/core/styles';
 import "./detailscard.css"
 import Typography from '@material-ui/core/Typography';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import Card from '@material-ui/core/Card';
 import CardActions from '@material-ui/core/CardActions';
 import CardContent from '@material-ui/core/CardContent';
 import Button from '@material-ui/core/Button';
 import { HiLink } from "react-icons/hi";
 import DoneIcon from '@material-ui/icons/Done';
 import WarningIcon from '@material-ui/icons/Warning';
 import "./termcard.css"
 import { BsUnlock } from "react-icons/bs";
 import { GrDiamond } from "react-icons/gr";
 import Chip from '@material-ui/core/Chip';
 import ClearSharpIcon from '@material-ui/icons/ClearSharp';
 
 
 
+// import {
+//   useHistory
+// } from "react-router-dom";
+
 const useStyles = makeStyles((theme) => ({
   root: {
     '& > *': {
 
       margin: theme.spacing(1),
       display: 'grid',
     },
     flexGrow: 1,
   },
 
   formControl: {
     margin: theme.spacing(1),
     width: 200,
   },
   selectEmpty: {
     marginTop: theme.spacing(1),
   },
 
 chip: {
   margin: 0.5,
   
 },
 
 heading: {
   fontSize: theme.typography.pxToRem(15),
   fontWeight: theme.typography.fontWeightRegular,
 },
 
 }));
 
-
 function DetailsCard({details}) {
-    const classes = useStyles();
+  // const history = useHistory();
+  // console.log(history)
+
+  // useEffect(() => {
+  //   history.push({pathname:`/check`, search : `id=${details.id},name=${details.name}`})
+  // }, [])
+ 
 
+  
+    const classes = useStyles();
 
 
+  
 
   
  
 if (details !== 'null') {
 
   console.log(details)
+  
 
   return (
 
 <div>
 
     <Card className="detail-Card">
       <CardContent>
       {details.end_year && 
       <Typography className={classes.title} color="textSecondary" gutterBottom
       style={{backgroundColor:"lightgrey", text:"white"}}
       >
             <WarningIcon /> Inactive!
 
             {details.starting_year && 
             <div>
               <p>From {details.starting_year} to {details.end_year}</p>
               </div>
             }
             </Typography>
       }
         <Typography className={classes.title} color="textSecondary" gutterBottom>
         <h4>{details.name}</h4>
         {details.issn && details.issn.map(item => {
          return (
      
         item.issn_type === 1 ?
       
         
         <p>ISSN Print :{item.issn} </p>
       
         : item.issn_type === 2 ?
         <p>ISSN Electronic: {item.issn}</p>
         :<p>ISSN Other: {item.issn}</p>
          )
         })}
 
         {details.publisher && details.publisher.map(item => {
         return <div key={item.id}> <div > 
         <Button href={item.website} target="blank" rel="noopener noreferrer" size="small"><HiLink/>Publisher: {item.name}</Button>
         <Button href={item.oa_policies} target="blank" rel="noopener noreferrer" size="small"><HiLink/>Publisher policies</Button>
       </div></div>
         })}
         </Typography>
         <Typography variant="h5" component="h2">
        
           
         </Typography>
         <Typography className={classes.pos} color="textSecondary">
         
         {details.country && details.country.map(item => {
         return <div key={item.id}>{item.name}</div>;
         })}
         
         {!details.end_year &&
         <div>
           Since {details.starting_year}
         </div>
 
         }
        
         </Typography>
         
         <Typography variant="body2" component="p"
         style={{ textAlign: "left"}}
         >
         {details.oa_status ?
         <div>
           {details.oa_status.status !== "UNKNOWN" ? 
           <div>
             { 
               details.oa_status.status === "Gold" ?
                   <p>
                   <abbr title={details.oa_status.description}>
                    
                    Open Acces Status: 
                             <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                                 <Chip
                                       size="small"
                                       avatar={ <BsUnlock />}
                                       label={details.oa_status.status}
                                       className={classes.chip}
                                       style={{ background: "#FFD700", textAlign: "left"}}
                                       // title="Licence Information"
                                   />
                               </Button>
                   </abbr>
                   </p>
               : details.oa_status.status === "Diamond" ?
                   <>
 
 
                   <abbr title={details.oa_status.description}>
                   Open Acces Status: 
                       <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                           <Chip
                                 size="small"
                                 avatar={ <GrDiamond />}
                                 label={details.oa_status.status}
                                 className={classes.chip}
                                 style={{ background: "#B9F2FF", textAlign: "left"}}
                                 // title="Licence Information"
                             />
                         </Button>
                   
                   {/* {details.oa_status.status}  */}
                   
                   </abbr>
                   </>
               :details.oa_status.status === "Full" ?
                   <p>
                   <abbr title={details.oa_status.description}>
                   Open Acces Status: 
                             <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                                 <Chip
                                       size="small"
                                       avatar={ <BsUnlock />}
                                       label={details.oa_status.status}
                                       className={classes.chip}
                                       style={{ background: "#ADD8E6", textAlign: "left"}}
                                       // title="Licence Information"
                                   />
                               </Button>
                   </abbr>
                   </p>
               :details.oa_status.status === "hybrid" ?
                   <p>
                   <abbr title={details.oa_status.description}>
                   Open Acces Status: 
                             <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                                 <Chip
                                       size="small"
                                       avatar={ <BsUnlock />}
                                       label={details.oa_status.status}
                                       className={classes.chip}
                                       style={{ background: "#cfcdaa", textAlign: "left"}}
                                       // title="Licence Information"
                                   />
                               </Button>
                   </abbr>
                   </p>
               :details.oa_status.status === "Green" ?
                   <p>
                   <abbr title={details.oa_status.description}>
                   Open Acces Status: 
                             <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                                 <Chip
                                       size="small"
                                       avatar={ <BsUnlock />}
                                       label={details.oa_status.status}
                                       className={classes.chip}
                                       style={{ background: "#DAF7A6", textAlign: "left"}}
                                       // title="Licence Information"
                                   />
                               </Button>
                   </abbr>
                   </p>
               :details.oa_status.status === "none" ?
                   <p>
                   <abbr title={details.oa_status.description}>
                   Open Acces Status:
                   <Button href="{i.website}" target="blank" rel="noopener noreferrer" size="small">
                                 <Chip
                                       size="small"
                                       avatar={ <ClearSharpIcon />}
                                       label={details.oa_status.status}
                                       className={classes.chip}
                                       style={{ background: "#FF7F7F", textAlign: "left"}}
                                       // title="Licence Information"
                                   />
                               </Button>
                   </abbr>
                   </p>
               :null
 
             }
           </div>
           
           :null}
         </div>
         :null}
         
         </Typography>
         {details.language && 
           details.language.map(item =>(
 
               <Typography variant="body2" component="p"
               style={{ textAlign: "left"}}
               >
               
               <p><small>Language: {item.name}</small></p>
               </Typography>
 
 
             ))
           
        
         }
 
 
 
         <Typography variant="body2" component="p"
         style={{ textAlign: "left"}}
         >
         {details.doaj_seal && 
         <div >
         <Button href="https://doaj.org/apply/seal/" target="blank" rel="noopener noreferrer" size="small"><DoneIcon/> DOAJ seal</Button>
         </div>
         }
         {details.doaj_status && 
         
         <div > 
           <Button 
           href="https://doaj.org/search/journals?source=%7B%22query%22%3A%7B%22match_all%22%3A%7B%7D%7D%2C%22size%22%3A50%2C%22sort%22%3A%5B%7B%22created_date%22%3A%7B%22order%22%3A%22desc%22%7D%7D%5D%7D" 
           target="blank" rel="noopener noreferrer" size="small"><DoneIcon/>Listed on DOAJ</Button>
           </div>
         }
         {details.lockss &&
         <div > 
           <Button href="https://www.lockss.org/" target="blank" rel="noopener noreferrer" size="small"><DoneIcon/>Preserved with LOCKSS</Button>
         </div>
         }
         {details.portico && 
         <div > 
         <Button href="https://www.portico.org/" target="blank" rel="noopener noreferrer" size="small"><DoneIcon/>Preserved with Portico</Button>
       </div>
         }
         
         {details.nlch && 
          <div > 
          <Button href="https://consortium.ch/nationallizenzen/?lang=en" target="blank" rel="noopener noreferrer" size="small"><DoneIcon/>Swiss National licences</Button>
        </div>
         }
         {details.qoam_av_score && 
         <div > 
         <Button href="https://www.qoam.eu/" target="blank" rel="noopener noreferrer" size="small"><HiLink/>QOAM score : {details.qoam_av_score}</Button>
       </div>
         }
 
         </Typography>
          
       </CardContent>
       <CardActions>
       {details.website ?
         <Button href={details.website} target="blank" rel="noopener noreferrer" size="small"><HiLink/> Website </Button>
       :null}
         {details.oa_options ? 
           <Button href={details.oa_options} target="blank" rel="noopener noreferrer" size="small"><HiLink/>Open Access Infos</Button>
         :null}
       </CardActions>
     </Card>
   
   
-  
-
+    
+    
 </div>
       )
-
+      
     }
 
     else {
       return null
     }
 
     
 }
 
 export default DetailsCard
\ No newline at end of file
diff --git a/assets/src/components/Journal.js b/assets/src/components/Journal.js
index 38dd3df4..389bb752 100644
--- a/assets/src/components/Journal.js
+++ b/assets/src/components/Journal.js
@@ -1,19 +1,25 @@
 import React from "react"
+import {Redirect } from "react-router-dom"
 
+import {
+  useLocation
+} from "react-router-dom";
 
-function Journal({journ}) {
-   
 
-  console.log(journ)
 
-  const name = journ.name
-  
-    return (
-      <main >
 
-        <h1>{name}</h1>
-      </main>
+  function Journal(props) {
+    console.log(useLocation())
+    const { params } = props.match;
+    return (
+      <div>
+        <h4>Demo page!</h4>
+        <div><b>Parameter 1: </b>{params.checkName}</div>
+        <div><b>Parameter 2: </b>{params.checkId}</div>
+      </div>
     )
-}
+  }
+  
+
 
 export default Journal
\ No newline at end of file
diff --git a/assets/src/components/TermCard.js b/assets/src/components/TermCard.js
index 47405333..8f6ab46c 100644
--- a/assets/src/components/TermCard.js
+++ b/assets/src/components/TermCard.js
@@ -1,258 +1,258 @@
 import React from "react"
 import { makeStyles } from '@material-ui/core/styles';
 import "./termcard.css"
 import Chip from '@material-ui/core/Chip';
 import DoneIcon from '@material-ui/icons/Done';
 import HighlightOffIcon from '@material-ui/icons/HighlightOff';
 import Accordion from '@material-ui/core/Accordion';
 import AccordionSummary from '@material-ui/core/AccordionSummary';
 import AccordionDetails from '@material-ui/core/AccordionDetails';
 import Typography from '@material-ui/core/Typography';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import DateRangeIcon from '@material-ui/icons/DateRange';
 import { FaCoins } from 'react-icons/fa';
 import { RiFilePaper2Line } from 'react-icons/ri';
 import Button from '@material-ui/core/Button';
 import { HiLink } from "react-icons/hi";
 import { GrInfo } from "react-icons/gr";
 import Container from '@material-ui/core/Container'
 import Grid from '@material-ui/core/Grid'
 import Card from '@material-ui/core/Card';
 import CardActions from '@material-ui/core/CardActions';
 import CardContent from '@material-ui/core/CardContent';
 
 
 const useStyles = makeStyles((theme) =>({
   
   card: {
       width: '100%',
       marginTop: "1rem",
       textAlign:'left'
       
       
   },
   root: {
     flexGrow: 1,
     textAlign:'left',
   },
 
   chip: {
     margin: 0.5,
     
   },
   
   heading: {
     fontSize: theme.typography.pxToRem(15),
     fontWeight: theme.typography.fontWeightRegular,
   },
 
 }))
 
 
 
 
 function TermCard({term}) {
 
     const classes = useStyles();
 
 
     const licenceIcon =
     
     term[0].licence?.map(i=>(
       <> 
       <Button href={i.website} target="blank" rel="noopener noreferrer" size="small">
         <Chip
               size="small"
               avatar={ <RiFilePaper2Line />}
               label={i.name_or_abbrev}
               // clickable={handleClick}
               // color="secondary"
               // onDelete={handleDelete}
               className={classes.chip}
               style={{ background: "#FFFFFF", textAlign: "left"}}
               title="Licence Information"
           />
         </Button>
       </>
     ))
   
 
     
         function cost() {
           
             
           const price = term[0].cost_factor?.map(i => (
             i.amount
           ))
           const price_symbol = term[0].cost_factor?.map(j => (
             j.symbol
           ))
           const cost_name = term[0].cost_factor?.map(k => (
 
             k.cost_factor_type.name
           ))
 
           const id = term[0].cost_factor?.map(k => (
 
             k.cost_factor_type.id
           ))
          
             const comment = term[0].cost_factor?.map(k => (
 
             
               
               k.comment
                
               
               ))
               
           
             return (
               <>
               <Chip
                 key={id[0]}
                 size="small"
                 avatar={  <FaCoins />}
                 label={cost_name[0] + " : " + price[0] +  " " + price_symbol}
                 // clickable={handleClick}
                 // color="secondary"
                 // onDelete={handleDelete}
                 className={classes.chip}
                 style={{ background: "#FFFFFF"}}
                 title={comment}
               />
               
               </>
             )
             
       
   
         }
 
         const termArchive = term[0].ir_archiving && term[0].ir_archiving ? (
         
           <Chip
                 size="small"
                 avatar={<DoneIcon />}
                 label={"IR Archiving"}
                 // variant="outlined"
                 // clickable={handleClick}
                 // color="secondary"
                 // onDelete={handleDelete}
-                style={{ background: "#FFFFFF"}}
+                style={{ background: "#DAF7A6"}}
                 title="This is more information"
             />
            
             
             ): (
        
             <Chip
                 size="small"
                 avatar={<HighlightOffIcon />}
                 label="IR Archiving"
                 // clickable={handleClick}
                 // color="secondary"
                 // onDelete={handleDelete}
                 style={{ background: "#f50057"}}
                 title="This is more information"
             />
             )
             const embargo = term[0].ir_archiving && term[0].ir_archiving ? (
             
             <Chip
                 size="small"
                 avatar={<DateRangeIcon />}
                 label={"Embargo: " + term[0].embargo_months + " Month(s)"}
                 // variant="outlined"
                 // clickable={handleClick}
                 // color="secondary"
                 // onDelete={handleDelete}
                 style={{ background: "#FFFFFF"}}
                 title="This is more information"
             />
             ):
             (<a />)
         
 
     return (
       <div>
     
       <Card key={term.id} className="term-Card"
       style={{ textAlign: "left"}}
       >
       <CardContent>
         <Typography className={classes.title} color="textSecondary" gutterBottom>
         {term.map( j=> (
              j[0] &&
              <>
               <p>Condition set N° {j[0]}: {j[1]}</p>
               <p><small>Condition type: {j[2].condition_issuer}</small></p>
               </>
         ))
         }
         Term ID: {term[0].id}
         
         
         </Typography>
         <Typography variant="h5" component="h2">
        
           
         </Typography>
         <Typography className={classes.pos} color="textSecondary">
         
      
         
         </Typography>
         <Typography variant="body2" component="p">
         <Container maxWidth="xs" >
          <Grid container>
   
       
           <Grid item xs={6} sm={2}>
           
           {cost()}
           {licenceIcon}
           {termArchive}
           {embargo}
          
           </Grid>
           </Grid>
           </Container>
         
           <div 
           style={{ marginTop: "1rem"}}
           >
           {term[0].comment ?
           <div style={{ textAlign: "left"}}>
          
           <p>
           <small>
           <GrInfo 
           style={{ 
             padding: "0.05rem"
           }}
           />
           {term[0].comment}
           </small>
           </p>
           
          
           </div>
           :null}
          </div>
         
 
       </Typography>
       </CardContent>
       <CardActions>
           {term[0].source ?
             <Button href={term[0].source} target="blank" rel="noopener noreferrer" size="small"><HiLink/> More Information </Button>
           :null}
       </CardActions>
     </Card>
       
     </div>
     )
 }
 
 export default TermCard
\ No newline at end of file
diff --git a/assets/src/pages/SearchFilterFields.js b/assets/src/pages/SearchFilterFields.js
index 8027cad3..c543f099 100644
--- a/assets/src/pages/SearchFilterFields.js
+++ b/assets/src/pages/SearchFilterFields.js
@@ -1,719 +1,770 @@
 import React, {useContext, useState, useEffect} from 'react';
 import "./SearchFilterFields.css"
 import { makeStyles } from '@material-ui/core/styles';
 import Button from '@material-ui/core/Button';
 import FormControl from '@material-ui/core/FormControl';
 import TextField from '@material-ui/core/TextField';
 import Autocomplete from '@material-ui/lab/Autocomplete';
 import { searchCondi, searchorganizationonly, searchjournalonly, searchInstitFunder, searchCondi3 } from '../services/requests/Condition'
 import {getJournal} from '../services/requests/Journal'
 import {getFunder} from '../services/requests/Funder'
 import {getInstitution} from '../services/requests/Institution'
 import Accordion from '@material-ui/core/Accordion';
 import AccordionSummary from '@material-ui/core/AccordionSummary';
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
 import Typography from '@material-ui/core/Typography';
 import AccordionDetails from '@material-ui/core/AccordionDetails';
 import Grid from '@material-ui/core/Grid'
 import Box from '@material-ui/core/Box'
 import Container from '@material-ui/core/Container';
 
-
 import {Context} from "../Context"
 
 
 import ResultCard from  "../components/ResultCard"
 import DetailCard from  "../components/DetailCard"
 
 
 import CircularProgress from '@material-ui/core/CircularProgress'
 
+import {
+  useHistory
+} from "react-router-dom";
 
 const useStyles = makeStyles((theme) => ({
   root: {
     flexGrow: 1,
   },
   // selectEmpty: {
   //   marginTop: theme.spacing(2),
   // },
 
 //   card: {
 //     width: '100%',
 //     marginTop: "1rem",
     
     
 // },
 
 chip: {
   margin: 0.5,
   
 },
 
 // heading: {
 //   fontSize: theme.typography.pxToRem(15),
 //   fontWeight: theme.typography.fontWeightRegular,
 // },
 
 }));
 
 export default function SearchFilterFields() {
+
+  const history = useHistory();
+  console.log(history)
+
+ 
+  
+ 
   const classes = useStyles();
 
   //call the custom hook for listing field with api
 
   const { getSelectedInstitId,
           getSelectedJournalId,
           getSelectedFunderId,
           institList, 
           journalList,
           funderList,
           institId,
           journalId,
           funderId,
           setInstitId, 
           setJournalId,
           setFunderId,
           institName,
           journalName,
           funderName,
         } 
           = useContext(Context)
   
 
   //responses
   const [conditions, setConditions] = useState([]);
   const [details, setDetails] = useState([]);
   const [result, updateResult] = useState([]);
   const [loading, setLoading] = useState(false);
   
   useEffect(() => {
    setDetails('null')
   }, [])
   
   // clear teh usestate
   // const clear = () => {
   //   setState((prev) => new Map(prev.clear()));
   // }
  
 
   
   function handleInstit(e, newInputValue) { 
   
    if (newInputValue){
     getSelectedInstitId(newInputValue)
     return
 
    }
    setInstitId("")
 
   }
   
   function handleFunder(e, newInputValue) {
     console.log(newInputValue)
     if (newInputValue){
     getSelectedFunderId(newInputValue)
     return
     }
     setFunderId("")
   }
 
   function handleJournal(e, newInputValue) {
     
     if (newInputValue){
       getSelectedJournalId(newInputValue)
       return
      }
      setJournalId("")     
   }
 
 function handleSubmit(e) {
   setLoading(true)
   e.preventDefault()
   
   //reset precedent results
   setConditions([])
   setDetails([])
   updateResult([])
 
 
   if (!institId && !journalId && !funderId){
     setLoading(false)
     
   }
 
   if (institId && !journalId && !funderId){
   //get organizations conditions
   // alert(`get api organization Condition only: ${institId}`)
   //condtion type is not journal only = 1
   // Get the user
   
     const sendSearchInstitOnly =
     async () => {
       
           try {
             
             
               const resp = await searchorganizationonly(institId,1)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
               
               
               
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     
           
     }
     
     console.log(details)
 
     const sendGetrequest =
     async () => {
           try {
               const resp = await getInstitution(institId)
               console.log(resp.data)
               updateResult(arr => [...arr, resp.data])
               // if (details === "null") {
               //   setDetails(resp.data)
               // }
               // else {
               //   setDetails(prevArray => [...prevArray, resp.data])
               // }
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           
     }
       sendSearchInstitOnly().then(
         sendGetrequest()
       )
-
+      history.push({pathname:`/check/Instiution`, search : `id=${institId}`})
   }
 
   else if (!institId && !journalId && funderId){
     //get funder conditions
     // alert(`get api funder Condition only: ${funderId}`)
     //condtion type is not journal only = 1
 
     const sendSearchOrgaOnly =
     async () => {
           try {
               const resp = await searchorganizationonly(funderId,1)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     }
     
     const sendGetrequest =
     async () => {
           try {
               const resp = await getFunder(funderId)
               console.log(resp.data)
               updateResult(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
     }
   
   sendSearchOrgaOnly().then(
     sendGetrequest()
   )
-  
+  history.push({pathname:`/check/Funder`, search : `id=${funderId}`})
   }
   else if (!funderId && !institId && journalId){
     //get journals conditions
     // alert(`get api journal Condition only: ${journalId}`)
     //condtion type is not institution only = 2
     //get journal detail
 
     const sendSearchJournalOnly =
     async () => {
           try {
               const resp = await searchjournalonly(journalId,2)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
               // setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
 
     }
     
     const sendGetrequest =
     async () => {
           try {
               const resp = await getJournal(journalId)
               console.log(resp.data)
               updateResult(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           
     }
 
   sendSearchJournalOnly().then(
     sendGetrequest()
   )
-     
+  history.push({pathname:`/check/Journal`, search : `id=${journalId}`})
   }
   
   else if (institId && funderId && !journalId) {
     //alert(`get api Filter Conditions SET--> Journal: ${journalId} VS Institution: ${institId}`)
     //condtion type journal/condition = 3
     const sendSearchCondi =
     async () => {
           try {
               const resp = await searchInstitFunder(institId, funderId, 1)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     }
    
     const sendGetInstit =
     async () => {
           try {
               const resp = await getInstitution(institId)
               console.log(resp.data)
               // detailArray.push(resp.data)
               // setDetails(detailArray)
               updateResult(arr => [...arr, resp.data])
              
               
               
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
     }
     const sendGetFunder =
       async () => {
         try {
             const resp = await getFunder(funderId)
             console.log(resp.data)
             
             updateResult(arr => [...arr, resp.data])
             
         } catch (err) {
             // Handle Error Here
             console.error(err);
         }
         
       }
     sendSearchCondi().then(
       sendGetInstit().then(sendGetFunder())
     )
 
-  
+    history.push({pathname:`/check/Instit&Funder`, search : `id=${institId}&id=${funderId}`})
   }
   else if (institId && journalId && !funderId) {
     //alert(`get api Filter Conditions SET--> Journal: ${journalId} VS Institution: ${institId}`)
     //condtion type journal/condition = 3
     const sendSearchCondi =
     async () => {
           try {
               const resp = await searchCondi(journalId,institId)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     }
    
     const sendGetJournal =
     async () => {
           try {
               const resp = await getJournal(journalId)
               console.log(resp.data)
               // detailArray.push(resp.data)
               // setDetails(detailArray)
               updateResult(arr => [...arr, resp.data])
              
               
               
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
     }
     const sendGetInstit =
       async () => {
         try {
             const resp = await getInstitution(institId)
             console.log(resp.data)
             
             updateResult(arr => [...arr, resp.data])
             
         } catch (err) {
             // Handle Error Here
             console.error(err);
         }
         
       }
     sendSearchCondi().then(
       sendGetJournal().then(sendGetInstit())
     )
 
-  
+    history.push({pathname:`/check/Instit&Journal`, search : `id=${institId}&id=${journalId}`})
   }
   else if (!institId && journalId && funderId) {
     // alert(`get api Filter Conditions SET--> Journal: ${journalId} VS Institution: ${funderId}`)
     //condtion type journal/institution/funder conditions = 3
 
     const sendGetCondi =
     async () => {
           try {
               const resp = await searchCondi(journalId,funderId)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     }
 
 
     const sendGetJournal =
     async () => {
           try {
               const resp = await getJournal(journalId)
               console.log(resp.data)
               updateResult(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
     }
     const sendGetFunder =
       async () => {
         try {
             const resp = await getFunder(funderId)
             console.log(resp.data)
             updateResult(arr => [...arr, resp.data])
         } catch (err) {
             // Handle Error Here
             console.error(err);
         }
       }
     
     
     sendGetCondi().then(
       sendGetJournal().then(
         sendGetFunder()
       )
     )
+    history.push({pathname:`/check/Funder&Journal`, search : `id=${funderId}&id=${journalId}`})
   }
   else if (institId && journalId && funderId) {
     // alert(`get api Filter Conditions SET--> Journal: ${journalId} VS Institution: ${funderId}`)
     //condtion type journal/institution/funder conditions = 3
     console.log("main check !")
     //(institution + journal)
     const detailArray = []
 
     const sendGetCondi =
     async () => {
           try {
               const resp = await searchCondi3(institId,journalId,funderId)
               console.log(resp.data)
               setConditions(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
           setLoading(false)
     }
     const sendGetJournal =
     async () => {
           try {
               const resp = await getJournal(journalId)
               console.log(resp.data)
               updateResult(arr => [...arr, resp.data])
           } catch (err) {
               // Handle Error Here
               console.error(err);
           }
     }
     const sendGetFunder =
       async () => {
         try {
             const resp = await getFunder(funderId)
             console.log(resp.data)
             updateResult(arr => [...arr, resp.data])
         } catch (err) {
             // Handle Error Here
             console.error(err);
         }
       }
 
       const sendGetInstit =
       async () => {
         try {
             const resp = await getInstitution(institId)
             console.log(resp.data)
             detailArray.push(resp.data)
             updateResult(arr => [...arr, resp.data])
             
         } catch (err) {
             // Handle Error Here
             console.error(err);
         }
       }
     
     
     // sendGetCondi1().then(sendGetCondi2())
 
     sendGetCondi()
       sendGetJournal().then(
         sendGetFunder().then(
           sendGetInstit()
         )
       )
-    
+      history.push({pathname:`/check/Instit&Funder&Journal`, search : `id=${institId}&id=${funderId}&id=${journalId}`})
   }
   
   
   // alert(`Submit Institution: ID: ${institId} , Submit Funder: ${fund}, Submit Journal ID: ${journalId}`)
 }
 
 // const conditionIdArray = []
 // conditions.map((item) =>(
 // conditionIdArray.push(item.id)
 //     ))
 
 // console.log(conditionIdArray)
 
 console.log(`all conditions SET: ${conditions}`)
 console.log(details)
 
 console.log(`Selected Institution ID: ${institId} , Selected Funder: ${funderId}, Selected Journal ID: ${journalId}`)
 
 
 
 function detailsResult() {
 
+
+  
   
 
 if (details !== 'null') {
+  
 
   return (
+    
+
     <div className={classes.root} >
       
  
 
                   <Accordion style={{ marginBottom: "2rem"}}>
                   <AccordionSummary
                     expandIcon={<ExpandMoreIcon />}
                     aria-controls="panel1a-content"
                     id="panel1a-header"
                   >
                  
                     <Typography className={classes.heading}>
                       
                     <p>Selected option(s)</p>
                     
                     </Typography>
                   
                    
                   </AccordionSummary>
                   <Container maxWidth="xl" >
                   <Grid container spacing={0.5} direction="row">
        
                   
                   {result?.map(i => (
                   
                   <Grid key={i.id} item>
                  
                    <AccordionDetails>
-                   
                   
+                 
+
+                  {/* { journalId && 
+                 
+                   <Redirect
+                    to={{
+                      pathname: `/check/`,
+                      search: `?journal=${journalId}`,
+                      state: {details : {i}}
+                    }}
+                    />
+                    
+                  } */}
+                  {/* { institId && 
+                   <Redirect
+                    to={{
+                      pathname: `/check/`,
+                      search: `?instit=${institId}`,
+                      state: {details : {i}}
+                    }}
+                    />
+                  }
+                  { funderId && 
+                   <Redirect
+                    to={{
+                      pathname: `/check/`,
+                      search: `?instit=${funderId}`,
+                      state: {details : {i}}
+                    }}
+                    />
+                  }
+                  </Switch>
+                  </Router> */}
+
+
                   <DetailCard  details={i}/>
+                  
+                 
                  
                   </AccordionDetails>
                
                   </Grid>
     
                   ))}
                   </Grid>
                   </Container>
               
                 
                   </Accordion>
-                  
+        
           
   </div>
   )
   }
 }
 
 function conditionResults () {
 
   return (
     <div className={classes.root} >
     {conditions?.map(i=> (
 
     
      <ResultCard  result={i}/>
    
     ))}
     </div>
   )
 
 }
   return (
     <Box>
     <div className={classes.root}>
     <Container maxWidth="xl" >
     <Grid container spacing={1} direction="row">
       
         <form className={classes.root} style={{ marginTop: "8rem"}}  noValidate autoComplete="on" onSubmit={handleSubmit} color="inherit">
         
         
             <FormControl  className="form-input" style={{ width: 340}}>
               <Autocomplete
                   freeSolo
                   selectOnFocus
                   clearOnBlur
                   id="institution"
                   options={institList.map((option) => option.name)}
                   renderOption={(params) => (
                     <a style={{ textAlign: "left"}}>{params}</a>
                   )}
                   
                   // getOptionLabel={(option) => option.name}
                   // filterOptions={filterOptions}
                   onInputChange={handleInstit}
                   renderInput={(params) => (
                     <TextField
                         {...params}
                         label="Swiss Institutions"
                         // margin="normal"
                         value={institId}
                         variant="outlined"
   
         
                         
                     />
                     )}
               />
             </FormControl>
           
          
 
          
            
             <FormControl className="form-input" style={{ width: 340}}>
               <Autocomplete
                 freeSolo
                 id="funder"
                 options={funderList.map((option) => option.name)}
                 renderOption={(params) => (
                   <a style={{ textAlign: "left"}}>{params}</a>
                 )}
                 onInputChange={handleFunder}
                 renderInput={(params) => (
                   <TextField
                       {...params}
                       label="Funder"
                       // margin="normal"
                       value={funderId}
                       variant="outlined"
                   />
                   )}
                 />
               </FormControl>
               
          
         
 
          
          
             <FormControl className="form-input" style={{ width: 340}}>
             
               <Autocomplete
                 freeSolo
                 id="journal"
                 options={journalList.map((option) => option.name)}
                 renderOption={(params) => (
                   <a style={{ textAlign: "left"}}>{params}</a>
                 )}
                 onInputChange={handleJournal}
                 renderInput={(params) => (
                   <TextField
                       {...params}
                       label="Journal"
                       // margin="normal"
                       value={journalId}
                       variant="outlined"
                   />
                   )}
                 />
               </FormControl>
         
             
            
             <FormControl className="form-input" style={{ width: 340}}>
             
                         {!loading && 
                       
                       
                             <Button
                             className="App-btn"
                             variant="contained" 
                             type="submit"
                             >
                                     Check
                               </Button>
                           }
                         {loading && 
                       <Button
                       className="App-btn"
                       variant="contained" 
                       type="submit"
                       disabled
                       
                       >
                         < CircularProgress 
                         color="white"
                         />
                               Checking...
                         </Button>
                     }
             </FormControl>
           
            
           
           </form>
           </Grid>
           </Container>
         
       <Container maxWidth="xl" >
             
               {detailsResult()}
       
               {conditionResults()}
              
       
       </Container>
     
    </div>
    </Box>
   );
 }
\ No newline at end of file