From acafea3842b2fd9e46968e7ba8b497f4e9894fdd Mon Sep 17 00:00:00 2001 From: neil Date: Sun, 27 Nov 2022 18:53:51 +0800 Subject: [PATCH 1/5] make mock packages reusable --- packages/gui/src/libs/api/mock.ts | 285 +++++++++++++++--------------- 1 file changed, 143 insertions(+), 142 deletions(-) diff --git a/packages/gui/src/libs/api/mock.ts b/packages/gui/src/libs/api/mock.ts index d58553f..57736f1 100644 --- a/packages/gui/src/libs/api/mock.ts +++ b/packages/gui/src/libs/api/mock.ts @@ -6,149 +6,150 @@ * * make cors work with api.tea.xyz/v1 */ import type { Package } from '../types'; +const packages: Package[] = [ + { + slug: 'mesonbuild_com', + homepage: 'https://mesonbuild.com', + name: 'mesonbuild.com', + version: '0.63.3', + last_modified: '2022-10-06T15:45:08.000Z', + full_name: 'mesonbuild.com', + dl_count: 270745, + thumb_image_name: 'mesonbuild_com_option 1.jpg ', + maintainer: '', + desc: 'Fast and user friendly build system', + thumb_image_url: 'https://tea.xyz/Images/packages/mesonbuild_com.jpg', + installs: 0 + }, + { + slug: 'pixman_org', + homepage: 'http://www.pixman.org/', + maintainer: 'freedesktop', + name: 'pixman.org', + version: '0.40.0', + last_modified: '2022-09-26T19:37:47.000Z', + full_name: 'pixman.org', + dl_count: 0, + thumb_image_name: 'pixman_org_option 1.jpg ', + desc: 'Pixman is a library that provides low-level pixel manipulation features such as image compositing and trapezoid rasterization.', + thumb_image_url: 'https://tea.xyz/Images/packages/pixman_org.jpg', + installs: 0 + }, + { + slug: 'freedesktop_org_pkg_config', + homepage: 'https://freedesktop.org', + maintainer: 'freedesktop.org', + name: 'pkg-config', + version: '0.29.2', + last_modified: '2022-10-20T01:32:15.000Z', + full_name: 'freedesktop.org/pkg-config', + dl_count: 2661501, + thumb_image_name: 'freedecktop_org_pkg_config option 1.jpg ', + desc: 'Manage compile and link flags for libraries', + thumb_image_url: 'https://tea.xyz/Images/packages/freedesktop_org_pkg_config.jpg', + installs: 0 + }, + { + slug: 'gnu_org_gettext', + homepage: 'https://gnu.org', + maintainer: 'gnu.org', + name: 'gettext', + version: '0.21.1', + last_modified: '2022-10-20T01:23:46.000Z', + full_name: 'gnu.org/gettext', + dl_count: 3715970, + thumb_image_name: 'gnu_org_gettext_option 1.jpg ', + desc: 'GNU internationalization (i18n) and localization (l10n) library', + thumb_image_url: 'https://tea.xyz/Images/packages/gnu_org_gettext.jpg', + installs: 0 + }, + { + slug: 'ipfs_tech', + homepage: 'https://ipfs.tech', + name: 'ipfs.tech', + version: '0.16.0', + last_modified: '2022-10-19T21:36:52.000Z', + full_name: 'ipfs.tech', + dl_count: 14457, + thumb_image_name: 'ipfs_tech_option 2.jpg ', + maintainer: '', + desc: 'Peer-to-peer hypermedia protocol', + thumb_image_url: 'https://tea.xyz/Images/packages/ipfs_tech.jpg', + installs: 0 + }, + { + slug: 'nixos_org_patchelf', + homepage: 'https://nixos.org', + maintainer: 'nixos.org', + name: 'patchelf', + version: '0.15.0', + last_modified: '2022-09-27T04:50:44.000Z', + full_name: 'nixos.org/patchelf', + dl_count: 0, + thumb_image_name: 'nixos_org_patchelf_option 1.jpg ', + desc: 'PatchELF is a simple utility for modifying existing ELF executables and libraries.', + thumb_image_url: 'https://tea.xyz/Images/packages/nixos_org_patchelf.jpg', + installs: 0 + }, + { + slug: 'tea_xyz', + homepage: 'https://tea.xyz', + maintainer: 'tea.xyz', + name: 'tea.xyz', + version: '0.8.6', + last_modified: '2022-10-19T19:13:51.000Z', + full_name: 'tea.xyz', + dl_count: 0, + thumb_image_name: 'tea_xyz_option 2.jpg ', + desc: 'Website of tea.xyz', + thumb_image_url: 'https://tea.xyz/Images/packages/tea_xyz.jpg', + installs: 0 + }, + { + slug: 'charm_sh_gum', + homepage: 'https://charm.sh', + maintainer: 'charm.sh', + name: 'gum', + version: '0.8.0', + last_modified: '2022-10-21T02:15:16.000Z', + full_name: 'charm.sh/gum', + dl_count: 0, + thumb_image_name: 'charm_sh_gum.jpg ', + desc: '', + thumb_image_url: 'https://tea.xyz/Images/packages/charm_sh_gum.jpg', + installs: 0 + }, + { + slug: 'pyyaml_org', + homepage: 'https://pyyaml.org', + name: 'pyyaml.org', + version: '0.2.5', + last_modified: '2022-10-03T15:35:14.000Z', + full_name: 'pyyaml.org', + dl_count: 107505, + thumb_image_name: 'pyyaml_org_option 1.jpg ', + maintainer: '', + desc: 'YAML framework for Python', + thumb_image_url: 'https://tea.xyz/Images/packages/pyyaml_org.jpg', + installs: 0 + }, + { + slug: 'tea_xyz_gx_cc', + homepage: 'https://tea.xyz', + maintainer: 'tea.xyz', + name: 'cc', + version: '0.1.0', + last_modified: '2022-10-19T16:47:44.000Z', + full_name: 'tea.xyz/gx/cc', + dl_count: 0, + thumb_image_name: 'tea_xyz_gx.jpg ', + desc: '', + thumb_image_url: 'https://tea.xyz/Images/packages/tea_xyz_gx_cc.jpg', + installs: 0 + } +]; export async function getPackages(): Promise { - const packages: Package[] = [ - { - slug: 'mesonbuild_com', - homepage: 'https://mesonbuild.com', - name: 'mesonbuild.com', - version: '0.63.3', - last_modified: '2022-10-06T15:45:08.000Z', - full_name: 'mesonbuild.com', - dl_count: 270745, - thumb_image_name: 'mesonbuild_com_option 1.jpg ', - maintainer: '', - desc: 'Fast and user friendly build system', - thumb_image_url: 'https://tea.xyz/Images/packages/mesonbuild_com.jpg', - installs: 0 - }, - { - slug: 'pixman_org', - homepage: 'http://www.pixman.org/', - maintainer: 'freedesktop', - name: 'pixman.org', - version: '0.40.0', - last_modified: '2022-09-26T19:37:47.000Z', - full_name: 'pixman.org', - dl_count: 0, - thumb_image_name: 'pixman_org_option 1.jpg ', - desc: 'Pixman is a library that provides low-level pixel manipulation features such as image compositing and trapezoid rasterization.', - thumb_image_url: 'https://tea.xyz/Images/packages/pixman_org.jpg', - installs: 0 - }, - { - slug: 'freedesktop_org_pkg_config', - homepage: 'https://freedesktop.org', - maintainer: 'freedesktop.org', - name: 'pkg-config', - version: '0.29.2', - last_modified: '2022-10-20T01:32:15.000Z', - full_name: 'freedesktop.org/pkg-config', - dl_count: 2661501, - thumb_image_name: 'freedecktop_org_pkg_config option 1.jpg ', - desc: 'Manage compile and link flags for libraries', - thumb_image_url: 'https://tea.xyz/Images/packages/freedesktop_org_pkg_config.jpg', - installs: 0 - }, - { - slug: 'gnu_org_gettext', - homepage: 'https://gnu.org', - maintainer: 'gnu.org', - name: 'gettext', - version: '0.21.1', - last_modified: '2022-10-20T01:23:46.000Z', - full_name: 'gnu.org/gettext', - dl_count: 3715970, - thumb_image_name: 'gnu_org_gettext_option 1.jpg ', - desc: 'GNU internationalization (i18n) and localization (l10n) library', - thumb_image_url: 'https://tea.xyz/Images/packages/gnu_org_gettext.jpg', - installs: 0 - }, - { - slug: 'ipfs_tech', - homepage: 'https://ipfs.tech', - name: 'ipfs.tech', - version: '0.16.0', - last_modified: '2022-10-19T21:36:52.000Z', - full_name: 'ipfs.tech', - dl_count: 14457, - thumb_image_name: 'ipfs_tech_option 2.jpg ', - maintainer: '', - desc: 'Peer-to-peer hypermedia protocol', - thumb_image_url: 'https://tea.xyz/Images/packages/ipfs_tech.jpg', - installs: 0 - }, - { - slug: 'nixos_org_patchelf', - homepage: 'https://nixos.org', - maintainer: 'nixos.org', - name: 'patchelf', - version: '0.15.0', - last_modified: '2022-09-27T04:50:44.000Z', - full_name: 'nixos.org/patchelf', - dl_count: 0, - thumb_image_name: 'nixos_org_patchelf_option 1.jpg ', - desc: 'PatchELF is a simple utility for modifying existing ELF executables and libraries.', - thumb_image_url: 'https://tea.xyz/Images/packages/nixos_org_patchelf.jpg', - installs: 0 - }, - { - slug: 'tea_xyz', - homepage: 'https://tea.xyz', - maintainer: 'tea.xyz', - name: 'tea.xyz', - version: '0.8.6', - last_modified: '2022-10-19T19:13:51.000Z', - full_name: 'tea.xyz', - dl_count: 0, - thumb_image_name: 'tea_xyz_option 2.jpg ', - desc: 'Website of tea.xyz', - thumb_image_url: 'https://tea.xyz/Images/packages/tea_xyz.jpg', - installs: 0 - }, - { - slug: 'charm_sh_gum', - homepage: 'https://charm.sh', - maintainer: 'charm.sh', - name: 'gum', - version: '0.8.0', - last_modified: '2022-10-21T02:15:16.000Z', - full_name: 'charm.sh/gum', - dl_count: 0, - thumb_image_name: 'charm_sh_gum.jpg ', - desc: '', - thumb_image_url: 'https://tea.xyz/Images/packages/charm_sh_gum.jpg', - installs: 0 - }, - { - slug: 'pyyaml_org', - homepage: 'https://pyyaml.org', - name: 'pyyaml.org', - version: '0.2.5', - last_modified: '2022-10-03T15:35:14.000Z', - full_name: 'pyyaml.org', - dl_count: 107505, - thumb_image_name: 'pyyaml_org_option 1.jpg ', - maintainer: '', - desc: 'YAML framework for Python', - thumb_image_url: 'https://tea.xyz/Images/packages/pyyaml_org.jpg', - installs: 0 - }, - { - slug: 'tea_xyz_gx_cc', - homepage: 'https://tea.xyz', - maintainer: 'tea.xyz', - name: 'cc', - version: '0.1.0', - last_modified: '2022-10-19T16:47:44.000Z', - full_name: 'tea.xyz/gx/cc', - dl_count: 0, - thumb_image_name: 'tea_xyz_gx.jpg ', - desc: '', - thumb_image_url: 'https://tea.xyz/Images/packages/tea_xyz_gx_cc.jpg', - installs: 0 - } - ]; + return packages; } From 53a9386b0adbef1210c28ae2bfa09eb79a9bcc92 Mon Sep 17 00:00:00 2001 From: neil Date: Mon, 28 Nov 2022 13:39:02 +0800 Subject: [PATCH 2/5] #32 initial implementation of @tea/ui:PackageCard --- .../FeaturedCourses/FeaturedCourses.svelte | 1 + .../components/Placeholder/Placeholder.svelte | 4 +- .../SearchPackages/SearchPackages.svelte | 12 +- packages/gui/src/libs/api/mock.ts | 1 - packages/gui/src/libs/types.ts | 18 +-- packages/gui/src/routes/+layout.svelte | 1 + packages/gui/tsconfig.json | 2 +- packages/tsconfig.cli.json | 8 -- packages/ui/src/PackageCard/PackageCard.css | 1 + .../ui/src/PackageCard/PackageCard.stories.ts | 45 ++++++ .../ui/src/PackageCard/PackageCard.svelte | 128 ++++++++++++++++++ packages/ui/src/types.ts | 14 ++ 12 files changed, 203 insertions(+), 32 deletions(-) delete mode 100644 packages/tsconfig.cli.json create mode 100644 packages/ui/src/PackageCard/PackageCard.css create mode 100644 packages/ui/src/PackageCard/PackageCard.stories.ts create mode 100644 packages/ui/src/PackageCard/PackageCard.svelte create mode 100644 packages/ui/src/types.ts diff --git a/packages/gui/src/components/FeaturedCourses/FeaturedCourses.svelte b/packages/gui/src/components/FeaturedCourses/FeaturedCourses.svelte index 35bfb88..c662ae7 100644 --- a/packages/gui/src/components/FeaturedCourses/FeaturedCourses.svelte +++ b/packages/gui/src/components/FeaturedCourses/FeaturedCourses.svelte @@ -4,3 +4,4 @@ +

