From 079f1c39a9e5234cd5589235ebdbed4632560ca5 Mon Sep 17 00:00:00 2001 From: Jean-Philippe Sirois Date: Mon, 5 Aug 2019 22:01:15 -0400 Subject: [PATCH 1/2] feat: support external resources --- src/components/ResourceHeader/index.tsx | 47 +++++++++++++++++++++--- src/components/ResourceHeader/styles.tsx | 21 +++++++++-- src/templates/languagePost.tsx | 2 + 3 files changed, 60 insertions(+), 10 deletions(-) diff --git a/src/components/ResourceHeader/index.tsx b/src/components/ResourceHeader/index.tsx index 1cfd7ee..965f00f 100644 --- a/src/components/ResourceHeader/index.tsx +++ b/src/components/ResourceHeader/index.tsx @@ -1,4 +1,4 @@ -import React from "react" +import React, { Fragment } from "react" import { StackedAvatars } from "../StackedAvatars" import ChevronUp from "../../icons/chevron-up.svg" @@ -10,6 +10,35 @@ interface ResourceHeaderProps { createdAt: any timeToRead: any recommendedReading: any + externalResources: any +} + +function ExtraLink({ + item, + external = false, +}: { + item: string + external?: boolean +}) { + const Inner = () => ( + + {item} + + ) + + if (external) { + return ( + + + + ) + } + + return ( + + + + ) } export function ResourceHeader({ @@ -18,6 +47,7 @@ export function ResourceHeader({ createdAt, timeToRead, recommendedReading, + externalResources, }: ResourceHeaderProps) { const date = new Date(createdAt) const month = date.toLocaleString("default", { month: "long" }) @@ -44,14 +74,19 @@ export function ResourceHeader({ Recommended reading {recommendedReading.map(item => { - return ( - - {item} - - ) + return })} )} + + {externalResources && ( + + External Resources + {externalResources.map(item => { + return + })} + + )} ) } diff --git a/src/components/ResourceHeader/styles.tsx b/src/components/ResourceHeader/styles.tsx index 2474f28..a73fbe1 100644 --- a/src/components/ResourceHeader/styles.tsx +++ b/src/components/ResourceHeader/styles.tsx @@ -1,4 +1,5 @@ -import styled from "styled-components" +import styled, { css } from "styled-components" +import { Link } from "gatsby" import { fontFamily, modularScale } from "../../design/typography" export const ResourceHeaderWrapper = styled.div` @@ -26,11 +27,15 @@ export const Meta = styled.div` } ` -export const RecommendedReading = styled.div` +const ExtraLinks = styled.div` margin-top: 16px; ` -export const ReadLink = styled.div` +export const RecommendedReading = styled(ExtraLinks)`` + +export const ExternalResources = styled(ExtraLinks)`` + +const extraLink = css` display: flex; align-items: center; color: #04b0a6; @@ -53,6 +58,14 @@ export const ReadLink = styled.div` } ` -export const ReadLinkText = styled.div` +export const ExtraLinkInternal = styled(Link)` + ${extraLink}; +` + +export const ExtraLinkExternal = styled.a` + ${extraLink}; +` + +export const ExtraLinkText = styled.div` text-decoration: underline; ` diff --git a/src/templates/languagePost.tsx b/src/templates/languagePost.tsx index c808d59..c5f1f5d 100644 --- a/src/templates/languagePost.tsx +++ b/src/templates/languagePost.tsx @@ -17,6 +17,7 @@ function LanguagePost({ data }: any) { createdAt={frontmatter.created_at} timeToRead={timeToRead} recommendedReading={frontmatter.recommended_reading} + externalResources={frontmatter.external_resources} /> @@ -41,6 +42,7 @@ export const query = graphql` created_at title recommended_reading + external_resources } timeToRead } From c47190e815b5eb0504dd48ed6fe92c87b100e07b Mon Sep 17 00:00:00 2001 From: Jean-Philippe Sirois Date: Tue, 6 Aug 2019 01:35:21 -0400 Subject: [PATCH 2/2] content: use external resources --- .../php/design-patterns/singleton.md | 30 ++++++------------- 1 file changed, 9 insertions(+), 21 deletions(-) diff --git a/src/content/resources/php/design-patterns/singleton.md b/src/content/resources/php/design-patterns/singleton.md index cb7f3fa..b2e12cb 100644 --- a/src/content/resources/php/design-patterns/singleton.md +++ b/src/content/resources/php/design-patterns/singleton.md @@ -3,6 +3,15 @@ authors: - "supergrecko#3434" created_at: "2019/07/27" title: Singletons +external_resources: + - https://en.wikipedia.org/wiki/Singleton_pattern + - https://phpenthusiast.com/blog/the-singleton-design-pattern-in-php + - https://phptherightway.com/pages/Design-Patterns.html#singleton + - https://www.php.net/manual/en/language.oop5.static.php + - https://www.php.net/manual/en/language.oop5.late-static-bindings.php + - https://en.wikipedia.org/wiki/Static_(keyword) + - https://en.wikipedia.org/wiki/Null_coalescing_operator + - https://www.php.net/manual/en/migration70.new-features.php#migration70.new-features.null-coalesce-op --- A singleton is a class which is only instantiated once during runtime. This is done by keeping a static property containing its instance on the singleton class. @@ -91,24 +100,3 @@ $first->setWord("Banana"); // the test will still pass, because it's a singleton. var_dump($first->getWord() === $second->getWord()); // bool(true) ``` - -## Further Research - -Here's a couple links which will help you understand Singletons better. - -## Singleton Resources: - -- https://en.wikipedia.org/wiki/Singleton_pattern -- https://phpenthusiast.com/blog/the-singleton-design-pattern-in-php -- https://phptherightway.com/pages/Design-Patterns.html#singleton - -## Static Keyword Resources: - -- https://www.php.net/manual/en/language.oop5.static.php -- https://www.php.net/manual/en/language.oop5.late-static-bindings.php -- https://en.wikipedia.org/wiki/Static_(keyword) - -## The Null-Coalescing Operator Resources: - -- https://en.wikipedia.org/wiki/Null_coalescing_operator -- https://www.php.net/manual/en/migration70.new-features.php#migration70.new-features.null-coalesce-op