extenstions now do show

webUI/react/src/App.js

@@ -8,6 +8,7 @@ import {
 import Button from '@material-ui/core/Button';
 import TemporaryDrawer from "./components/TemporaryDrawer";
 import NavBar from "./components/NavBar";
+import ExtensionCard from "./components/ExtensionCard";
 
 
 export default function App() {
@@ -41,7 +42,7 @@ function Extensions() {
             .then(response => response.json())
             .then(data => setExtensions(data));
     } else {
-        mapped = extensions.map(it => <h3>{it.name}</h3>);
+        mapped = extensions.map(it => <ExtensionCard {...it} />);
     }
 
     return <h2>{mapped}</h2>;

webUI/react/src/components/ExtensionCard.jsx

@@ -32,9 +32,11 @@ const useStyles = makeStyles((theme) => ({
     }
 }));
 
-export default function SimpleCard() {
+export default function ExtensionCard(props) {
     const classes = useStyles();
     const bull = <span className={classes.bullet}>•</span>;
+    const {name, lang, versionName, iconUrl} = props
+    const langPress = lang === "all"? "All": lang.toUpperCase()
 
     return (
         <Card>
@@ -43,20 +45,20 @@ export default function SimpleCard() {
                     <Avatar
                         variant="rounded"
                         className={classes.icon}
-                        alt="Madara"
-                        src="https://raw.githubusercontent.com/inorichi/tachiyomi-extensions/repo/icon/tachiyomi-all.fmreader-v1.2.22.png"
+                        alt={name}
+                        src={iconUrl}
                     />
                     <div style={{display:"flex", flexDirection:"column"}}>
                         <Typography variant="h5" component="h2">
-                            Madara
+                            {name}
                         </Typography>
                         <Typography variant="caption" display="block" gutterBottom>
-                            All 1.2.161
+                            {langPress} {versionName}
                         </Typography>
                     </div>
                 </div>
 
-                <Button size="small">install</Button>
+                <Button variant="outlined" >install</Button>
             </CardContent>
         </Card>
     );

webUI/react/src/components/NavBar.jsx

@@ -33,9 +33,8 @@ export default function NavBar() {
                         <MenuIcon/>
                     </IconButton>
                     <Typography variant="h6" className={classes.title}>
-                        News
+                        Tachidesk
                     </Typography>
-                    <Button color="inherit">Login</Button>
                 </Toolbar>
             </AppBar>
             <TemporaryDrawer drawerOpen={drawerOpen} setDrawerOpen={setDrawerOpen}/>