From 0358480432ef1a0aea940e004abe558b1fafaa0c Mon Sep 17 00:00:00 2001 From: kristinegusta Date: Wed, 30 Aug 2023 11:16:12 +0200 Subject: [PATCH] Handle variables in summary section' --- dist/index.cjs | 2 +- dist/index.cjs.map | 2 +- dist/index.modern.js | 34 +++++++++++++++++----------------- dist/index.modern.js.map | 2 +- dist/index.module.js | 2 +- dist/index.module.js.map | 2 +- dist/index.umd.js | 2 +- dist/index.umd.js.map | 2 +- package.json | 2 +- src/SummarySection.jsx | 5 ++--- 10 files changed, 27 insertions(+), 28 deletions(-) diff --git a/dist/index.cjs b/dist/index.cjs index bb72410..62777c9 100644 --- a/dist/index.cjs +++ b/dist/index.cjs @@ -1,2 +1,2 @@ -var n=require("react"),e=require("styled-components"),t=require("react-router-dom"),r=require("react-content-loader");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var a=/*#__PURE__*/i(e);function o(n,e){return e||(e=n.slice(0)),n.raw=e,n}var l,u,d,c,s,f,m,p,g,x,b,w,y,v="(min-width: 525px)",k="(min-width: 768px)",A="(min-width: 1024px)",z="(min-width: 1440px)",S="(min-width: 2560px)",F=function(n){return h(Fragment,null,h(_,{textAlign:n.textAlign},n.subtitle),h(j,{textAlign:n.textAlign},n.title),h(C,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},_=a.default.h4(l||(l=o(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),j=a.default.h2(u||(u=o(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},A,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),C=a.default.div(d||(d=o(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),k),M=function(n){return h(T,{className:n.name,color:n.color,border:n.border},h(q,null,n.children))},T=a.default.div(c||(c=o(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},z,S),q=a.default.div(s||(s=o(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),v,k,A,z,S);function D(n){var e,t,r,i=(t=(e=n.date.split("-"))[0],r=e[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(e[1])-1]+" "+Number(r)+", "+t);return h(E,{to:"/blog/"+n.id},h(L,null,h(B,null,h(R,null,n.type),h(G,null,i)),h(J,null,n.title),h(P,null,n.summary)))}var E=a.default(t.Link)(f||(f=o(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),v),L=a.default.div(m||(m=o(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));a.default.div(p||(p=o(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var N,R=a.default.h5(g||(g=o(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),J=a.default.h4(x||(x=o(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),P=a.default.p(b||(b=o(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),B=a.default.div(w||(w=o(["\n display: flex;\n justify-content: space-between;\n"]))),G=a.default.p(y||(y=o(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),H=function(n){return h("section",null,Array.from({length:n.count},function(n,e){return h(r.Code,{key:e,style:{width:"100%",marginTop:"3rem"}})}))};function O(n){return h(I,{size:n.size},n.errorMessage)}var U,I=a.default.div(N||(N=o(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function K(n){return h(V,{to:"/blog",align:n.align},"Read all articles & news")}var Q,V=a.default(t.Link)(U||(U=o(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "}),W=""+window.env.REACT_APP_DATAHUB_HC_URL,X=a.default.div(Q||(Q=o(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),v);exports.SummarySection=function(){var e=n.useState(),t=e[0],r=e[1],i=n.useState(!0),a=i[0],o=i[1],l=n.useState(null),u=l[0],d=l[1];return n.useEffect(function(){return fetch(W+"/help_backend/confluence_documents/blog/label/blog/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new O("Server Error")}).then(function(n){o(!1),r(n)}).catch(function(n){o(!1),d("Oops! Something went wrong. Please try again later.")}),function(){r(),o(!0)}},[]),h(M,{name:"blog"},h(F,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),u?h(O,{errorMessage:u,size:"small"}):a?h(H,{count:1}):h(X,null,t.map(function(n,e){return h(D,{key:e,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(K,{align:"center"}))},exports.Title=F; +var n=require("react"),e=require("styled-components"),t=require("react-router-dom"),r=require("react-content-loader");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var a=/*#__PURE__*/i(e);function o(n,e){return e||(e=n.slice(0)),n.raw=e,n}var l,u,d,c,s,f,m,p,g,x,b,w,y,v="(min-width: 525px)",k="(min-width: 768px)",A="(min-width: 1024px)",z="(min-width: 1440px)",S="(min-width: 2560px)",F=function(n){return h(Fragment,null,h(j,{textAlign:n.textAlign},n.subtitle),h(M,{textAlign:n.textAlign},n.title),h(q,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},j=a.default.h4(l||(l=o(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),M=a.default.h2(u||(u=o(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},A,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),q=a.default.div(d||(d=o(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),k),C=function(n){return h(N,{className:n.name,color:n.color,border:n.border},h(D,null,n.children))},N=a.default.div(c||(c=o(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},z,S),D=a.default.div(s||(s=o(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),v,k,A,z,S);function E(n){var e,t,r,i=(t=(e=n.date.split("-"))[0],r=e[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(e[1])-1]+" "+Number(r)+", "+t);return h(J,{to:"/blog/"+n.id},h(L,null,h(R,null,h(_,null,n.type),h(B,null,i)),h(G,null,n.title),h(O,null,n.summary)))}var J=a.default(t.Link)(f||(f=o(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),v),L=a.default.div(m||(m=o(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));a.default.div(p||(p=o(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var T,_=a.default.h5(g||(g=o(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),G=a.default.h4(x||(x=o(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),O=a.default.p(b||(b=o(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),R=a.default.div(w||(w=o(["\n display: flex;\n justify-content: space-between;\n"]))),B=a.default.p(y||(y=o(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),P=function(n){return h("section",null,Array.from({length:n.count},function(n,e){return h(r.Code,{key:e,style:{width:"100%",marginTop:"3rem"}})}))};function U(n){return h(I,{size:n.size},n.errorMessage)}var H,I=a.default.div(T||(T=o(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function K(n){return h(V,{to:"/blog",align:n.align},"Read all articles & news")}var Q,V=a.default(t.Link)(H||(H=o(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "}),W=a.default.div(Q||(Q=o(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),v);exports.SummarySection=function(){var e=n.useState(),t=e[0],r=e[1],i=n.useState(!0),a=i[0],o=i[1],l=n.useState(null),u=l[0],d=l[1];return n.useEffect(function(){var n;return fetch(n.helpCenterUrl+"/help_backend/confluence_documents/blog/label/"+n.label+"/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new U("Server Error")}).then(function(n){o(!1),r(n)}).catch(function(n){o(!1),d("Oops! Something went wrong. Please try again later.")}),function(){r(),o(!0)}},[]),h(C,{name:"blog"},h(F,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),u?h(U,{errorMessage:u,size:"small"}):a?h(P,{count:1}):h(W,null,t.map(function(n,e){return h(E,{key:e,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(K,{align:"center"}))},exports.Title=F; //# sourceMappingURL=index.cjs.map diff --git a/dist/index.cjs.map b/dist/index.cjs.map index 78a5279..24c59a7 100644 --- a/dist/index.cjs.map +++ b/dist/index.cjs.map @@ -1 +1 @@ -{"version":3,"file":"index.cjs","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx","../src/assets/urls.js"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\nimport { helpCenterUrl } from \"./assets/urls\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = () => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/blog/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n","export const loginUrl = `${window.env.REACT_APP_MDR_URL}/saml2/login/`;\nexport const helpCenterUrl = `${window.env.REACT_APP_DATAHUB_HC_URL}`;\nexport const DataHubServiceDeskTickets = \"https://mumc.atlassian.net/servicedesk/customer/user/requests?page=1&reporter=all&statuses=open\";\nexport const dataHubPortalUrl = `${window.env.REACT_APP_DATAHUB_HOME_URL}`;\nexport const contactUsUrl = `${helpCenterUrl}/support`;\nexport const quickStartUrl = `${helpCenterUrl}/quickstart`;\nexport const CEDARUrl =\n \"https://more.metadatacenter.org/tools-training/cedar-metadata-tools\";\nexport const PIDUrl = `${helpCenterUrl}/access#Detailedguidanceforfindingandaccessingthedatayouneed-PersistentIdentifiers`;\nexport const collectionsUrl = `${quickStartUrl}#QuickstartguidetousingMaastrichtDataRepository-StoreData`;\nexport const privacyPolicyUrl = `${dataHubPortalUrl}/privacy-statement`;\nexport const termsOfServiceUrl = `${dataHubPortalUrl}/terms-of-service`;\nexport const linkedInUrl =\n \"https://www.linkedin.com/company/datahubmaastricht/\";\nexport const gitHubUrl = \"https://github.com/MaastrichtUniversity\";\nexport const emailUrl = \"mailto:datahub@maastrichtuniverstity.nl\";\nexport const emailUrlMUMC = \"mailto:datahub@mumc.nl\";\nexport const phoneUrl = \"tel:0031433872844\";\nexport const DMPUrl = \"https://dmp.datahubmaastricht.nl/\";\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","helpCenterUrl","window","env","REACT_APP_DATAHUB_HC_URL","ArticlesContainer","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","then","response","status","json","result","err","map","article","i","article_type"],"mappings":"yQAAA,cCAAA,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EDSaC,EAEaC,qBAFbD,uBAAAA,EAIL,sBAJKA,EAKJ,sBALIA,EAMaC,sBEXpBC,EAAQ,SAACC,GACb,OACEC,EAAAC,SAAA,KACED,EAACE,EAASC,CAAAA,UAAWJ,EAAMI,WAAYJ,EAAMK,UAC7CJ,EAACK,EAAY,CAACF,UAAWJ,EAAMI,WAAYJ,EAAMO,OACjDN,EAACO,EACER,KAAAA,EAAMS,QACNT,EAAMU,KAAOT,EAAGU,IAAAA,CAAAA,KAAMX,EAAMU,MAAOV,EAAMY,UAAgB,MAIlE,EAIMT,EAAWU,EAAAA,QAAOC,GAAEzB,IAAAA,EAAA0B,qGAGV,SAACf,GAAW,MAAoB,SAApBA,EAAMI,UAAuB,OAAS,QAAQ,GAIpEE,EAAeO,EAAAA,QAAOG,GAAE1B,IAAAA,EAAAyB,EAAA,CAAA,uCAAA,mBAAA,gBAAA,eAAA,mBAAA,cAEd,SAACf,GAAW,MAAoB,SAApBA,EAAMI,UAAuB,OAAS,QAAQ,EAC3D,SAACJ,GAAK,MAA0B,SAApBA,EAAMI,UAAuB,QAAU,OAAO,EAC7D,SAACJ,SACW,SAApBA,EAAMI,UAAuB,eAAiB,oBAAoB,EAC3DP,EACG,SAACG,GAAK,MACM,SAApBA,EAAMI,UAAuB,eAAiB,kBAAkB,GAIhEI,EAAUK,EAAAA,QAAOI,IAAG1B,IAAAA,EAAAwB,EAEflB,CAAAA,8BAAAA,qCAAAA,GCpCLqB,EAAU,SAAHC,GACX,OACElB,EAACmB,GAAQC,UAF2BF,EAAJG,KAENC,MAFIJ,EAALI,MAEeC,OAFIL,EAANK,QAGpCvB,EAACO,OAHoBW,EAARM,UAMnB,EAIML,EAAUP,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,EAAA,CAAA,yBAAA,iBAAA,oBAAA,6EAAA,2CAAA,qCACJ,SAACf,SACH,SAAhBA,EAAMuB,MACF,UACgB,cAAhBvB,EAAMuB,MACN,UACgB,aAAhBvB,EAAMuB,MACN,UACA,OAAO,EAEJ,SAACvB,GAAK,MAAsB,SAAhBA,EAAMuB,MAAmB,QAAU,SAAS,EACnD,SAACvB,GAAK,MACD,QAAjBA,EAAMwB,OAAmB,oBAAsB,MAAM,EAM9C3B,EAGAA,GAKLW,EAAUK,EAAAA,QAAOI,IAAG3B,IAAAA,EAAAyB,EAIflB,CAAAA,uDAAAA,4CAAAA,4CAAAA,6CAAAA,6CAAAA,uCAAAA,EAGAA,EAGAA,EAGAA,EAGAA,GFhDI,SAAS6B,EAAQ1B,GA2B9B,IAPE2B,EAAOC,EAAaC,EAOhBC,GAPGF,GAAPD,EAO+B3B,EAAM+B,KAPCC,MAAM,MAAjC,GAASH,EAAGF,EAAA,GAfR,CACb,UACA,WACA,QACA,QACA,MACA,OACA,OACA,SACA,YACA,UACA,WACA,YAI8BM,OADdN,EAAEE,IAC4B,GAAMI,IAAAA,OACpDJ,GACID,KAAAA,GAkBR,OACE3B,EAACiC,EAAYC,CAAAA,GAAI,SAAWnC,EAAMoC,IAChCnC,EAACoC,OAECpC,EAACqC,EAAM,KACLrC,EAACsC,EAAMvC,KAAAA,EAAMwC,MACbvC,EAACwC,EAAI,KAAEX,IAET7B,EAACF,EAAOC,KAAAA,EAAMO,OACdN,EAACyC,OAAM1C,EAAM2C,UAIrB,CAEO,IAAMT,EAAcrB,EAAM,QAAC+B,OAAP/B,CAAYxB,IAAAA,EAAA0B,EAI5BlB,CAAAA,mGAAAA,uGAAAA,GASLwC,EAAmBxB,EAAAA,QAAOI,IAAG3B,IAAAA,EAAAyB,EAAA,CAAA,qDAKdF,EAAAA,QAAOI,IAAG1B,IAAAA,EAAAwB,EACF,CAAA,gCAAA,kKAAA,SAACf,GAAU,OAAAA,EAAM6C,UAAU,GAQxD,IG3FAxD,EH2FMkD,EAAO1B,UAAOiC,GAAEtD,IAAAA,EAAAuB,EAOrB,CAAA,mKAEKhB,EAAQc,UAAOC,GAAErB,IAAAA,EAAAsB,EAMtB,CAAA,oHACK2B,EAAO7B,EAAAA,QAAOkC,EAACrD,IAAAA,EAAAqB,EAIpB,CAAA,+EAEKuB,EAASzB,EAAAA,QAAOI,IAAGtB,IAAAA,EAAAoB,EAGxB,CAAA,8DACK0B,EAAO5B,EAAM,QAACkC,EAACnD,IAAAA,EAAAmB,EAGpB,CAAA,6DIrHKiC,EAAU,SAAChD,GAAK,OAMpBC,iBACGgD,MAAMC,KAAK,CAAEC,OAAQnD,EAAMoD,OAAS,SAACC,EAAGC,GAAK,OAC5CrD,EAACsD,EAAAA,KAAI,CAACC,IAAKF,EAAOG,MAAO,CAAEC,MAAO,OAAQC,UAAW,SAAY,GAE3D,EDTY,SAAAC,EAAKzC,GAC3B,OAAOlB,EAAC4D,EAAY,CAAC/D,KAD2BqB,EAAJrB,MAAFqB,EAAZ2C,aAEhC,CAEA,IERAzE,EFQMwE,EAAehD,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,EAInB,CAAA,2EAAA,+EAAA,SAACf,GAAK,MAAqB,UAAfA,EAAMF,KAAmB,QAAU,MAAM,GEPzC,SAAAiE,EAAc/D,GACpC,OACEC,EAAC+D,EAAQ7B,CAAAA,GAAG,QAAQ8B,MAAOjE,EAAMiE,OAAO,2BAK5C,CAEA,ICdA5E,EDcM2E,EAAUnD,EAAAA,QAAO+B,EAAAA,KAAP/B,CAAYxB,IAAAA,EAAA0B,EAIhB,CAAA,qFAAA,mOAAA,SAACf,GAAK,MAAqB,UAAfA,EAAMiE,MAAoB,SAAW,cAAc,GEjB9DC,EAAmBC,GAAAA,OAAOC,IAAIC,yBD0ErCC,EAAoBzD,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,8GAEzBlB,0BAlEa,WACtB,IAAA0E,EAAwBC,EAAAA,WAAjBC,EAAIF,EAAA,GAAEG,EAAOH,KACpBI,EAA6BH,EAAAA,UAAS,GAA/BI,EAAOD,EAAEE,GAAAA,EAASF,EAAA,GACzBG,EAA0BN,EAAQA,SAAC,MAA5BO,EAAKD,EAAA,GAAEE,EAAQF,KA+BtB,OA7BAG,YAAU,WAuBR,OArBEC,MACKhB,iEAEFiB,KAAK,SAACC,GACL,GAAIA,EAASC,QAAU,KAAOD,EAASC,OAAS,IAC9C,OAAOD,EAASE,OAEhB,MAAM,IAAI1B,EAAM,eAEpB,GACCuB,KAAK,SAACI,GACLV,GAAU,GACVH,EAAQa,EACV,SACO,SAACC,GACNX,GAAU,GACVG,EAAS,sDACX,cAKFN,IACAG,GAAU,EACZ,CACF,EAAG,IAGD5E,EAACiB,EAAQI,CAAAA,KAAK,QACZrB,EAACF,GACCK,UAAU,SACVC,SAAS,kBACTE,MAAM,yEAEPwE,EACC9E,EAAC2D,EAAK,CAACE,aAAciB,EAAOjF,KAAK,UAC/B8E,EACF3E,EAAC+C,EAAQI,CAAAA,MAAO,IAEhBnD,EAACqE,EAAiB,KACfG,EAAKgB,IAAI,SAACC,EAASC,GAAC,OACnB1F,EAACyB,EACC8B,CAAAA,IAAKmC,EACLvD,GAAIsD,EAAQtD,GACZI,KAAMkD,EAAQE,aACdrF,MAAOmF,EAAQnF,MACfwB,KAAM2D,EAAQ3D,KACdY,QAAS+C,EAAQ/C,SACjB,IAIR1C,EAAC8D,GAAcE,MAAO,WAG5B"} \ No newline at end of file +{"version":3,"file":"index.cjs","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = ({ helpCenterUrl, label }) => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/${label}/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","ArticlesContainer","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","helpCenterUrl","label","then","response","status","json","result","err","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.modern.js b/dist/index.modern.js index 74d550f..090fc92 100644 --- a/dist/index.modern.js +++ b/dist/index.modern.js @@ -1,9 +1,9 @@ -import{useState as e,useEffect as t}from"react";import n from"styled-components";import{Link as r}from"react-router-dom";import{Code as i}from"react-content-loader";const o="(min-width: 525px)",a="(min-width: 768px)",l="(min-width: 1024px)",d="(min-width: 1440px)",s="(min-width: 2560px)";let m,c,p,u=e=>e;const g=e=>h(Fragment,null,h(x,{textAlign:e.textAlign},e.subtitle),h(f,{textAlign:e.textAlign},e.title),h(b,null,e.content,e.link?h("a",{href:e.link},e.linkText):null)),x=n.h4(m||(m=u` +import{useState as e,useEffect as t}from"react";import r from"styled-components";import{Link as n}from"react-router-dom";import{Code as i}from"react-content-loader";const o="(min-width: 525px)",a="(min-width: 768px)",l="(min-width: 1024px)",d="(min-width: 1440px)",s="(min-width: 2560px)";let m,c,p,u=e=>e;const g=e=>h(Fragment,null,h(x,{textAlign:e.textAlign},e.subtitle),h(f,{textAlign:e.textAlign},e.title),h(b,null,e.content,e.link?h("a",{href:e.link},e.linkText):null)),x=r.h4(m||(m=u` color: #f09125; text-transform: uppercase; text-align: ${0}; margin: 0.5rem 0; -`),e=>"left"===e.textAlign?"left":"center"),f=n.h2(c||(c=u` +`),e=>"left"===e.textAlign?"left":"center"),f=r.h2(c||(c=u` font-size: 28px; text-align: ${0}; max-width: ${0}; @@ -11,12 +11,12 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" @media ${0} { margin: ${0}; } -`),e=>"left"===e.textAlign?"left":"center",e=>"left"===e.textAlign?"unset":"650px",e=>"left"===e.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto",l,e=>"left"===e.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"),b=n.div(p||(p=u` +`),e=>"left"===e.textAlign?"left":"center",e=>"left"===e.textAlign?"unset":"650px",e=>"left"===e.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto",l,e=>"left"===e.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"),b=r.div(p||(p=u` width: 100%; @media ${0} { max-width: 65ch; } -`),a);let w,y,$=e=>e;const A=({children:e,color:t,name:n,border:r})=>h(v,{className:n,color:t,border:r},h(k,null,e)),v=n.div(w||(w=$` +`),a);let w,y,$=e=>e;const k=({children:e,color:t,name:r,border:n})=>h(v,{className:r,color:t,border:n},h(A,null,e)),v=r.div(w||(w=$` background-color: ${0}; color: ${0}; @@ -32,7 +32,7 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" @media ${0} { padding: 9rem 0; } -`),e=>"dark"===e.color?"#001C3D":"lightGrey"===e.color?"#FAFBFC":"darkGrey"===e.color?"#F5F6FA":"white",e=>"dark"===e.color?"white":"#091E42",e=>"top"===e.border?"1px solid #d5d5d5":"none",d,s),k=n.div(y||(y=$` +`),e=>"dark"===e.color?"#001C3D":"lightGrey"===e.color?"#FAFBFC":"darkGrey"===e.color?"#F5F6FA":"white",e=>"dark"===e.color?"white":"#091E42",e=>"top"===e.border?"1px solid #d5d5d5":"none",d,s),A=r.div(y||(y=$` margin: 0 auto; padding: 0 16px; @@ -51,7 +51,7 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" @media ${0} { max-width: 1300px; } -`),o,a,l,d,s);let z,F,_,j,M,T,C,D,N=e=>e;function R(e){const t=function(e){const[t,n,r]=e.split("-");return`${["January","February","March","April","May","June","July","August","September","October","November","December"][Number(n)-1]} ${Number(r)}, ${t}`}(e.date);return h(S,{to:"/blog/"+e.id},h(E,null,h(G,null,h(J,null,e.type),h(H,null,t)),h(P,null,e.title),h(B,null,e.summary)))}const S=n(r)(z||(z=N` +`),o,a,l,d,s);let z,F,j,M,N,S,C,D,J=e=>e;function T(e){const t=function(e){const[t,r,n]=e.split("-");return`${["January","February","March","April","May","June","July","August","September","October","November","December"][Number(r)-1]} ${Number(n)}, ${t}`}(e.date);return h(_,{to:"/blog/"+e.id},h(E,null,h(B,null,h(G,null,e.type),h(L,null,t)),h(O,null,e.title),h(R,null,e.summary)))}const _=r(n)(z||(z=J` transition: all 0.5s ease; padding-right: 0.625rem; padding-left: 0.625rem; @@ -62,10 +62,10 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" &:hover { opacity: 0.6; } -`),o),E=n.div(F||(F=N` +`),o),E=r.div(F||(F=J` max-width: 100%; margin-bottom: 50px; -`));n.div(_||(_=N` +`));r.div(j||(j=J` // background-image: url(${0}); width: 100%; height: 150px; @@ -73,30 +73,30 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" background-repeat: no-repeat; margin-bottom: 16px; background-position: center; -`),e=>e.background);const J=n.h5(j||(j=N` +`),e=>e.background);const G=r.h5(M||(M=J` font-size: 0.6875rem; font-weight: 500; color: #6a6788; text-transform: uppercase; letter-spacing: 1.1px; transition: color 0.25s ease; -`)),P=n.h4(M||(M=N` +`)),O=r.h4(N||(N=J` font-size: 1.5rem; font-weight: 700; color: #050038; letter-spacing: -0.5px; margin: 8px 0; -`)),B=n.p(T||(T=N` +`)),R=r.p(S||(S=J` font-size: 1em; font-weight: 600; color: rgb(106, 103, 136); -`)),G=n.div(C||(C=N` +`)),B=r.div(C||(C=J` display: flex; justify-content: space-between; -`)),H=n.p(D||(D=N` +`)),L=r.p(D||(D=J` font-size: 0.8rem; color: rgb(106, 103, 136); -`)),L=e=>h("section",null,Array.from({length:e.count},(e,t)=>h(i,{key:t,style:{width:"100%",marginTop:"3rem"}})));let O;function U({errorMessage:e,size:t}){return h(q,{size:t},e)}const q=n.div(O||(O=(e=>e)` +`)),P=e=>h("section",null,Array.from({length:e.count},(e,t)=>h(i,{key:t,style:{width:"100%",marginTop:"3rem"}})));let U;function q({errorMessage:e,size:t}){return h(H,{size:t},e)}const H=r.div(U||(U=(e=>e)` color: red; font-size: 1.2rem; text-align: center; @@ -104,7 +104,7 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" display: flex; justify-content: center; align-items: center; -`),e=>"small"===e.size?"300px":"50vh");let I;function K(e){return h(Q,{to:"/blog",align:e.align},"Read all articles & news")}const Q=n(r)(I||(I=(e=>e)` +`),e=>"small"===e.size?"300px":"50vh");let I;function K(e){return h(Q,{to:"/blog",align:e.align},"Read all articles & news")}const Q=r(n)(I||(I=(e=>e)` display: flex; justify-content: center; align-items: center; @@ -118,11 +118,11 @@ import{useState as e,useEffect as t}from"react";import n from"styled-components" &:hover { border: 2px solid var(--light-blue); } -`),e=>"center"==e.align?"0 auto":"100px 0 0 0 "),V=`${window.env.REACT_APP_DATAHUB_HC_URL}`;let W;function X(){const[n,r]=e(),[i,o]=e(!0),[a,l]=e(null);return t(()=>(fetch(`${V}/help_backend/confluence_documents/blog/label/blog/latest/3`).then(e=>{if(e.status>=200&&e.status<300)return e.json();throw new U("Server Error")}).then(e=>{o(!1),r(e)}).catch(e=>{o(!1),l("Oops! Something went wrong. Please try again later.")}),()=>{r(),o(!0)}),[]),h(A,{name:"blog"},h(g,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),a?h(U,{errorMessage:a,size:"small"}):i?h(L,{count:1}):h(Y,null,n.map((e,t)=>h(R,{key:t,id:e.id,type:e.article_type,title:e.title,date:e.date,summary:e.summary}))),h(K,{align:"center"}))}const Y=n.div(W||(W=(e=>e)` +`),e=>"center"==e.align?"0 auto":"100px 0 0 0 ");let V;function W(){const[r,n]=e(),[i,o]=e(!0),[a,l]=e(null);return t(()=>((({helpCenterUrl:e,label:t})=>{fetch(`${e}/help_backend/confluence_documents/blog/label/${t}/latest/3`).then(e=>{if(e.status>=200&&e.status<300)return e.json();throw new q("Server Error")}).then(e=>{o(!1),n(e)}).catch(e=>{o(!1),l("Oops! Something went wrong. Please try again later.")})})(),()=>{n(),o(!0)}),[]),h(k,{name:"blog"},h(g,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),a?h(q,{errorMessage:a,size:"small"}):i?h(P,{count:1}):h(X,null,r.map((e,t)=>h(T,{key:t,id:e.id,type:e.article_type,title:e.title,date:e.date,summary:e.summary}))),h(K,{align:"center"}))}const X=r.div(V||(V=(e=>e)` margin-top: 3rem; @media ${0} { display: flex; justify-content: space-between; } -`),o);export{X as SummarySection,g as Title}; +`),o);export{W as SummarySection,g as Title}; //# sourceMappingURL=index.modern.js.map diff --git a/dist/index.modern.js.map b/dist/index.modern.js.map index 82df29e..b14f51b 100644 --- a/dist/index.modern.js.map +++ b/dist/index.modern.js.map @@ -1 +1 @@ -{"version":3,"file":"index.modern.js","sources":["../src/assets/breakpoints.js","../src/Title.jsx","../src/Section.jsx","../src/Article.jsx","../src/Loading.jsx","../src/Error.jsx","../src/ReadAllButton.jsx","../src/assets/urls.js","../src/SummarySection.jsx"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","export const loginUrl = `${window.env.REACT_APP_MDR_URL}/saml2/login/`;\nexport const helpCenterUrl = `${window.env.REACT_APP_DATAHUB_HC_URL}`;\nexport const DataHubServiceDeskTickets = \"https://mumc.atlassian.net/servicedesk/customer/user/requests?page=1&reporter=all&statuses=open\";\nexport const dataHubPortalUrl = `${window.env.REACT_APP_DATAHUB_HOME_URL}`;\nexport const contactUsUrl = `${helpCenterUrl}/support`;\nexport const quickStartUrl = `${helpCenterUrl}/quickstart`;\nexport const CEDARUrl =\n \"https://more.metadatacenter.org/tools-training/cedar-metadata-tools\";\nexport const PIDUrl = `${helpCenterUrl}/access#Detailedguidanceforfindingandaccessingthedatayouneed-PersistentIdentifiers`;\nexport const collectionsUrl = `${quickStartUrl}#QuickstartguidetousingMaastrichtDataRepository-StoreData`;\nexport const privacyPolicyUrl = `${dataHubPortalUrl}/privacy-statement`;\nexport const termsOfServiceUrl = `${dataHubPortalUrl}/terms-of-service`;\nexport const linkedInUrl =\n \"https://www.linkedin.com/company/datahubmaastricht/\";\nexport const gitHubUrl = \"https://github.com/MaastrichtUniversity\";\nexport const emailUrl = \"mailto:datahub@maastrichtuniverstity.nl\";\nexport const emailUrlMUMC = \"mailto:datahub@mumc.nl\";\nexport const phoneUrl = \"tel:0031433872844\";\nexport const DMPUrl = \"https://dmp.datahubmaastricht.nl/\";\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\nimport { helpCenterUrl } from \"./assets/urls\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = () => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/blog/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n"],"names":["device","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_t","_","h2","_t2","div","_t3","t","Section","children","color","name","border","Wrapper","className","Article","formattedDate","dateString","year","month","day","split","Number","formatDate","date","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","_t4","_t5","p","_t6","_t7","_t8","Loading","Array","from","length","count","index","Code","key","style","width","marginTop","Error","errorMessage","size","ErrorMessage","ReadAllButton","ReadAll","align","helpCenterUrl","window","env","REACT_APP_DATAHUB_HC_URL","SummarySection","data","setData","useState","loading","isLoading","error","setError","useEffect","fetch","then","response","status","json","result","catch","err","ArticlesContainer","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.modern.js","sources":["../src/assets/breakpoints.js","../src/Title.jsx","../src/Section.jsx","../src/Article.jsx","../src/Loading.jsx","../src/Error.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = ({ helpCenterUrl, label }) => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/${label}/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n"],"names":["device","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_t","_","h2","_t2","div","_t3","t","Section","children","color","name","border","Wrapper","className","Article","formattedDate","dateString","year","month","day","split","Number","formatDate","date","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","_t4","_t5","p","_t6","_t7","_t8","Loading","Array","from","length","count","index","Code","key","style","width","marginTop","Error","errorMessage","size","ErrorMessage","ReadAllButton","ReadAll","align","SummarySection","data","setData","useState","loading","isLoading","error","setError","useEffect","getApiData","helpCenterUrl","label","fetch","then","response","status","json","result","catch","err","ArticlesContainer","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.module.js b/dist/index.module.js index d15faa6..0a193b8 100644 --- a/dist/index.module.js +++ b/dist/index.module.js @@ -1,2 +1,2 @@ -import{useState as n,useEffect as t}from"react";import e from"styled-components";import{Link as r}from"react-router-dom";import{Code as i}from"react-content-loader";function o(n,t){return t||(t=n.slice(0)),n.raw=t,n}var a,l,u,c,d,m,s,p,g,f,x,b,w,y="(min-width: 525px)",v="(min-width: 768px)",A="(min-width: 1024px)",k="(min-width: 1440px)",z="(min-width: 2560px)",F=function(n){return h(Fragment,null,h(_,{textAlign:n.textAlign},n.subtitle),h(j,{textAlign:n.textAlign},n.title),h(M,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},_=e.h4(a||(a=o(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),j=e.h2(l||(l=o(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},A,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),M=e.div(u||(u=o(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),v),T=function(n){return h(C,{className:n.name,color:n.color,border:n.border},h(D,null,n.children))},C=e.div(c||(c=o(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},k,z),D=e.div(d||(d=o(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),y,v,A,k,z);function N(n){var t,e,r,i=(e=(t=n.date.split("-"))[0],r=t[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(t[1])-1]+" "+Number(r)+", "+e);return h(R,{to:"/blog/"+n.id},h(S,null,h(G,null,h(J,null,n.type),h(H,null,i)),h(P,null,n.title),h(B,null,n.summary)))}var R=e(r)(m||(m=o(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),y),S=e.div(s||(s=o(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));e.div(p||(p=o(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var E,J=e.h5(g||(g=o(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),P=e.h4(f||(f=o(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),B=e.p(x||(x=o(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),G=e.div(b||(b=o(["\n display: flex;\n justify-content: space-between;\n"]))),H=e.p(w||(w=o(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),L=function(n){return h("section",null,Array.from({length:n.count},function(n,t){return h(i,{key:t,style:{width:"100%",marginTop:"3rem"}})}))};function O(n){return h(q,{size:n.size},n.errorMessage)}var U,q=e.div(E||(E=o(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function I(n){return h(Q,{to:"/blog",align:n.align},"Read all articles & news")}var K,Q=e(r)(U||(U=o(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "}),V=""+window.env.REACT_APP_DATAHUB_HC_URL;function W(){var e=n(),r=e[0],i=e[1],o=n(!0),a=o[0],l=o[1],u=n(null),c=u[0],d=u[1];return t(function(){return fetch(V+"/help_backend/confluence_documents/blog/label/blog/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new O("Server Error")}).then(function(n){l(!1),i(n)}).catch(function(n){l(!1),d("Oops! Something went wrong. Please try again later.")}),function(){i(),l(!0)}},[]),h(T,{name:"blog"},h(F,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),c?h(O,{errorMessage:c,size:"small"}):a?h(L,{count:1}):h(X,null,r.map(function(n,t){return h(N,{key:t,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(I,{align:"center"}))}var X=e.div(K||(K=o(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),y);export{W as SummarySection,F as Title}; +import{useState as n,useEffect as e}from"react";import t from"styled-components";import{Link as r}from"react-router-dom";import{Code as i}from"react-content-loader";function o(n,e){return e||(e=n.slice(0)),n.raw=e,n}var a,l,u,c,d,m,s,p,g,f,x,b,w,y="(min-width: 525px)",v="(min-width: 768px)",k="(min-width: 1024px)",A="(min-width: 1440px)",z="(min-width: 2560px)",F=function(n){return h(Fragment,null,h(j,{textAlign:n.textAlign},n.subtitle),h(M,{textAlign:n.textAlign},n.title),h(N,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},j=t.h4(a||(a=o(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),M=t.h2(l||(l=o(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},k,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),N=t.div(u||(u=o(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),v),S=function(n){return h(C,{className:n.name,color:n.color,border:n.border},h(D,null,n.children))},C=t.div(c||(c=o(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},A,z),D=t.div(d||(d=o(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),y,v,k,A,z);function J(n){var e,t,r,i=(t=(e=n.date.split("-"))[0],r=e[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(e[1])-1]+" "+Number(r)+", "+t);return h(T,{to:"/blog/"+n.id},h(_,null,h(B,null,h(G,null,n.type),h(L,null,i)),h(O,null,n.title),h(R,null,n.summary)))}var T=t(r)(m||(m=o(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),y),_=t.div(s||(s=o(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));t.div(p||(p=o(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var E,G=t.h5(g||(g=o(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),O=t.h4(f||(f=o(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),R=t.p(x||(x=o(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),B=t.div(b||(b=o(["\n display: flex;\n justify-content: space-between;\n"]))),L=t.p(w||(w=o(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),P=function(n){return h("section",null,Array.from({length:n.count},function(n,e){return h(i,{key:e,style:{width:"100%",marginTop:"3rem"}})}))};function U(n){return h(H,{size:n.size},n.errorMessage)}var q,H=t.div(E||(E=o(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function I(n){return h(Q,{to:"/blog",align:n.align},"Read all articles & news")}var K,Q=t(r)(q||(q=o(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "});function V(){var t=n(),r=t[0],i=t[1],o=n(!0),a=o[0],l=o[1],u=n(null),c=u[0],d=u[1];return e(function(){var n;return fetch(n.helpCenterUrl+"/help_backend/confluence_documents/blog/label/"+n.label+"/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new U("Server Error")}).then(function(n){l(!1),i(n)}).catch(function(n){l(!1),d("Oops! Something went wrong. Please try again later.")}),function(){i(),l(!0)}},[]),h(S,{name:"blog"},h(F,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),c?h(U,{errorMessage:c,size:"small"}):a?h(P,{count:1}):h(W,null,r.map(function(n,e){return h(J,{key:e,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(I,{align:"center"}))}var W=t.div(K||(K=o(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),y);export{V as SummarySection,F as Title}; //# sourceMappingURL=index.module.js.map diff --git a/dist/index.module.js.map b/dist/index.module.js.map index 423c223..ce3a650 100644 --- a/dist/index.module.js.map +++ b/dist/index.module.js.map @@ -1 +1 @@ -{"version":3,"file":"index.module.js","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx","../src/assets/urls.js"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\nimport { helpCenterUrl } from \"./assets/urls\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = () => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/blog/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n","export const loginUrl = `${window.env.REACT_APP_MDR_URL}/saml2/login/`;\nexport const helpCenterUrl = `${window.env.REACT_APP_DATAHUB_HC_URL}`;\nexport const DataHubServiceDeskTickets = \"https://mumc.atlassian.net/servicedesk/customer/user/requests?page=1&reporter=all&statuses=open\";\nexport const dataHubPortalUrl = `${window.env.REACT_APP_DATAHUB_HOME_URL}`;\nexport const contactUsUrl = `${helpCenterUrl}/support`;\nexport const quickStartUrl = `${helpCenterUrl}/quickstart`;\nexport const CEDARUrl =\n \"https://more.metadatacenter.org/tools-training/cedar-metadata-tools\";\nexport const PIDUrl = `${helpCenterUrl}/access#Detailedguidanceforfindingandaccessingthedatayouneed-PersistentIdentifiers`;\nexport const collectionsUrl = `${quickStartUrl}#QuickstartguidetousingMaastrichtDataRepository-StoreData`;\nexport const privacyPolicyUrl = `${dataHubPortalUrl}/privacy-statement`;\nexport const termsOfServiceUrl = `${dataHubPortalUrl}/terms-of-service`;\nexport const linkedInUrl =\n \"https://www.linkedin.com/company/datahubmaastricht/\";\nexport const gitHubUrl = \"https://github.com/MaastrichtUniversity\";\nexport const emailUrl = \"mailto:datahub@maastrichtuniverstity.nl\";\nexport const emailUrlMUMC = \"mailto:datahub@mumc.nl\";\nexport const phoneUrl = \"tel:0031433872844\";\nexport const DMPUrl = \"https://dmp.datahubmaastricht.nl/\";\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","helpCenterUrl","window","env","REACT_APP_DATAHUB_HC_URL","SummarySection","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","then","response","status","json","result","err","ArticlesContainer","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"index.module.js","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = ({ helpCenterUrl, label }) => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/${label}/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","SummarySection","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","helpCenterUrl","label","then","response","status","json","result","err","ArticlesContainer","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file diff --git a/dist/index.umd.js b/dist/index.umd.js index 2b58d8c..19ff801 100644 --- a/dist/index.umd.js +++ b/dist/index.umd.js @@ -1,2 +1,2 @@ -!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("styled-components"),require("react-router-dom"),require("react-content-loader")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","react-router-dom","react-content-loader"],e):e((n||self).dhJsBlogUtils={},n.react,n.styledComponents,n.reactRouterDom,n.reactContentLoader)}(this,function(n,e,t,r,i){function a(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o=/*#__PURE__*/a(t);function l(n,e){return e||(e=n.slice(0)),n.raw=e,n}var u,d,c,f,s,m,p,g,x,b,y,w,v,k="(min-width: 525px)",A="(min-width: 768px)",z="(min-width: 1024px)",S="(min-width: 1440px)",F="(min-width: 2560px)",j=function(n){return h(Fragment,null,h(C,{textAlign:n.textAlign},n.subtitle),h(T,{textAlign:n.textAlign},n.title),h(_,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},C=o.default.h4(u||(u=l(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),T=o.default.h2(d||(d=l(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},z,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),_=o.default.div(c||(c=l(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),A),D=function(n){return h(L,{className:n.name,color:n.color,border:n.border},h(M,null,n.children))},L=o.default.div(f||(f=l(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},S,F),M=o.default.div(s||(s=l(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),k,A,z,S,F);function R(n){var e,t,r,i=(t=(e=n.date.split("-"))[0],r=e[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(e[1])-1]+" "+Number(r)+", "+t);return h(q,{to:"/blog/"+n.id},h(E,null,h(U,null,h(N,null,n.type),h(G,null,i)),h(B,null,n.title),h(P,null,n.summary)))}var q=o.default(r.Link)(m||(m=l(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),k),E=o.default.div(p||(p=l(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));o.default.div(g||(g=l(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var J,N=o.default.h5(x||(x=l(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),B=o.default.h4(b||(b=l(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),P=o.default.p(y||(y=l(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),U=o.default.div(w||(w=l(["\n display: flex;\n justify-content: space-between;\n"]))),G=o.default.p(v||(v=l(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),H=function(n){return h("section",null,Array.from({length:n.count},function(n,e){return h(i.Code,{key:e,style:{width:"100%",marginTop:"3rem"}})}))};function O(n){return h(K,{size:n.size},n.errorMessage)}var I,K=o.default.div(J||(J=l(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function Q(n){return h(W,{to:"/blog",align:n.align},"Read all articles & news")}var V,W=o.default(r.Link)(I||(I=l(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "}),X=""+window.env.REACT_APP_DATAHUB_HC_URL,Y=o.default.div(V||(V=l(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),k);n.SummarySection=function(){var n=e.useState(),t=n[0],r=n[1],i=e.useState(!0),a=i[0],o=i[1],l=e.useState(null),u=l[0],d=l[1];return e.useEffect(function(){return fetch(X+"/help_backend/confluence_documents/blog/label/blog/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new O("Server Error")}).then(function(n){o(!1),r(n)}).catch(function(n){o(!1),d("Oops! Something went wrong. Please try again later.")}),function(){r(),o(!0)}},[]),h(D,{name:"blog"},h(j,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),u?h(O,{errorMessage:u,size:"small"}):a?h(H,{count:1}):h(Y,null,t.map(function(n,e){return h(R,{key:e,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(Q,{align:"center"}))},n.Title=j}); +!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("styled-components"),require("react-router-dom"),require("react-content-loader")):"function"==typeof define&&define.amd?define(["exports","react","styled-components","react-router-dom","react-content-loader"],e):e((n||self).dhJsBlogUtils={},n.react,n.styledComponents,n.reactRouterDom,n.reactContentLoader)}(this,function(n,e,t,r,i){function a(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o=/*#__PURE__*/a(t);function l(n,e){return e||(e=n.slice(0)),n.raw=e,n}var u,d,c,f,s,m,p,g,x,b,y,w,v,k="(min-width: 525px)",A="(min-width: 768px)",z="(min-width: 1024px)",S="(min-width: 1440px)",F="(min-width: 2560px)",j=function(n){return h(Fragment,null,h(C,{textAlign:n.textAlign},n.subtitle),h(M,{textAlign:n.textAlign},n.title),h(T,null,n.content,n.link?h("a",{href:n.link},n.linkText):null))},C=o.default.h4(u||(u=l(["\n color: #f09125;\n text-transform: uppercase;\n text-align: ",";\n margin: 0.5rem 0;\n"])),function(n){return"left"===n.textAlign?"left":"center"}),M=o.default.h2(d||(d=l(["\n font-size: 28px;\n text-align: ",";\n max-width: ",";\n margin: ",";\n @media "," {\n margin: ",";\n }\n"])),function(n){return"left"===n.textAlign?"left":"center"},function(n){return"left"===n.textAlign?"unset":"650px"},function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 1.5rem auto"},z,function(n){return"left"===n.textAlign?"0 0 1.5rem 0":"0 auto 3rem auto"}),T=o.default.div(c||(c=l(["\n width: 100%;\n @media "," {\n max-width: 65ch;\n }\n"])),A),q=function(n){return h(D,{className:n.name,color:n.color,border:n.border},h(J,null,n.children))},D=o.default.div(f||(f=l(["\n background-color: ",";\n\n color: ",";\n border-top: ",";\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media "," {\n padding: 8rem 0;\n }\n @media "," {\n padding: 9rem 0;\n }\n"])),function(n){return"dark"===n.color?"#001C3D":"lightGrey"===n.color?"#FAFBFC":"darkGrey"===n.color?"#F5F6FA":"white"},function(n){return"dark"===n.color?"white":"#091E42"},function(n){return"top"===n.border?"1px solid #d5d5d5":"none"},S,F),J=o.default.div(s||(s=l(["\n margin: 0 auto;\n padding: 0 16px;\n\n @media "," {\n max-width: 650px;\n }\n @media "," {\n max-width: 800px;\n }\n @media "," {\n max-width: 1000px;\n }\n @media "," {\n max-width: 1100px;\n }\n @media "," {\n max-width: 1300px;\n }\n"])),k,A,z,S,F);function L(n){var e,t,r,i=(t=(e=n.date.split("-"))[0],r=e[2],["January","February","March","April","May","June","July","August","September","October","November","December"][Number(e[1])-1]+" "+Number(r)+", "+t);return h(N,{to:"/blog/"+n.id},h(E,null,h(O,null,h(_,null,n.type),h(U,null,i)),h(B,null,n.title),h(G,null,n.summary)))}var N=o.default(r.Link)(m||(m=l(["\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media "," {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n"])),k),E=o.default.div(p||(p=l(["\n max-width: 100%;\n margin-bottom: 50px;\n"])));o.default.div(g||(g=l(["\n // background-image: url(",");\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n"])),function(n){return n.background});var R,_=o.default.h5(x||(x=l(["\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n"]))),B=o.default.h4(b||(b=l(["\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n"]))),G=o.default.p(y||(y=l(["\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n"]))),O=o.default.div(w||(w=l(["\n display: flex;\n justify-content: space-between;\n"]))),U=o.default.p(v||(v=l(["\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n"]))),P=function(n){return h("section",null,Array.from({length:n.count},function(n,e){return h(i.Code,{key:e,style:{width:"100%",marginTop:"3rem"}})}))};function H(n){return h(K,{size:n.size},n.errorMessage)}var I,K=o.default.div(R||(R=l(["\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ",";\n display: flex;\n justify-content: center;\n align-items: center;\n"])),function(n){return"small"===n.size?"300px":"50vh"});function Q(n){return h(W,{to:"/blog",align:n.align},"Read all articles & news")}var V,W=o.default(r.Link)(I||(I=l(["\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ",";\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n"])),function(n){return"center"==n.align?"0 auto":"100px 0 0 0 "}),X=o.default.div(V||(V=l(["\n margin-top: 3rem;\n @media "," {\n display: flex;\n justify-content: space-between;\n }\n"])),k);n.SummarySection=function(){var n=e.useState(),t=n[0],r=n[1],i=e.useState(!0),a=i[0],o=i[1],l=e.useState(null),u=l[0],d=l[1];return e.useEffect(function(){var n;return fetch(n.helpCenterUrl+"/help_backend/confluence_documents/blog/label/"+n.label+"/latest/3").then(function(n){if(n.status>=200&&n.status<300)return n.json();throw new H("Server Error")}).then(function(n){o(!1),r(n)}).catch(function(n){o(!1),d("Oops! Something went wrong. Please try again later.")}),function(){r(),o(!0)}},[]),h(q,{name:"blog"},h(j,{textAlign:"center",subtitle:"Latest articles",title:"Stay tuned for Maastricht Data Repository’s news and useful features"}),u?h(H,{errorMessage:u,size:"small"}):a?h(P,{count:1}):h(X,null,t.map(function(n,e){return h(L,{key:e,id:n.id,type:n.article_type,title:n.title,date:n.date,summary:n.summary})})),h(Q,{align:"center"}))},n.Title=j}); //# sourceMappingURL=index.umd.js.map diff --git a/dist/index.umd.js.map b/dist/index.umd.js.map index 7a8705f..f1b747b 100644 --- a/dist/index.umd.js.map +++ b/dist/index.umd.js.map @@ -1 +1 @@ -{"version":3,"file":"index.umd.js","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx","../src/assets/urls.js"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\nimport { helpCenterUrl } from \"./assets/urls\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = () => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/blog/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n","export const loginUrl = `${window.env.REACT_APP_MDR_URL}/saml2/login/`;\nexport const helpCenterUrl = `${window.env.REACT_APP_DATAHUB_HC_URL}`;\nexport const DataHubServiceDeskTickets = \"https://mumc.atlassian.net/servicedesk/customer/user/requests?page=1&reporter=all&statuses=open\";\nexport const dataHubPortalUrl = `${window.env.REACT_APP_DATAHUB_HOME_URL}`;\nexport const contactUsUrl = `${helpCenterUrl}/support`;\nexport const quickStartUrl = `${helpCenterUrl}/quickstart`;\nexport const CEDARUrl =\n \"https://more.metadatacenter.org/tools-training/cedar-metadata-tools\";\nexport const PIDUrl = `${helpCenterUrl}/access#Detailedguidanceforfindingandaccessingthedatayouneed-PersistentIdentifiers`;\nexport const collectionsUrl = `${quickStartUrl}#QuickstartguidetousingMaastrichtDataRepository-StoreData`;\nexport const privacyPolicyUrl = `${dataHubPortalUrl}/privacy-statement`;\nexport const termsOfServiceUrl = `${dataHubPortalUrl}/terms-of-service`;\nexport const linkedInUrl =\n \"https://www.linkedin.com/company/datahubmaastricht/\";\nexport const gitHubUrl = \"https://github.com/MaastrichtUniversity\";\nexport const emailUrl = \"mailto:datahub@maastrichtuniverstity.nl\";\nexport const emailUrlMUMC = \"mailto:datahub@mumc.nl\";\nexport const phoneUrl = \"tel:0031433872844\";\nexport const DMPUrl = \"https://dmp.datahubmaastricht.nl/\";\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","helpCenterUrl","window","env","REACT_APP_DATAHUB_HC_URL","ArticlesContainer","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","then","response","status","json","result","err","map","article","i","article_type"],"mappings":"mnBAAA,cCAAA,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EDSaC,EAEaC,qBAFbD,uBAAAA,EAIL,sBAJKA,EAKJ,sBALIA,EAMaC,sBEXpBC,EAAQ,SAACC,GACb,OACEC,EAAAC,SAAA,KACED,EAACE,EAASC,CAAAA,UAAWJ,EAAMI,WAAYJ,EAAMK,UAC7CJ,EAACK,EAAY,CAACF,UAAWJ,EAAMI,WAAYJ,EAAMO,OACjDN,EAACO,EACER,KAAAA,EAAMS,QACNT,EAAMU,KAAOT,EAAGU,IAAAA,CAAAA,KAAMX,EAAMU,MAAOV,EAAMY,UAAgB,MAIlE,EAIMT,EAAWU,EAAAA,QAAOC,GAAEzB,IAAAA,EAAA0B,qGAGV,SAACf,GAAW,MAAoB,SAApBA,EAAMI,UAAuB,OAAS,QAAQ,GAIpEE,EAAeO,EAAAA,QAAOG,GAAE1B,IAAAA,EAAAyB,EAAA,CAAA,uCAAA,mBAAA,gBAAA,eAAA,mBAAA,cAEd,SAACf,GAAW,MAAoB,SAApBA,EAAMI,UAAuB,OAAS,QAAQ,EAC3D,SAACJ,GAAK,MAA0B,SAApBA,EAAMI,UAAuB,QAAU,OAAO,EAC7D,SAACJ,SACW,SAApBA,EAAMI,UAAuB,eAAiB,oBAAoB,EAC3DP,EACG,SAACG,GAAK,MACM,SAApBA,EAAMI,UAAuB,eAAiB,kBAAkB,GAIhEI,EAAUK,EAAAA,QAAOI,IAAG1B,IAAAA,EAAAwB,EAEflB,CAAAA,8BAAAA,qCAAAA,GCpCLqB,EAAU,SAAHC,GACX,OACElB,EAACmB,GAAQC,UAF2BF,EAAJG,KAENC,MAFIJ,EAALI,MAEeC,OAFIL,EAANK,QAGpCvB,EAACO,OAHoBW,EAARM,UAMnB,EAIML,EAAUP,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,EAAA,CAAA,yBAAA,iBAAA,oBAAA,6EAAA,2CAAA,qCACJ,SAACf,SACH,SAAhBA,EAAMuB,MACF,UACgB,cAAhBvB,EAAMuB,MACN,UACgB,aAAhBvB,EAAMuB,MACN,UACA,OAAO,EAEJ,SAACvB,GAAK,MAAsB,SAAhBA,EAAMuB,MAAmB,QAAU,SAAS,EACnD,SAACvB,GAAK,MACD,QAAjBA,EAAMwB,OAAmB,oBAAsB,MAAM,EAM9C3B,EAGAA,GAKLW,EAAUK,EAAAA,QAAOI,IAAG3B,IAAAA,EAAAyB,EAIflB,CAAAA,uDAAAA,4CAAAA,4CAAAA,6CAAAA,6CAAAA,uCAAAA,EAGAA,EAGAA,EAGAA,EAGAA,GFhDI,SAAS6B,EAAQ1B,GA2B9B,IAPE2B,EAAOC,EAAaC,EAOhBC,GAPGF,GAAPD,EAO+B3B,EAAM+B,KAPCC,MAAM,MAAjC,GAASH,EAAGF,EAAA,GAfR,CACb,UACA,WACA,QACA,QACA,MACA,OACA,OACA,SACA,YACA,UACA,WACA,YAI8BM,OADdN,EAAEE,IAC4B,GAAMI,IAAAA,OACpDJ,GACID,KAAAA,GAkBR,OACE3B,EAACiC,EAAYC,CAAAA,GAAI,SAAWnC,EAAMoC,IAChCnC,EAACoC,OAECpC,EAACqC,EAAM,KACLrC,EAACsC,EAAMvC,KAAAA,EAAMwC,MACbvC,EAACwC,EAAI,KAAEX,IAET7B,EAACF,EAAOC,KAAAA,EAAMO,OACdN,EAACyC,OAAM1C,EAAM2C,UAIrB,CAEO,IAAMT,EAAcrB,EAAM,QAAC+B,OAAP/B,CAAYxB,IAAAA,EAAA0B,EAI5BlB,CAAAA,mGAAAA,uGAAAA,GASLwC,EAAmBxB,EAAAA,QAAOI,IAAG3B,IAAAA,EAAAyB,EAAA,CAAA,qDAKdF,EAAAA,QAAOI,IAAG1B,IAAAA,EAAAwB,EACF,CAAA,gCAAA,kKAAA,SAACf,GAAU,OAAAA,EAAM6C,UAAU,GAQxD,IG3FAxD,EH2FMkD,EAAO1B,UAAOiC,GAAEtD,IAAAA,EAAAuB,EAOrB,CAAA,mKAEKhB,EAAQc,UAAOC,GAAErB,IAAAA,EAAAsB,EAMtB,CAAA,oHACK2B,EAAO7B,EAAAA,QAAOkC,EAACrD,IAAAA,EAAAqB,EAIpB,CAAA,+EAEKuB,EAASzB,EAAAA,QAAOI,IAAGtB,IAAAA,EAAAoB,EAGxB,CAAA,8DACK0B,EAAO5B,EAAM,QAACkC,EAACnD,IAAAA,EAAAmB,EAGpB,CAAA,6DIrHKiC,EAAU,SAAChD,GAAK,OAMpBC,iBACGgD,MAAMC,KAAK,CAAEC,OAAQnD,EAAMoD,OAAS,SAACC,EAAGC,GAAK,OAC5CrD,EAACsD,EAAAA,KAAI,CAACC,IAAKF,EAAOG,MAAO,CAAEC,MAAO,OAAQC,UAAW,SAAY,GAE3D,EDTY,SAAAC,EAAKzC,GAC3B,OAAOlB,EAAC4D,EAAY,CAAC/D,KAD2BqB,EAAJrB,MAAFqB,EAAZ2C,aAEhC,CAEA,IERAzE,EFQMwE,EAAehD,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,EAInB,CAAA,2EAAA,+EAAA,SAACf,GAAK,MAAqB,UAAfA,EAAMF,KAAmB,QAAU,MAAM,GEPzC,SAAAiE,EAAc/D,GACpC,OACEC,EAAC+D,EAAQ7B,CAAAA,GAAG,QAAQ8B,MAAOjE,EAAMiE,OAAO,2BAK5C,CAEA,ICdA5E,EDcM2E,EAAUnD,EAAAA,QAAO+B,EAAAA,KAAP/B,CAAYxB,IAAAA,EAAA0B,EAIhB,CAAA,qFAAA,mOAAA,SAACf,GAAK,MAAqB,UAAfA,EAAMiE,MAAoB,SAAW,cAAc,GEjB9DC,EAAmBC,GAAAA,OAAOC,IAAIC,yBD0ErCC,EAAoBzD,EAAAA,QAAOI,IAAG5B,IAAAA,EAAA0B,8GAEzBlB,oBAlEa,WACtB,IAAA0E,EAAwBC,EAAAA,WAAjBC,EAAIF,EAAA,GAAEG,EAAOH,KACpBI,EAA6BH,EAAAA,UAAS,GAA/BI,EAAOD,EAAEE,GAAAA,EAASF,EAAA,GACzBG,EAA0BN,EAAQA,SAAC,MAA5BO,EAAKD,EAAA,GAAEE,EAAQF,KA+BtB,OA7BAG,YAAU,WAuBR,OArBEC,MACKhB,iEAEFiB,KAAK,SAACC,GACL,GAAIA,EAASC,QAAU,KAAOD,EAASC,OAAS,IAC9C,OAAOD,EAASE,OAEhB,MAAM,IAAI1B,EAAM,eAEpB,GACCuB,KAAK,SAACI,GACLV,GAAU,GACVH,EAAQa,EACV,SACO,SAACC,GACNX,GAAU,GACVG,EAAS,sDACX,cAKFN,IACAG,GAAU,EACZ,CACF,EAAG,IAGD5E,EAACiB,EAAQI,CAAAA,KAAK,QACZrB,EAACF,GACCK,UAAU,SACVC,SAAS,kBACTE,MAAM,yEAEPwE,EACC9E,EAAC2D,EAAK,CAACE,aAAciB,EAAOjF,KAAK,UAC/B8E,EACF3E,EAAC+C,EAAQI,CAAAA,MAAO,IAEhBnD,EAACqE,EAAiB,KACfG,EAAKgB,IAAI,SAACC,EAASC,GAAC,OACnB1F,EAACyB,EACC8B,CAAAA,IAAKmC,EACLvD,GAAIsD,EAAQtD,GACZI,KAAMkD,EAAQE,aACdrF,MAAOmF,EAAQnF,MACfwB,KAAM2D,EAAQ3D,KACdY,QAAS+C,EAAQ/C,SACjB,IAIR1C,EAAC8D,GAAcE,MAAO,WAG5B"} \ No newline at end of file +{"version":3,"file":"index.umd.js","sources":["../src/assets/breakpoints.js","../src/Article.jsx","../src/Title.jsx","../src/Section.jsx","../src/Error.jsx","../src/Loading.jsx","../src/ReadAllButton.jsx","../src/SummarySection.jsx"],"sourcesContent":["const size = {\n mobileM: \"375px\",\n mobileL: \"525px\",\n tablet: \"768px\",\n laptop: \"1024px\",\n laptopL: \"1440px\",\n desktop: \"2560px\",\n};\n\nexport const device = {\n mobileM: `(min-width: ${size.mobileM})`,\n mobileL: `(min-width: ${size.mobileL})`,\n tablet: `(min-width: ${size.tablet})`,\n laptop: `(min-width: ${size.laptop})`,\n laptopL: `(min-width: ${size.laptopL})`,\n desktop: `(min-width: ${size.desktop})`,\n};\n","import styled from \"styled-components\";\n// import Roadmap from \"../../assets/illustrations/blog/Agile_roadmap.svg\";\n// import General from \"../../assets/illustrations/blog/General.svg\";\n// import ReleaseNotes from \"../../assets/illustrations/blog/Release_notes.svg\";\n// import Sprint from \"../../assets/illustrations/blog/Sprint_summary.svg\";\nimport { Link } from \"react-router-dom\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function Article(props) {\n /* Format the date from Confluence to more readable format.\n From \"2023-07-25\" to \"July 25, 2023\"\n */\n function formatDate(dateString) {\n const months = [\n \"January\",\n \"February\",\n \"March\",\n \"April\",\n \"May\",\n \"June\",\n \"July\",\n \"August\",\n \"September\",\n \"October\",\n \"November\",\n \"December\",\n ];\n\n const [year, month, day] = dateString.split(\"-\");\n const formattedDate = `${months[Number(month) - 1]} ${Number(\n day\n )}, ${year}`;\n return formattedDate;\n }\n\n const formattedDate = formatDate(props.date);\n\n let backgroundImage;\n\n // if (props.type === \"Sprint summary\") {\n // backgroundImage = Sprint;\n // } else if (props.type === \"Roadmap\") {\n // backgroundImage = Roadmap;\n // } else if (props.type === \"Release notes\") {\n // backgroundImage = ReleaseNotes;\n // } else {\n // backgroundImage = General;\n // }\n\n return (\n \n \n {/* */}\n
\n {props.type}\n {formattedDate}\n
\n {props.title}\n {props.summary}\n \n \n );\n}\n\nexport const ArticleLink = styled(Link)`\n transition: all 0.5s ease;\n padding-right: 0.625rem;\n padding-left: 0.625rem;\n @media ${device.mobileL} {\n flex: 0 0 33.3333%;\n max-width: 33.3333%;\n }\n &:hover {\n opacity: 0.6;\n }\n`;\n\nconst ArticleContainer = styled.div`\n max-width: 100%;\n margin-bottom: 50px;\n`;\n\nexport const Image = styled.div`\n // background-image: url(${(props) => props.background});\n width: 100%;\n height: 150px;\n background-size: contain;\n background-repeat: no-repeat;\n margin-bottom: 16px;\n background-position: center;\n`;\nconst Type = styled.h5`\n font-size: 0.6875rem;\n font-weight: 500;\n color: #6a6788;\n text-transform: uppercase;\n letter-spacing: 1.1px;\n transition: color 0.25s ease;\n`;\n\nconst Title = styled.h4`\n font-size: 1.5rem;\n font-weight: 700;\n color: #050038;\n letter-spacing: -0.5px;\n margin: 8px 0;\n`;\nconst Body = styled.p`\n font-size: 1em;\n font-weight: 600;\n color: rgb(106, 103, 136);\n`;\n\nconst Header = styled.div`\n display: flex;\n justify-content: space-between;\n`;\nconst Date = styled.p`\n font-size: 0.8rem;\n color: rgb(106, 103, 136);\n`;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nconst Title = (props) => {\n return (\n <>\n {props.subtitle}\n {props.title}\n \n {props.content}\n {props.link ? {props.linkText} : null}\n \n \n );\n};\n\nexport default Title;\n\nconst Subtitle = styled.h4`\n color: #f09125;\n text-transform: uppercase;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n margin: 0.5rem 0;\n`;\n\nconst PrimaryTitle = styled.h2`\n font-size: 28px;\n text-align: ${(props) => (props.textAlign === \"left\" ? \"left\" : \"center\")};\n max-width: ${(props) => (props.textAlign === \"left\" ? \"unset\" : \"650px\")};\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 1.5rem auto\"};\n @media ${device.laptop} {\n margin: ${(props) =>\n props.textAlign === \"left\" ? \"0 0 1.5rem 0\" : \"0 auto 3rem auto\"};\n }\n`;\n\nconst Content = styled.div`\n width: 100%;\n @media ${device.tablet} {\n max-width: 65ch;\n }\n`;\n","import React from \"react\";\nimport { device } from \"./assets/breakpoints\";\nimport styled from \"styled-components\";\n\nconst Section = ({ children, color, name, border }) => {\n return (\n \n {children}\n \n );\n};\n\nexport default Section;\n\nconst Wrapper = styled.div`\n background-color: ${(props) =>\n props.color === \"dark\"\n ? \"#001C3D\"\n : props.color === \"lightGrey\"\n ? \"#FAFBFC\"\n : props.color === \"darkGrey\"\n ? \"#F5F6FA\"\n : \"white\"};\n\n color: ${(props) => (props.color === \"dark\" ? \"white\" : \"#091E42\")};\n border-top: ${(props) =>\n props.border === \"top\" ? \"1px solid #d5d5d5\" : \"none\"};\n\n z-index: 5;\n position: relative;\n padding: 5rem 0;\n\n @media ${device.laptopL} {\n padding: 8rem 0;\n }\n @media ${device.desktop} {\n padding: 9rem 0;\n }\n`;\n\nconst Content = styled.div`\n margin: 0 auto;\n padding: 0 16px;\n\n @media ${device.mobileL} {\n max-width: 650px;\n }\n @media ${device.tablet} {\n max-width: 800px;\n }\n @media ${device.laptop} {\n max-width: 1000px;\n }\n @media ${device.laptopL} {\n max-width: 1100px;\n }\n @media ${device.desktop} {\n max-width: 1300px;\n }\n`;\n","import React from \"react\";\n// import { TbFaceIdError } from \"react-icons/tb\";\nimport styled from \"styled-components\";\n\nexport default function Error({ errorMessage, size }) {\n return {errorMessage};\n}\n\nconst ErrorMessage = styled.div`\n color: red;\n font-size: 1.2rem;\n text-align: center;\n height: ${(props) => (props.size === \"small\" ? \"300px\" : \"50vh\")};\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n","import React from \"react\";\nimport { Code } from \"react-content-loader\";\n\nconst Loading = (props) => (\n /*\n count = a value to the parent component that indicates how many loader elements to add. For a bigger\n page, like the full blog page, you need to display more (3), to cover more area.\n */\n\n
\n {Array.from({ length: props.count }, (_, index) => (\n \n ))}\n
\n);\n\nexport default Loading;\n","import React from \"react\";\nimport styled from \"styled-components\";\nimport { Link } from \"react-router-dom\";\n// import { FaArrowRight } from \"react-icons/fa\";\n\nexport default function ReadAllButton(props) {\n return (\n \n Read all articles & news\n {/* */}\n \n );\n}\n\nconst ReadAll = styled(Link)`\n display: flex;\n justify-content: center;\n align-items: center;\n margin: ${(props) => (props.align == \"center\" ? \"0 auto\" : \"100px 0 0 0 \")};\n width: 300px;\n color: var(--dark-blue);\n text-decoration: none;\n padding: 10px 10px;\n border: 2px solid var(--dark-orange);\n border-radius: 4px;\n &:hover {\n border: 2px solid var(--light-blue);\n }\n`;\n","import { useEffect, useState } from \"react\";\nimport Section from \"./Section\";\nimport Title from \"./Title\";\nimport Article from \"./Article\";\nimport Loading from \"./Loading\";\nimport Error from \"./Error\";\nimport ReadAllButton from \"./ReadAllButton\";\nimport styled from \"styled-components\";\nimport { device } from \"./assets/breakpoints\";\n\nexport default function SummarySection() {\n const [data, setData] = useState();\n const [loading, isLoading] = useState(true);\n const [error, setError] = useState(null);\n\n useEffect(() => {\n const getApiData = ({ helpCenterUrl, label }) => {\n fetch(\n `${helpCenterUrl}/help_backend/confluence_documents/blog/label/${label}/latest/3`\n )\n .then((response) => {\n if (response.status >= 200 && response.status < 300) {\n return response.json();\n } else {\n throw new Error(\"Server Error\");\n }\n })\n .then((result) => {\n isLoading(false);\n setData(result);\n })\n .catch((err) => {\n isLoading(false);\n setError(\"Oops! Something went wrong. Please try again later.\");\n });\n };\n\n getApiData();\n return () => {\n setData();\n isLoading(true);\n };\n }, []);\n\n return (\n
\n \n {error ? (\n \n ) : loading ? (\n \n ) : (\n \n {data.map((article, i) => (\n \n ))}\n \n )}\n \n
\n );\n}\n\nconst ArticlesContainer = styled.div`\n margin-top: 3rem;\n @media ${device.mobileL} {\n display: flex;\n justify-content: space-between;\n }\n`;\n"],"names":["_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","device","size","Title","props","h","Fragment","Subtitle","textAlign","subtitle","PrimaryTitle","title","Content","content","link","href","linkText","styled","h4","_taggedTemplateLiteralLoose","h2","div","Section","_ref","Wrapper","className","name","color","border","children","Article","_dateString$split","year","day","formattedDate","date","split","Number","ArticleLink","to","id","ArticleContainer","Header","Type","type","Date","Body","summary","Link","background","h5","p","Loading","Array","from","length","count","_","index","Code","key","style","width","marginTop","Error","ErrorMessage","errorMessage","ReadAllButton","ReadAll","align","ArticlesContainer","_useState","useState","data","setData","_useState2","loading","isLoading","_useState3","error","setError","useEffect","fetch","helpCenterUrl","label","then","response","status","json","result","err","map","article","i","article_type"],"mappings":"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"} \ No newline at end of file diff --git a/package.json b/package.json index c32fa38..28d98da 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dh-js-blog-utils", - "version": "1.6.0", + "version": "1.7.0", "description": "Components and logic needed to render the blog on dh-home and dh-mdr-home", "type": "module", "source": "src/index.js", diff --git a/src/SummarySection.jsx b/src/SummarySection.jsx index 0906c11..66cf412 100644 --- a/src/SummarySection.jsx +++ b/src/SummarySection.jsx @@ -7,7 +7,6 @@ import Error from "./Error"; import ReadAllButton from "./ReadAllButton"; import styled from "styled-components"; import { device } from "./assets/breakpoints"; -import { helpCenterUrl } from "./assets/urls"; export default function SummarySection() { const [data, setData] = useState(); @@ -15,9 +14,9 @@ export default function SummarySection() { const [error, setError] = useState(null); useEffect(() => { - const getApiData = () => { + const getApiData = ({ helpCenterUrl, label }) => { fetch( - `${helpCenterUrl}/help_backend/confluence_documents/blog/label/blog/latest/3` + `${helpCenterUrl}/help_backend/confluence_documents/blog/label/${label}/latest/3` ) .then((response) => { if (response.status >= 200 && response.status < 300) {