test

diff --git a/packages/gui/src/components/Placeholder/Placeholder.svelte b/packages/gui/src/components/Placeholder/Placeholder.svelte index 513616f..5e5e9a7 100644 --- a/packages/gui/src/components/Placeholder/Placeholder.svelte +++ b/packages/gui/src/components/Placeholder/Placeholder.svelte @@ -2,7 +2,7 @@ export let label = ''; -
+
{label}
@@ -14,7 +14,7 @@ height: 100%; width: 100%; min-width: 100%; - background-color: #ccc; + /* background-color: #ccc; */ display: flex; } header { diff --git a/packages/gui/src/components/SearchPackages/SearchPackages.svelte b/packages/gui/src/components/SearchPackages/SearchPackages.svelte index 0fdecdb..7ca05b5 100644 --- a/packages/gui/src/components/SearchPackages/SearchPackages.svelte +++ b/packages/gui/src/components/SearchPackages/SearchPackages.svelte @@ -1,9 +1,11 @@ + +
+
+ {pkg.name} +
+ + + +

{pkg.name}

+ {#if pkg.maintainer} +

• {pkg.maintainer}

+ {/if} +
+
+ +
+ + diff --git a/packages/ui/src/types.ts b/packages/ui/src/types.ts new file mode 100644 index 0000000..1ce476c --- /dev/null +++ b/packages/ui/src/types.ts @@ -0,0 +1,14 @@ +export interface Package { + slug: string; + version: string; + full_name: string; + name: string; + maintainer: string; + homepage: string; + last_modified: Date | string; + thumb_image_url: string; + thumb_image_name: string; + desc: string; + dl_count: number; + installs: number; +} From 095040e74edfa32e9cb9f3d16c66f3e62357914b Mon Sep 17 00:00:00 2001 From: neil Date: Mon, 28 Nov 2022 14:30:07 +0800 Subject: [PATCH 3/5] #32 make SearchInput reusable component --- packages/gui/src-tauri/tauri.conf.json | 2 +- .../gui/src/components/NavBar/NavBar.svelte | 7 +-- .../SearchPackages/SearchPackages.svelte | 14 +++-- .../ui/src/PackageCard/PackageCard.svelte | 5 +- packages/ui/src/SearchInput/SearchInput.css | 1 + .../ui/src/SearchInput/SearchInput.stories.ts | 31 ++++++++++ .../ui/src/SearchInput/SearchInput.svelte | 62 +++++++++++++++++++ 7 files changed, 109 insertions(+), 13 deletions(-) create mode 100644 packages/ui/src/SearchInput/SearchInput.css create mode 100644 packages/ui/src/SearchInput/SearchInput.stories.ts create mode 100644 packages/ui/src/SearchInput/SearchInput.svelte diff --git a/packages/gui/src-tauri/tauri.conf.json b/packages/gui/src-tauri/tauri.conf.json index 9da9ca5..6696831 100644 --- a/packages/gui/src-tauri/tauri.conf.json +++ b/packages/gui/src-tauri/tauri.conf.json @@ -102,7 +102,7 @@ "height": 600, "resizable": true, "title": "gui", - "width": 800, + "width": 1024, "decorations": false } ] diff --git a/packages/gui/src/components/NavBar/NavBar.svelte b/packages/gui/src/components/NavBar/NavBar.svelte index 1efec05..e2424be 100644 --- a/packages/gui/src/components/NavBar/NavBar.svelte +++ b/packages/gui/src/components/NavBar/NavBar.svelte @@ -2,6 +2,7 @@ import { page } from '$app/stores'; import { open } from '@tauri-apps/api/shell'; import { appWindow } from '@tauri-apps/api/window'; + import SearchInput from '@tea/ui/SearchInput/SearchInput.svelte'; import { beforeUpdate } from 'svelte'; @@ -73,11 +74,7 @@ - + {#each routes as route}
  • diff --git a/packages/gui/src/components/SearchPackages/SearchPackages.svelte b/packages/gui/src/components/SearchPackages/SearchPackages.svelte index 7ca05b5..faba825 100644 --- a/packages/gui/src/components/SearchPackages/SearchPackages.svelte +++ b/packages/gui/src/components/SearchPackages/SearchPackages.svelte @@ -5,7 +5,7 @@ import type { Package } from '@tea/ui/types'; import PackageCard from '@tea/ui/PackageCard/PackageCard.svelte'; - + import SearchInput from '@tea/ui/SearchInput/SearchInput.svelte'; import { onMount } from 'svelte'; let packages: Package[] = []; @@ -23,11 +23,15 @@
    -
    -

    Filter Packages

    - +
    +
    + +
    +
    +
    +
    -
      +
        {#each packages as pkg} {/each} diff --git a/packages/ui/src/PackageCard/PackageCard.svelte b/packages/ui/src/PackageCard/PackageCard.svelte index f8ab145..8b0cde6 100644 --- a/packages/ui/src/PackageCard/PackageCard.svelte +++ b/packages/ui/src/PackageCard/PackageCard.svelte @@ -23,7 +23,7 @@ {/if} -