Skip to content

Commit

Permalink
Merge pull request #416 from HoomanDgtl/ecosystem-updates
Browse files Browse the repository at this point in the history
update: ecosystem showcase ui/ux
  • Loading branch information
HoomanDgtl authored Nov 16, 2024
2 parents 0635037 + 0cbd525 commit b7193f8
Show file tree
Hide file tree
Showing 25 changed files with 342 additions and 1,575 deletions.
28 changes: 24 additions & 4 deletions src/components/ecosystem-pages/categories-mobile.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,8 @@ const Categories = ({
page: string;
className?: string;
}) => {
console.log(page);

return (
<Menu
as="div"
Expand Down Expand Up @@ -44,27 +46,45 @@ const Categories = ({
<Menu.Item>
{({ active }) => (
<a
href={`/ecosystem/${page}/latest`}
href={`/ecosystem/${page}`}
className={classNames(
active
? "bg-gray-100 text-foreground dark:bg-darkGray"
: "text-[#687076]",
: "text-para",
"block px-4 py-2 text-sm",
)}
>
All
</a>
)}
</Menu.Item>
{page === "deployed-on-akash" && (
<Menu.Item>
{({ active }) => (
<a
href={`/ecosystem/deployed-on-akash/showcase/`}
className={classNames(
active
? "bg-gray-100 text-foreground dark:bg-darkGray"
: "text-para",
"block px-4 py-2 text-sm",
)}
>
Showcase
</a>
)}
</Menu.Item>
)}

{tags?.map((tag: string) => (
<Menu.Item key={tag}>
{({ active }) => (
<a
href={`/ecosystem/${page}/${tag.toLowerCase()}/latest/1`}
href={`/ecosystem/${page}/${tag.toLowerCase()}`}
className={classNames(
active
? "bg-gray-100 text-foreground dark:bg-darkGray"
: "text-[#687076]",
: "text-para",
"block px-4 py-2 text-sm",
)}
>
Expand Down
34 changes: 24 additions & 10 deletions src/components/ecosystem-pages/categories.astro
Original file line number Diff line number Diff line change
Expand Up @@ -44,25 +44,39 @@ const displayTag = (tag: string) => {

<div class="mt-4 flex flex-col gap-y-4">
<a
href={`/ecosystem/${pathName?.[2]}/latest`}
class={`inline-flex cursor-pointer text-base font-medium hover:text-primary ${
astroUrl.pathname === `/ecosystem/${pathName?.[2]}/latest`
href={`/ecosystem/${pathName?.[2]}/`}
class={`inline-flex cursor-pointer text-base hover:text-primary ${
astroUrl.pathname === `/ecosystem/${pathName?.[2]}/`
? "text-primary"
: "text-para"
}`}
>
All
</a>
{
astroUrl.pathname.includes("deployed-on-akash") && (
<a
href={`/ecosystem/${pathName?.[2]}/showcase/`}
class={`inline-flex cursor-pointer text-base hover:text-primary ${
astroUrl.pathname?.includes("showcase")
? "text-primary"
: "text-para"
}`}
>
Showcase
</a>
)
}
{
sortedTags.map((tag: string) => (
<a
href={`/ecosystem/${pathName?.[2]}/${tag.toLowerCase()}/latest/1`}
class={`inline-flex cursor-pointer text-base font-medium hover:text-primary ${
astroUrl.pathname
.split("/")[3]
.split("%20")
.join(" ")
.toLowerCase() === tag.toLowerCase()
href={`/ecosystem/${pathName?.[2]}/${tag.toLowerCase()}`}
class={`inline-flex cursor-pointer text-base hover:text-primary ${
astroUrl?.pathname
?.split("/")?.[3]
?.split("%20")
?.join(" ")
?.toLowerCase() === tag?.toLowerCase()
? "text-primary"
: "text-para"
}`}
Expand Down
62 changes: 62 additions & 0 deletions src/components/ecosystem-pages/ecosystem-page.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
---
import ProjectCard from "@/components/ecosystem-pages/project-card.astro";
import Layout from "@/layouts/layout.astro";
import { type CollectionEntry } from "astro:content";
import Categories from "@/components/ecosystem-pages/categories.astro";
import TopHeader from "@/components/ecosystem-pages/top-header.astro";
import TopMargin from "@/components/ui/top-margin.astro";
import SearchDialog from "./search-dialog";
type Project = CollectionEntry<"Ecosystem_Page">;
const { projects, tags, title } = Astro.props;
const astroUrl = Astro.url;
---

<Layout
title={`${title ? `${title} | ` : ""} Deployed On Akash`}
image="/meta-images/ecosystem.png"
>
<TopMargin>
<TopHeader tags={tags} />
</TopMargin>

<div
class="container mt-4 flex justify-between md:mt-10 lg:gap-x-[20px] xl:gap-x-[48px]"
>
<Categories tags={tags} />

<div>
<div class="flex items-center justify-between">
<h2
class="text-[20px] font-semibold leading-[28px] md:text-2lg md:leading-[48px]"
>
{title || "Deployed On Akash"}
</h2>
<div class="hidden md:block">
<SearchDialog client:load currentPath={astroUrl.pathname} />
</div>
</div>

<div
class="mt-4 grid flex-shrink-0 grid-cols-1 gap-y-[24px] sm:grid-cols-2 sm:gap-x-8 md:gap-y-8 lg:grid-cols-3 lg:gap-x-[36px] lg:gap-y-[32px]"
>
{
projects?.map((project: Project, i: number) => {
return (
<ProjectCard
title={project.data.projectTitle}
description={project.data.description}
image={project.data.projectImage}
button={project.data.ctaButton}
githubLink={project.data.githubLink}
twitterLink={project.data.twitterLink}
websiteLink={project.data.websiteLink}
discordLink={project.data.discordLink}
/>
);
})
}
</div>
</div>
</div>
</Layout>
10 changes: 4 additions & 6 deletions src/components/ecosystem-pages/top-header.astro
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,10 @@ const pathName = astroUrl.pathname.split("/");
const { tags } = Astro.props;
---

<div class="flex items-center justify-between">
<h1 class="text-3xl md:text-4xl lg:text-5xl">Explore the Akash Ecosystem</h1>
<div class="hidden md:block">
<SearchDialog client:load currentPath={astroUrl.pathname} />
</div>
</div>
<h1 class="w-full text-center text-3xl md:text-4xl lg:text-5xl">
Explore the Akash Ecosystem
</h1>

<div
class="mt-6 flex flex-col justify-between gap-x-6 pb-6 md:mt-8 md:pb-8 lg:mt-10 lg:flex-row lg:border-b lg:pb-10"
>
Expand Down
47 changes: 20 additions & 27 deletions src/components/header/popovers/links.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {
CalendarHeart,
Codesandbox,
FileStack,
GraduationCap,
HeartHandshake,
} from "lucide-react";

Expand Down Expand Up @@ -286,12 +285,6 @@ export const networkItems = [
];

export const ecosystemNavItems = [
{
icon: GraduationCap,
title: "Showcase",

link: "/ecosystem/showcase/latest/",
},
{
customIcon: (
<svg
Expand All @@ -302,52 +295,46 @@ export const ecosystemNavItems = [
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M13 21H4C2.89543 21 2 20.1046 2 19V5C2 3.89543 2.89543 3 4 3H20C21.1046 3 22 3.89543 22 5V13"
d="M16.0614 10.4037L14 17L10 17L7.93865 10.4037C7.35085 8.52273 7.72417 6.47307 8.93738 4.92015L11.5272 1.6052C11.7674 1.29772 12.2326 1.29772 12.4728 1.6052L15.0626 4.92015C16.2758 6.47307 16.6491 8.52273 16.0614 10.4037Z"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
/>
<path
d="M22 17.2798C22 17.8812 21.7625 18.4588 21.3383 18.8861C20.3619 19.8701 19.415 20.8961 18.4021 21.8443C18.17 22.0585 17.8017 22.0507 17.5795 21.8268L14.6615 18.8861C13.7795 17.9972 13.7795 16.5623 14.6615 15.6734C15.5522 14.7758 17.0032 14.7758 17.8938 15.6734L17.9999 15.7803L18.1059 15.6734C18.533 15.2429 19.1146 15 19.7221 15C20.3297 15 20.9113 15.2428 21.3383 15.6734C21.7625 16.1007 22 16.6784 22 17.2798Z"
stroke="currentColor"
stroke-width="1.5"
stroke-linejoin="round"
/>
<path
d="M2 7L22 7"
d="M10 20C10 22 12 23 12 23C12 23 14 22 14 20"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M5 5.01L5.01 4.99889"
d="M8.5 12.5C5 15 7 19 7 19L10 17"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M8 5.01L8.01 4.99889"
d="M15.9316 12.5C19.4316 15 17.4316 19 17.4316 19L14.4316 17"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M11 5.01L11.01 4.99889"
d="M12 11C10.8954 11 10 10.1046 10 9C10 7.89543 10.8954 7 12 7C13.1046 7 14 7.89543 14 9C14 10.1046 13.1046 11 12 11Z"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
),
title: "Tools",
title: "Deployed on Akash",

link: "/ecosystem/akash-tools/latest/",
link: "/ecosystem/deployed-on-akash/",
},

{
customIcon: (
<svg
Expand All @@ -358,46 +345,52 @@ export const ecosystemNavItems = [
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M16.0614 10.4037L14 17L10 17L7.93865 10.4037C7.35085 8.52273 7.72417 6.47307 8.93738 4.92015L11.5272 1.6052C11.7674 1.29772 12.2326 1.29772 12.4728 1.6052L15.0626 4.92015C16.2758 6.47307 16.6491 8.52273 16.0614 10.4037Z"
d="M13 21H4C2.89543 21 2 20.1046 2 19V5C2 3.89543 2.89543 3 4 3H20C21.1046 3 22 3.89543 22 5V13"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
/>
<path
d="M22 17.2798C22 17.8812 21.7625 18.4588 21.3383 18.8861C20.3619 19.8701 19.415 20.8961 18.4021 21.8443C18.17 22.0585 17.8017 22.0507 17.5795 21.8268L14.6615 18.8861C13.7795 17.9972 13.7795 16.5623 14.6615 15.6734C15.5522 14.7758 17.0032 14.7758 17.8938 15.6734L17.9999 15.7803L18.1059 15.6734C18.533 15.2429 19.1146 15 19.7221 15C20.3297 15 20.9113 15.2428 21.3383 15.6734C21.7625 16.1007 22 16.6784 22 17.2798Z"
stroke="currentColor"
stroke-width="1.5"
stroke-linejoin="round"
/>
<path
d="M10 20C10 22 12 23 12 23C12 23 14 22 14 20"
d="M2 7L22 7"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M8.5 12.5C5 15 7 19 7 19L10 17"
d="M5 5.01L5.01 4.99889"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M15.9316 12.5C19.4316 15 17.4316 19 17.4316 19L14.4316 17"
d="M8 5.01L8.01 4.99889"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M12 11C10.8954 11 10 10.1046 10 9C10 7.89543 10.8954 7 12 7C13.1046 7 14 7.89543 14 9C14 10.1046 13.1046 11 12 11Z"
d="M11 5.01L11.01 4.99889"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
),
title: "Deployed on Akash",
title: "Tools",

link: "/ecosystem/deployed-on-akash/latest/",
link: "/ecosystem/akash-tools/",
},

{
icon: FileStack,
title: "Case Studies",
Expand Down
2 changes: 1 addition & 1 deletion src/content/Ecosystem_Page/morpheus/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
projectTitle: Morpheus
projectImage: "./project-banner.png"
pubDate: "2024-05-08"
showcase: false
showcase: true
tags:
- AI & ML

Expand Down
47 changes: 47 additions & 0 deletions src/pages/ecosystem/akash-tools/[tag]/index.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
---
import { getCollection } from "astro:content";
import EcosystemPage from "@/components/ecosystem-pages/ecosystem-page.astro";
export async function getStaticPaths() {
const projects = (await getCollection("Ecosystem_Page"))
.filter((project) => project.data.category === "tool")
.sort((a, b) => {
const dateA = new Date(a.data.pubDate);
const dateB = new Date(b.data.pubDate);
return dateB.getTime() - dateA.getTime();
});
const tags: string[] = [];
projects.forEach((project) => {
project.data.tags.forEach((tag: string) => {
const lowerCasedTag = tag.toLowerCase();
if (!tags.includes(lowerCasedTag)) {
tags.push(lowerCasedTag);
}
});
});
return tags.flatMap((tag) => {
const lowercasedTag = tag.toLowerCase();
const filteredPosts = projects.filter((post) =>
post.data.tags.some((tag: string) => tag.toLowerCase() === lowercasedTag),
);
return {
params: { tag },
props: { currentTag: tag, tags: tags, page: filteredPosts },
};
});
}
const { page, currentTag, tags } = Astro.props;
const formattedTag = currentTag.charAt(0).toUpperCase() + currentTag.slice(1);
---

<EcosystemPage title={formattedTag} tags={tags} projects={page} />
Loading

0 comments on commit b7193f8

Please sign in to comment.