feat: add tile pictures

AirWalk-Digital · Jan 5, 2024 · 755e026 · 755e026
1 parent cf75860
commit 755e026
Show file tree

Hide file tree

Showing 10 changed files with 167 additions and 110 deletions.
diff --git a/components/buttons/Tiles.js b/components/buttons/Tiles.js
@@ -5,9 +5,20 @@ import { CardActionArea } from '@mui/material';
 
 export function Tile({ name, url, image, description='', isHero=false }) {
   return (
-    <Grid item xs={12} sm={6} md={4} lg={3} sx={{ mb: '20px', display: 'flex' }}>
-      <Link href={url} underline="none" sx={{ width: '100%' }}>
-      <Card variant="outlined" sx={{ minHeight: 120, maxWidth: 345, bgcolor: image ? 'background.paper' : 'background.primary' }} >
+    <Grid item xs={6} sm={6} md={4} lg={3}> 
+     {/* sx={{ mb: '20px', display: 'flex', flex: 1 }}> */}
+      <Link 
+        href={url} 
+        underline="none" 
+        sx={{ 
+          width: '100%', 
+          color: 'inherit',
+          '&:visited': {
+            color: 'inherit',
+          }
+        }}
+      >     
+       <Card variant="outlined" sx={{ minHeight: 120, bgcolor: image ? 'background.paper' : 'background.primary' }} >
       <CardActionArea>
         { image && <div style={{height:"194px"}}><CardMedia
           component="img"

diff --git a/components/layouts/IndexView.jsx b/components/layouts/IndexView.jsx
@@ -20,7 +20,7 @@ export function IndexView({
   menuStructure,
   title,
   menuComponent,
-  initialContext,
+  initialContext = null,
   loading
 }) {
 
@@ -75,7 +75,7 @@ export function IndexView({
       ><Box sx={{ px: '5%' }}>
           <Typography variant="h1" component="h1">{title}</Typography>
           <Container maxWidth="lg" sx={{ maxHeight: '100vh', mt: '2%' }}>
-            <Grid container spacing={2} alignItems="stretch">
+            <Grid container spacing={2} alignItems="stretch" justifyContent="space-between">
               {tiles ? (
                 tiles.map((c, i) => (
                   <Tile
@@ -84,9 +84,11 @@ export function IndexView({
                     url={c?.file}
                     isHero={c?.frontmatter?.hero}
                     image={
-                      c?.frontmatter?.image
+                      c?.frontmatter?.hero && c?.frontmatter?.image != null
                         ? `/api/content/github/${siteConfig.content[initialContext.path].owner}/${siteConfig.content[initialContext.path].repo}?path=${path.dirname(c.file)}/${c.frontmatter.image}&branch=${siteConfig.content[initialContext.path].branch}`
-                        : null
+                        : c?.frontmatter?.hero
+                        ? '/generic-solution.png'
+                        : c?.frontmatter?.image ? `/api/content/github/${siteConfig.content[initialContext.path].owner}/${siteConfig.content[initialContext.path].repo}?path=${path.dirname(c.file)}/${c.frontmatter.image}&branch=${siteConfig.content[initialContext.path].branch}` : null
                     }
                   />
                 ))) : (

diff --git a/lib/content/menuContent.js b/lib/content/menuContent.js
@@ -41,7 +41,7 @@ export async function getFrontMatter(config) {
         true,
         ".md*"
     );
-
+        console.log('[Menu][getFrontMatter]files : ', files)
 
     const filesPromises = files.map((file) => {
         return getFileContent(config.owner, config.repo, config.branch, file.path, file.sha)

diff --git a/lib/github/index.js b/lib/github/index.js
@@ -95,7 +95,25 @@ export async function getFileContent(owner, repo, branch, path, sha = null) {
   if (sha) {  // if the SHA is passed, this is a specific revision of a file.
     if (cachedContent) {
       console.info('[Github][Read][HIT/Sha]:', cacheKey, ' sha:', sha)
-      return cachedContent;
+      if (cachedContent && cachedContent.encoding) {
+        console.info('[Github][Cached/Sha][HIT/cachedRefContent]:', cachedContent)
+        // console.info('[Github][Cached/Sha][HIT/Sha]:', cacheKey, ' ref:', ref.ref)
+        if (!cachedContent.encoding === 'none')  {
+          return cachedContent.content.data.toString(cachedContent.encoding);
+        } else {
+          if (cachedContent.content.type === 'Buffer') {
+            return Buffer.from(cachedContent.content.data, 'binary');
+          }
+        }
+      } else if (cachedContent ) {
+
+      } else {
+        console.info("[Github][Cached/Sha][MISS]:", cacheKey);
+      }
+
+
+
+      return cachedContent.content.data;
     } else {
       console.info("[Github][Read][MISS/Sha]:", cacheKey, " sha:", sha);
     }
@@ -123,7 +141,6 @@ export async function getFileContent(owner, repo, branch, path, sha = null) {
             if (cachedRefContent.content.type === 'Buffer') {
               return Buffer.from(cachedRefContent.content.data, 'binary');
             }
-
           }
         } else if (cachedRefContent ) {
 
@@ -132,7 +149,7 @@ export async function getFileContent(owner, repo, branch, path, sha = null) {
         }
       } else {
         // console.info('[Github][Read][HIT/Branch]:', cacheKey)
-        return cachedContent;
+        return cachedContent.content.data;
       }
     } catch (error) {
-Original file line number
+Diff line change
@@ Expand Up / @@ -41,7 +41,7 @@ export async function getFrontMatter(config) { @@
             true,
             ".md*"
         );
+            console.log('[Menu][getFrontMatter]files : ', files)
         const filesPromises = files.map((file) => {
             return getFileContent(config.owner, config.repo, config.branch, file.path, file.sha)
@@ Expand Down @@