chore: cleanup showcase

IpoLa · Jun 19, 2022 · 7704a96 · 7704a96
1 parent c2a2231
commit 7704a96
Show file tree

Hide file tree

Showing 10 changed files with 136 additions and 328 deletions.
diff --git a/configs/showcase.json b/configs/showcase.json
@@ -609,92 +609,6 @@
       "type": "tools"
     }
   ],
-  "articles": [
-    {
-      "name": "How ChakraUI complements your existing web development skills",
-      "description": null,
-      "url": "https://dominik.sumer.dev/blog/chakra-complements-webdevs",
-      "image": "showcases/articles/How-ChakraUI-complements-your-existing-web-development-skills.png",
-      "type": "articles"
-    },
-    {
-      "name": "Accessibility on-demand with Chakra-ui and focus-visible",
-      "description": null,
-      "url": "https://medium.com/@keeganfamouss/accessibility-on-demand-with-chakra-ui-and-focus-visible-19413b1bc6f9",
-      "image": "showcases/articles/Accessibility-on-demand-with-Chakra-ui-and-focus-visible.png",
-      "type": "articles"
-    },
-    {
-      "name": "Build a Landing Page with Chakra UI",
-      "description": null,
-      "url": "https://raptis.wtf/blog/build-a-landing-page-with-chakra-ui-part-1/",
-      "image": "showcases/articles/Build-a-Landing-Page-with-Chakra-UI.png",
-      "type": "articles"
-    },
-    {
-      "name": "Customisations with Chakra UI",
-      "description": null,
-      "url": "https://www.easyreact.com/articles/chakra-ui-customisations",
-      "image": "showcases/articles/Customisations-with-Chakra-UI.png",
-      "type": "articles"
-    },
-    {
-      "name": "Chakra UI and React-Hook-Form – How to Build Beautiful Forms",
-      "description": null,
-      "url": "https://www.freecodecamp.org/news/how-to-use-react-hook-form-with-chakra-ui/",
-      "image": "showcases/articles/Chakra-UI-and-React-Hook-Form-–-How-to-Build-Beautiful-Forms.png",
-      "type": "articles"
-    },
-    {
-      "name": "Truncating Text using Chakra UI",
-      "description": null,
-      "url": "https://dev.to/estheragbaje/how-to-truncate-text-using-chakra-ui-4mpj",
-      "image": "showcases/articles/Truncating-Text-using-Chakra-UI.png",
-      "type": "articles"
-    },
-    {
-      "name": "How to Set Up Chakra UI with Next JS by creating a Hero component",
-      "description": "",
-      "url": "https://creativedesignsguru.com/chakra-ui-next-js/",
-      "image": "showcases/articles/How-to-Set-Up-Chakra-UI-with-Next-JS-by-creating-a-Hero-component.png",
-      "type": "articles"
-    },
-    {
-      "name": "Choosing the right component library for your design system: MUI vs Chakra",
-      "description": "",
-      "url": "https://engineering.udacity.com/choosing-the-right-component-library-for-your-design-system-mui-vs-chakra-45c4c949d150",
-      "image": "showcases/articles/Choosing-the-right-component-library-for-your-design-system-MUI-vs-Chakra.png",
-      "type": "articles"
-    },
-    {
-      "name": "I have created Web Gallery app using Reactjs , WebRTC and Chakra UI",
-      "description": "",
-      "url": "https://dev.to/harshmangalam/i-have-created-web-gallery-app-using-reactjs-webrtc-and-chakra-ui-5cfn",
-      "image": "showcases/articles/I-have-created-Web-Gallery-app-using-Reactjs-,-WebRTC-and-Chakra-UI.png",
-      "type": "articles"
-    },
-    {
-      "name": "Track user location coordinates realtime using geolocation api, nextjs , nodejs and socket.io",
-      "description": "",
-      "url": "https://dev.to/harshmangalam/track-user-location-coordinates-realtime-using-geolocation-api-nextjs-nodejs-and-socket-io-2nf3",
-      "image": "showcases/articles/Track-user-location-coordinates-realtime-using-geolocation-api,-nextjs-,-nodejs-and-socket.io.png",
-      "type": "articles"
-    },
-    {
-      "name": "Setup Nextjs , Apollo client and Chakra UI for your upcomming projects",
-      "description": "",
-      "url": "https://dev.to/harshmangalam/setup-nextjs-apollo-client-and-chakra-ui-for-your-upcomming-projects-10ja",
-      "image": "showcases/articles/Setup-Nextjs-,-Apollo-client-and-Chakra-UI-for-your-upcomming-projects.png",
-      "type": "articles"
-    },
-    {
-      "name": "Image Uploading using golang and react",
-      "description": "",
-      "url": "https://dev.to/harshmangalam/image-upload-using-golang-and-react-29n1",
-      "image": "showcases/articles/Image-Uploading-using-golang-and-react.png",
-      "type": "articles"
-    }
-  ],
   "videos": [
     {
       "name": "Getting Started with Chakra UI",
@@ -746,4 +660,4 @@
       "type": "videos"
     }
   ]
-}
+}
diff --git a/i18n/ui.json b/i18n/ui.json
@@ -212,11 +212,11 @@
   },
   "showcase": {
     "seo": {
-      "title": "Chakra UI Showcase",
-      "description": "A showcase for sharing beautiful websites that are built in Chakra-UI"
+      "title": "Showcase",
+      "description": "A collection of beautiful websites that are built in Chakra UI"
     },
     "title": "Showcase",
-    "message": "Meet Websites Built with Chakra UI",
+    "message": "A collection of beautiful websites that are built in Chakra UI",
     "submit-project-button-title": "Submit your project"
   }
 }
diff --git a/layouts/index.tsx b/layouts/index.tsx
@@ -8,7 +8,13 @@ export const MDXLayout = dynamic(() => import('./mdx'))
 const TutorialLayout = dynamic(() => import('./tutorial'))
 const ComponentLayout = dynamic(() => import('./component'))
 
-export default function DefaultLayout({ children, frontMatter }) {
+export default function Layout(props: {
+  children: React.ReactNode
+  frontMatter: any
+  hideToc?: boolean
+  maxWidth?: string
+}) {
+  const { children, frontMatter, hideToc, maxWidth } = props
   const slug = frontMatter?.slug
 
   const layoutMap = {
@@ -24,7 +30,13 @@ export default function DefaultLayout({ children, frontMatter }) {
       <TutorialLayout frontmatter={frontMatter}>{children}</TutorialLayout>
     ),
     default: (
-      <PageContainer frontmatter={frontMatter}>{children}</PageContainer>
+      <PageContainer
+        frontmatter={frontMatter}
+        hideToc={hideToc}
+        maxWidth={maxWidth}
+      >
+        {children}
+      </PageContainer>
     ),
   }
 

diff --git a/pages/index.tsx b/pages/index.tsx
@@ -37,7 +37,7 @@ import { Footer } from 'components/footer'
 import Header from 'components/header'
 import SandpackEmbed from 'components/sandpack-embed'
 import SEO from 'components/seo'
-import ShowcaseSection from 'components/showcase/showcase-section'
+import ShowcaseSection from 'components/showcase-section'
 import TweetCard from 'components/tweet-card'
 import { App, Index } from 'configs/sandpack-contents/homepage/files'
 import tweets from 'configs/tweets.json'