ww

photo/src/ImageList.js

@@ -77,15 +77,29 @@ const useStyles = makeStyles((theme) => ({
     },
 }));
 var Imagesrc = "";
+var FabL = false;
+var FabR = false;
 
 export default function TitlebarGridList() {
     const classes = useStyles();
 
     const [Imageopen, setImageOpen] = React.useState(false);
 
+    const TDLength = tileData.length;
 
-    const handleClick = (letter) => () => {
-        Imagesrc = letter;
+    const handleClick = (index) => () => {
+        Imagesrc = tileData[index].img;
+        if (index == 0) {
+            FabL = false;
+        } else {
+            FabL = true;
+        }
+        if (TDLength == index + 1) {
+            FabR = false;
+        } else {
+            FabR = true;
+        }
+        console.log(FabL + " " + FabR);
         setImageOpen(true);
     }
 
@@ -99,8 +113,8 @@ export default function TitlebarGridList() {
                 <GridListTile key="Subheader" cols={5} style={{ height: 'auto' }}>
                     <ListSubheader component="div">December</ListSubheader>
                 </GridListTile>
-                {tileData.map((tile) => (
-                    <GridListTile key={tile.img} onClick={handleClick(tile.img)}>
+                {tileData.map((tile, index) => (
+                    <GridListTile key={tile.img} onClick={handleClick(index)}>
                         <img src={tile.img} alt={tile.title} />
                     </GridListTile>
                 ))}
@@ -151,14 +165,14 @@ export default function TitlebarGridList() {
                                     </Grid>
 
                                 </Grid>
-
-
-                                <Fab color="inherit" aria-label="add" className={classes.fabL}>
+                                {FabL === true ? <Fab color="inherit" aria-label="add" className={classes.fabL}>
                                     <ArrowBackIosIcon />
-                                </Fab>
-                                <Fab color="inherit" aria-label="add" className={classes.fabR}>
+                                </Fab> : ""}
+                                {console.log(FabL + " " + FabR)}
+                                
+                                {FabR === true ? <Fab color="inherit" aria-label="add" className={classes.fabR}>
                                     <ArrowForwardIosIcon />
-                                </Fab>
+                                </Fab> : ""}
                             </Grid>
                             <Grid item xs={3}>
                                 <Typography component="h5">