diff --git a/client/layouts/RelatedPatterns.jsx b/client/layouts/RelatedPatterns.jsx new file mode 100644 index 0000000..b29d221 --- /dev/null +++ b/client/layouts/RelatedPatterns.jsx @@ -0,0 +1,19 @@ +import React, { useEffect } from 'react'; + +import CoverCard from '../CoverCard'; + +const RelatedPatterns = ({ patterns }) => { + return ( +
+

Related patterns

+ +
+ { + patterns.map(pattern => ) + } +
+
+ ); +}; + +export default RelatedPatterns; diff --git a/client/patterns/radio-switch/Details.jsx b/client/patterns/radio-switch/Details.jsx index bb671e7..00bdd6a 100644 --- a/client/patterns/radio-switch/Details.jsx +++ b/client/patterns/radio-switch/Details.jsx @@ -1,6 +1,7 @@ import React, { useState } from 'react'; import DetailsLayout from '../../layouts/DetailsLayout'; +import RelatedPatterns from '../../layouts/RelatedPatterns'; import BrowserFrame from '../../placeholders/BrowserFrame'; import SampleCode from '../../SampleCode'; @@ -77,6 +78,7 @@ code={` + ); }; diff --git a/client/patterns/switch/Details.jsx b/client/patterns/switch/Details.jsx index 7d59140..8fa8ffb 100644 --- a/client/patterns/switch/Details.jsx +++ b/client/patterns/switch/Details.jsx @@ -1,6 +1,7 @@ import React, { useState } from 'react'; import DetailsLayout from '../../layouts/DetailsLayout'; +import RelatedPatterns from '../../layouts/RelatedPatterns'; import BrowserFrame from '../../placeholders/BrowserFrame'; import SampleCode from '../../SampleCode'; @@ -67,6 +68,7 @@ code={` } /> + ); };