Breadcrumbs (#343)

* #335 breadcrumbs

---------

Co-authored-by: neil molina <neil@neils-MacBook-Pro.local>
This commit is contained in:
Neil 2023-03-28 08:36:19 +08:00 committed by GitHub
parent c6d062bd40
commit c48d0435d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 23 additions and 5 deletions

View file

@ -8,7 +8,7 @@
import { getPackage } from '@native';
import { notificationStore } from '$libs/stores';
export let tab = "all";
export let pkg: GUIPackage;
export let onClick: () => void;
@ -46,7 +46,7 @@
<PackageCard
{pkg}
link={`/packages/${pkg.slug}`}
link={`/packages/${pkg.slug}?tab=${tab}`}
ctaLabel={getCTALabel(pkg.state)}
progessLoading={+fakeLoadingProgress.toFixed(2)}
ctaType="plain"

View file

@ -59,6 +59,7 @@
{#if index < limit}
<div class={pkg.state === PackageStates.INSTALLING ? 'animate-pulse' : ''}>
<Package
tab={packageFilter}
{pkg}
onClick={() => packagesStore.installPkg(pkg)}
/>

View file

@ -1,5 +1,7 @@
<script lang="ts">
import '$appcss';
import { page } from '$app/stores';
import { t } from '$libs/translations';
import { navStore, packagesStore } from '$libs/stores';
import Packages from '$components/packages/packages.svelte';
@ -10,12 +12,15 @@
import WelcomeModal from '$components/welcome-modal/welcome-modal.svelte';
import Button from "@tea/ui/button/button.svelte";
const log = window.require("electron-log");
const { sideNavOpen } = navStore; // right side not left
const { packages } = packagesStore;
let sideMenuOption = SideMenuOptions.all;
const url = $page.url;
let sideMenuOption = url.searchParams.get("tab") as SideMenuOptions || SideMenuOptions.all;
let sortBy: "popularity" | "most recent" = "popularity";
let sortDirection: "asc" | "desc" = "desc";

View file

@ -1,5 +1,7 @@
<script lang="ts">
import '$appcss';
import { page } from '$app/stores';
// import PageHeader from '$components/page-header/page-header.svelte';
import PackageBanner from '$components/package-banner/package-banner.svelte';
import type { Bottle } from '@tea/ui/types';
@ -14,7 +16,7 @@
import Preloader from '@tea/ui/Preloader/Preloader.svelte';
/** @type {import('./$types').PageData} */
export let data;
export let data: { slug:string, content:string, title:string };
import { packagesStore } from '$libs/stores';
@ -58,9 +60,19 @@
];
}
});
const url = $page.url;
const tab = url.searchParams.get("tab");
</script>
<header class="mx-16 pb-5 mb-10 text-gray border border-x-0 border-t-0">
<a class="hover:text-white hover:opacity-80 cursor-default" href="/">home</a>
>
{#if tab !== "all"}
<a class="hover:text-white hover:opacity-80 cursor-default" href={`/?tab=${tab || "all"}`}>{tab || "all"}</a>
>
{/if}
<span class="text-white">{pkg.full_name}</span>
</header>
{#if pkg}
<div class="bg-black px-16">
<section>