diff --git a/src/DevHub/App.jsx b/src/DevHub/App.jsx index 0715e7a65..05ffec7cb 100644 --- a/src/DevHub/App.jsx +++ b/src/DevHub/App.jsx @@ -45,7 +45,7 @@ const Theme = styled.div` if (!page) { // If no page is specified, we default to the home page - page = "home"; + page = "feed"; } // This is our navigation, rendering the page based on the page parameter @@ -118,7 +118,7 @@ function Page() { // TODO: This needs to be updated, old widget has the header attached return ( ({ -// ...lastKnownState, -// initial: { author, tag }, -// author, -// tag, -// })); -// } - const onTagSearch = (tag) => { setTag(tag); }; diff --git a/src/DevHub/modules/contract-sdk.jsx b/src/DevHub/modules/contract-sdk.jsx index dc14464f9..726904cd6 100644 --- a/src/DevHub/modules/contract-sdk.jsx +++ b/src/DevHub/modules/contract-sdk.jsx @@ -14,6 +14,10 @@ function getCommunity(devHubAccountId, { handle }) { return Near.view(devHubAccountId, "get_community", { handle }) ?? null; } +function getFeaturedCommunities(devHubAccountId) { + return Near.view(devHubAccountId, "get_featured_communities") ?? null; +} + function getAccountCommunityPermissions(devHubAccountId, { account_id, community_handle }) { return ( Near.view(devHubAccountId, "get_account_community_permissions", { @@ -139,6 +143,7 @@ return { hasModerator, createCommunity, getCommunity, + getFeaturedCommunities, getAccountCommunityPermissions, updateCommunity, deleteCommunity, diff --git a/src/DevHub/modules/utils.jsx b/src/DevHub/modules/utils.jsx index 0dc0879dd..9a8b94870 100644 --- a/src/DevHub/modules/utils.jsx +++ b/src/DevHub/modules/utils.jsx @@ -49,10 +49,12 @@ const Struct = { }; function href({ gateway, widgetSrc, params }) { - params = Object.entries(params) - .filter(([_key, nullable]) => (nullable ?? null) !== null) - .map(([key, value]) => `${key}=${value}`) - .join("&"); + if (params) { + params = (Object.entries(params) || []) + .filter(([_key, nullable]) => (nullable ?? null) !== null) + .map(([key, value]) => `${key}=${value}`) + .join("&"); + } return `${gateway ? `https://${gateway}` : ""}/${widgetSrc}/${ params ? `?${params}` : "" diff --git a/src/DevHub/pages/feed.jsx b/src/DevHub/pages/feed.jsx new file mode 100644 index 000000000..8e8125686 --- /dev/null +++ b/src/DevHub/pages/feed.jsx @@ -0,0 +1,139 @@ +const { + nearDevGovGigsWidgetsAccountId, + nearDevGovGigsContractAccountId, + author, + recency, + tag, +} = props; + +const { getFeaturedCommunities } = VM.require( + `${nearDevGovGigsWidgetsAccountId}/widget/DevHub.modules.contract-sdk` +); + +const { href } = VM.require( + `${nearDevGovGigsWidgetsAccountId}/widget/DevHub.modules.utils` +); + +if (!getFeaturedCommunities || !href) { + return

Loading modules...

; +} + +const Gradient = styled.div` + { + height: 250px; + text-align: center; + background: radial-gradient( + circle, + rgba(29, 55, 57, 1) 30%, + rgba(24, 24, 24, 1) 80% + ); + + font-family: Arial, sans-serif; + } + + .text-primary-gradient { + color: #53fdca; + -webkit-text-fill-color: transparent; + background-image: linear-gradient(#8e76ba, #1ed2f0); + -webkit-background-clip: text; + background-clip: text; + } + + .subtitle-above { + font-size: 18px; + letter-spacing: 1px; + font-family: Courier, monospace; + } + + .subtitle-below { + font-size: 16px; + } + + .slogan { + font-weight: 600; + font-size: 60px; + } +`; + +const featuredCommunities = + getFeaturedCommunities(nearDevGovGigsContractAccountId) || []; + +function Banner() { + return ( +
+ +
+ A decentralized community of +
+ +

+ NEAR Developers +

+ +
+ Share your ideas, match solutions, and access support and funding. +
+
+ +
+
+
Featured Communities
+
+
+ {featuredCommunities.map((community) => ( + + ))} +
+
+ +
Activity
+
+ ); +} + +const [searchTag, setSearchTag] = useState(tag || ""); +const [searchAuthor, setSearchAthor] = useState(author || ""); + +const onTagSearch = (tag) => { + setSearchTag(tag); +}; + +const onAuthorSearch = (author) => { + setSearchAthor(author); +}; +return ( +
+ + + ), + onAuthorSearch, + onTagSearch, + recency, + tag: searchTag, + tagQuery: { tag: searchTag }, + transactionHashes: props.transactionHashes, + nearDevGovGigsContractAccountId: nearDevGovGigsContractAccountId, + nearDevGovGigsWidgetsAccountId: nearDevGovGigsWidgetsAccountId, + }} + /> +
+);