4 added fixes and new features (#234)

* added the Youtube API

* remove one of the node

* fix

* added a and b

* added new nodes

* added data to MDX provider

* link for youtube chanel

* added the swiper to the videos page

* slider

* added button for the swiper

* added the colections of video for tutorial page

* addde slider buttons

* added data for comunity page

* update slides

* update slider

* rewrite node-config

* remove unused code

* added lists for community

* fix bug

* remove unused packege

* install axios

* removed files and fix linter bugs

* added files to the env

* add dotenv

* added fix linter

* triger rbuild

* update data

* adedd descriptions for the playlists, positioned thumbnail on the center of the blog item

* test thumbnail for linkedIn

* test seo

* added hubspot script

* added the correct tracker for hubspot chat

* added the contributors profile

* test-1

* fix

* test-2

* resolve problem with thumbnail

* createt own youtube channel for test scheduled video

* adedd changes

* added logo

* added slider for personal references

* added form.html as static file

* removed the old form

* add modal for the references into the personal profile page

* check error on the community page when scheduled video was created

* fix renge

* added https protocol

* remove the logo from the front page, added the right logo, increase the size of the title for videos sections, added the additional spacing between the videos collections

---------

Co-authored-by: VHromyk <65778221+VHromyk@users.noreply.github.com>
Co-authored-by: Viktor <vmoskalev@smart-ui.pro>
Co-authored-by: Denny Lee <denny.g.lee@gmail.com>

gatsby-node.js

@@ -84,9 +84,9 @@ const matchedArrByPlaylistId = (arr1, arr2) => {
 };
 
 const createListIdForEachSection = async () => {
-  const list = await getSectionLists();
+  const playlistsDividedBySection = await getSectionLists();
 
-  const arr = list
+  const arr = playlistsDividedBySection
     ?.filter((el) => el.contentDetails)
     .map((item) => ({
       type: item.snippet.type,
@@ -98,6 +98,7 @@ const createListIdForEachSection = async () => {
     .filter((item) => item.sectionTitle === "Techniques and Tutorials")
     .map((el) => el.playlists)
     .flat();
+
   const videosPlaylist = arr
     .filter((el) => el.type === "singleplaylist")
     .map((item) => item.playlists)
@@ -110,9 +111,20 @@ const createListIdForEachSection = async () => {
 };
 
 const dataForSeparatedSection = async (playListsAll, playlistType) => {
-  const promisesList = playlistType.map((playlistId) =>
-    videoListByPlayListId(playlistId)
-  );
+  // if we do not have dividing for section and do not have playlistType
+
+  let promisesList;
+
+  if (playlistType.length > 0) {
+    promisesList = playlistType.map((playlistId) =>
+      videoListByPlayListId(playlistId)
+    );
+  } else {
+    promisesList = playListsAll
+      .map((item) => item.playlistId)
+      .map((playlistId) => videoListByPlayListId(playlistId));
+  }
+
   const [...data] = await Promise.all(promisesList);
 
   const collectionVideos = data.map((item) => item.data.items);
@@ -147,6 +159,7 @@ const getVideoListPromise = async () => {
     playListsAll,
     playlistForSection.videosPlaylist
   );
+
   const tutorialsList = dataForSeparatedSection(
     playListsAll,
     playlistForSection.tutorialPlaylists

src/blog/2022-12-13-sagemaker-emr-delta-lake/index.mdx

@@ -1,7 +1,7 @@
 ---
 title: Building a more efficient data infrastructure for machine learning with Open Source using Delta Lake, Amazon SageMaker, and EMR
 description: In this blog, we’ll explore how connecting Delta Lake, Amazon SageMaker Studio, and Amazon EMR can simplify the end-to-end workflow required to support data engineering and data science projects.
-thumbnail: ./image0.png
+thumbnail: ./thumbnail.png
 author: Vedant Jain, Denny Lee
 ---
 

src/components/Logo.jsx

@@ -0,0 +1,16 @@
+import { StaticImage } from "gatsby-plugin-image";
+import * as React from "react";
+import styled from "styled-components";
+
+const LogoWrapper = styled.div`
+  margin: 0 auto 1.2rem;
+  width: 150px;
+`;
+
+const Logo = () => (
+  <LogoWrapper>
+    <StaticImage src="../images/delta-lake-logo.png" alt="logo" />
+  </LogoWrapper>
+);
+
+export default Logo;

src/components/SEO.jsx

@@ -16,35 +16,34 @@ const query = graphql`
 `;
 
 const SEO = (props) => {
-  const { title, description, thumbnailPath, pageIndex, children } = props;
+  const { title, description, thumbnailPath, pageIndex, children, slug } =
+    props;
 
   const { site } = useStaticQuery(query);
 
   const documentTitle = `${
     pageIndex > 1 ? `${title} - Page ${pageIndex}` : title
   } | ${site.siteMetadata.title}`;
 
+  const image = `${site.siteMetadata.siteUrl}${thumbnailPath}`;
+  const url = `${site.siteMetadata.siteUrl}${slug}`;
+
   return (
     <>
       <title>{documentTitle}</title>
-      <meta name="name" content={documentTitle} />
-      <meta
-        name="image"
-        property="og:image"
-        content={`${site.siteMetadata.siteUrl}${thumbnailPath}`}
-      />
-      {description && <meta name="description" content={description} />}
+      <meta name="description" content={description} />
+      <meta name="image" content={image} />
       <meta property="og:title" content={title} />
-      {description && <meta property="og:description" content={description} />}
-      <meta name="og:type" property="website" />
+      <meta property="og:description" content={description} />
+      <meta name="image" property="og:image" content={image} />
+      <meta property="og:url" content={url} />
+      <meta name="og:type" property="article" />
       <meta name="twitter:card" content="summary" />
       <meta name="twitter:creator" content={site.siteMetadata.twitter} />
+      <meta name="twitter:image" content={image} />
+      <meta name="twitter:url" content={url} />
       <meta name="twitter:title" content={title} />
-      <meta
-        name="twitter:image"
-        content={`${site.siteMetadata.siteUrl}${thumbnailPath}`}
-      />
-      {description && <meta name="twitter:description" content={description} />}
+      <meta name="twitter:description" content={description} />
       {children}
     </>
   );
@@ -54,13 +53,15 @@ SEO.defaultProps = {
   pageIndex: 0,
   description: "",
   thumbnailPath: undefined,
+  slug: "",
 };
 
 SEO.propTypes = {
   title: string.isRequired,
   description: string,
   thumbnailPath: string,
   pageIndex: number,
+  slug: string,
 };
 
 export default SEO;