From 24bfcc10dffb786cdabe9328195db66bbdad0113 Mon Sep 17 00:00:00 2001 From: Blaquewithaq Date: Sun, 15 Jun 2025 11:57:16 -0500 Subject: [PATCH 1/2] feat: added project page and organized github cards into components --- app/components/projects/GitHubGrid.vue | 36 ++++++++++ app/components/projects/GitHubGridCard.vue | 72 +++++++++++++++++++ app/pages/download.vue | 28 ++++++++ app/pages/download/[...slug].vue | 9 --- app/pages/index.vue | 84 +++------------------- app/pages/projects.vue | 54 +++++++++++++- content.config.ts | 30 ++++++++ content/2.download.yml | 22 ++++++ content/3.projects.yml | 17 +++++ content/4.blog/.navigation.yml | 1 + content/app.yml | 4 +- package.json | 1 - shared/utils/useProjects.ts | 36 +++++++++- 13 files changed, 305 insertions(+), 89 deletions(-) create mode 100644 app/components/projects/GitHubGrid.vue create mode 100644 app/components/projects/GitHubGridCard.vue create mode 100644 app/pages/download.vue delete mode 100644 app/pages/download/[...slug].vue create mode 100644 content/2.download.yml create mode 100644 content/3.projects.yml create mode 100644 content/4.blog/.navigation.yml diff --git a/app/components/projects/GitHubGrid.vue b/app/components/projects/GitHubGrid.vue new file mode 100644 index 0000000..fe272c6 --- /dev/null +++ b/app/components/projects/GitHubGrid.vue @@ -0,0 +1,36 @@ + + + diff --git a/app/components/projects/GitHubGridCard.vue b/app/components/projects/GitHubGridCard.vue new file mode 100644 index 0000000..91ed8d1 --- /dev/null +++ b/app/components/projects/GitHubGridCard.vue @@ -0,0 +1,72 @@ + + + diff --git a/app/pages/download.vue b/app/pages/download.vue new file mode 100644 index 0000000..0f9ea55 --- /dev/null +++ b/app/pages/download.vue @@ -0,0 +1,28 @@ + + + diff --git a/app/pages/download/[...slug].vue b/app/pages/download/[...slug].vue deleted file mode 100644 index 9fe125d..0000000 --- a/app/pages/download/[...slug].vue +++ /dev/null @@ -1,9 +0,0 @@ - - - diff --git a/app/pages/index.vue b/app/pages/index.vue index 0d7c38c..1620cd4 100644 --- a/app/pages/index.vue +++ b/app/pages/index.vue @@ -2,7 +2,7 @@ import { VideoPlayer } from '@videojs-player/vue' import 'video.js/dist/video-js.css' -const { data: page } = await useAsyncData('index', () => queryCollection('index').first()) +const { data: page } = await useAsyncData('page-index', () => queryCollection('index').first()) const title = page.value?.seo?.title || page.value?.title const description = page.value?.seo?.description || page.value?.description @@ -19,7 +19,7 @@ const { isMobile } = useDevice() const videoReady = ref(false) -const projects = ref([]) +const projects = ref([]) const contributors = ref([]) const loadingProjects = ref(true) @@ -57,6 +57,8 @@ onMounted(async () => { projects.value = projectData + console.log('Projects loaded:', projects.value) + await new Promise(resolve => setTimeout(resolve, 300)) } catch (error) { console.error('Error loading projects:', error) @@ -130,77 +132,13 @@ onMounted(async () => { container: 'pb-8 sm:pb-12 lg:pb-20' }" > - - - - - + +const { data: page } = await useAsyncData('page-projects', () => queryCollection('projects').first()) +const title = page.value?.seo?.title || page.value?.title +const description = page.value?.seo?.description || page.value?.description + +useSeoMeta({ + titleTemplate: '', + title, + ogTitle: title, + description, + ogDescription: description +}) + +const projects = ref([]) +const loadingProjects = ref(true) + +onMounted(async () => { + try { + const projectData = await useProjects({ + itemsToShow: page.value?.projects?.itemsToShow || 0, + featured: page.value?.projects?.featured || [], + sortBy: page.value?.projects?.sortBy || 'stars' + }) + + projects.value = projectData + + await new Promise(resolve => setTimeout(resolve, 300)) + } catch (error) { + console.error('Error loading projects:', error) + } finally { + if (projects.value.length > 0) { + loadingProjects.value = false + } else { + console.warn('No projects found.') + } + } +}) diff --git a/content.config.ts b/content.config.ts index 145f362..d0c5847 100644 --- a/content.config.ts +++ b/content.config.ts @@ -110,6 +110,36 @@ const collections = { docs: defineCollection({ type: 'page', source: '1.docs/**/*' + }), + download: defineCollection({ + type: 'page', + source: '2.download.yml', + schema: z.object({ + download: createBaseSchema().extend({ + reverse: z.boolean().optional(), + orientation: z.enum(orientationEnum).optional(), + icon: z.string().optional() + }).optional() + }) + }), + projects: defineCollection({ + type: 'page', + source: '3.projects.yml', + schema: z.object({ + projects: createBaseSchema().extend({ + reverse: z.boolean().optional(), + orientation: z.enum(orientationEnum).optional(), + icon: z.string().optional(), + itemsToShow: z.number().optional(), + sortBy: z.enum(['name', 'updated', 'stars', 'forks']).optional(), + featured: z.array(z.string()).optional() + }).optional() + }) + }), + blog: defineCollection({ + type: 'page', + source: '4.blog/**/*', + schema: z.object({}) }) } diff --git a/content/2.download.yml b/content/2.download.yml new file mode 100644 index 0000000..cf0f085 --- /dev/null +++ b/content/2.download.yml @@ -0,0 +1,22 @@ +title: +description: +seo: + title: + description: +navigation.icon: i-lucide-download + +download: + reverse: false + orientation: vertical + icon: i-lucide-folder-root + title: Download + description: Find the latest releases of our software and tools. + features: + - title: Applications + description: Download our software packages. + icon: i-lucide-package + link: /download/application + - title: Library + description: Download our command-line tools. + icon: i-lucide-terminal + link: /download/library diff --git a/content/3.projects.yml b/content/3.projects.yml new file mode 100644 index 0000000..1085dce --- /dev/null +++ b/content/3.projects.yml @@ -0,0 +1,17 @@ +title: +description: +seo: + title: + description: +navigation.icon: i-lucide-folder-root + +projects: + reverse: false + orientation: vertical + icon: i-lucide-folder-root + title: Our Projects + description: Explore our open-source projects that help developers build more inspiring applications. + itemsToShow: 0 + sortBy: stars + # featured: + # - projectm diff --git a/content/4.blog/.navigation.yml b/content/4.blog/.navigation.yml new file mode 100644 index 0000000..ab36760 --- /dev/null +++ b/content/4.blog/.navigation.yml @@ -0,0 +1 @@ +navigation.icon: i-lucide-pen diff --git a/content/app.yml b/content/app.yml index c33189a..8b43ecf 100644 --- a/content/app.yml +++ b/content/app.yml @@ -17,11 +17,11 @@ links: - label: Download icon: i-lucide-download to: /download - disabled: true + disabled: false - label: Projects icon: i-lucide-folder-root to: /projects - disabled: true + disabled: false - label: Blog icon: i-lucide-pencil to: /blog diff --git a/package.json b/package.json index 46fdc3d..297d5a1 100644 --- a/package.json +++ b/package.json @@ -59,7 +59,6 @@ "vue-tsc": "^2.2.10" }, "trustedDependencies": [ - "better-sqlite3", "@parcel/watcher", "@tailwindcss/oxide", "unrs-resolver" diff --git a/shared/utils/useProjects.ts b/shared/utils/useProjects.ts index fc74f57..0e8883e 100644 --- a/shared/utils/useProjects.ts +++ b/shared/utils/useProjects.ts @@ -15,6 +15,21 @@ export interface ProjectItem { forks_count: number } +export interface ProjectExportItem { + id: number + to: string + name: string + fullName: string + description: string + owner: { + src: string + alt: string + } + updatedAt: string + stars: number + forks: number +} + export async function useProjects({ itemsToShow, featured, @@ -23,7 +38,7 @@ export async function useProjects({ featured: string[] sortBy: SortByEnum itemsToShow: number -}): Promise { +}): Promise { const keyEnv = useRuntimeConfig().public.assetKey if (!keyEnv) { @@ -89,5 +104,22 @@ export async function useProjects({ } }) - return sorted.slice(0, Math.min(itemsToShow, sorted.length)) + const sortedItems = itemsToShow === 0 ? sorted : sorted.slice(0, Math.min(itemsToShow, sorted.length)) + + const exportItems: ProjectExportItem[] = sortedItems.map(item => ({ + id: item.id, + to: item.html_url, + name: item.name, + fullName: item.full_name, + description: item.description || '', + owner: { + src: item.owner.avatar_url, + alt: item.owner.login + }, + updatedAt: new Date(item.updated_at).toLocaleDateString(), + stars: item.stargazers_count || 0, + forks: item.forks_count || 0 + })) + + return exportItems } From 69b329adac8782a3e3a91110506b4ce988948f99 Mon Sep 17 00:00:00 2001 From: Blaquewithaq Date: Sun, 15 Jun 2025 19:01:51 -0500 Subject: [PATCH 2/2] feat: added download page, centralized data and misc fixes --- app/app.vue | 4 + app/components/app/Footer.vue | 2 +- app/components/download/DownloadsGrid.vue | 21 +++ app/components/download/DownloadsGridCard.vue | 109 +++++++++++ app/components/projects/GitHubGridCard.vue | 8 +- app/pages/download.vue | 15 +- app/pages/index.vue | 29 ++- app/pages/projects.vue | 7 +- app/stores/data.ts | 174 +++++++++++++++++- content.config.ts | 19 +- content/2.download.yml | 40 +++- package.json | 1 + scripts/generate-reports.ts | 62 ++++++- shared/types/contributors.d.ts | 16 ++ shared/types/projects.d.ts | 55 ++++++ shared/utils/useContributors.ts | 53 ------ shared/utils/useConverter.ts | 14 ++ shared/utils/useProjects.ts | 125 ------------- shared/utils/useStyle.ts | 12 +- 19 files changed, 544 insertions(+), 222 deletions(-) create mode 100644 app/components/download/DownloadsGrid.vue create mode 100644 app/components/download/DownloadsGridCard.vue create mode 100644 shared/types/contributors.d.ts create mode 100644 shared/types/projects.d.ts delete mode 100644 shared/utils/useContributors.ts create mode 100644 shared/utils/useConverter.ts delete mode 100644 shared/utils/useProjects.ts diff --git a/app/app.vue b/app/app.vue index d759f4c..4d200ab 100644 --- a/app/app.vue +++ b/app/app.vue @@ -34,6 +34,10 @@ const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSe const { data: app } = await useAsyncData('links', () => queryCollection('app').first()) provide('navigation', navigation) + +const dataStore = useDataStore() +await dataStore.fetchProjects() +await dataStore.fetchContributors()