kopia lustrzana https://github.com/cloudflare/wildebeest
rodzic
f0c6126938
commit
66b4319bb3
|
@ -1,9 +1,30 @@
|
|||
import { component$, Slot } from '@builder.io/qwik'
|
||||
import { $, component$, Slot } from '@builder.io/qwik'
|
||||
import { useNavigate } from '@builder.io/qwik-city'
|
||||
|
||||
export default component$<{ withBackButton?: boolean }>(({ withBackButton }) => {
|
||||
const nav = useNavigate()
|
||||
|
||||
const goBack = $(() => {
|
||||
if (window.history.length > 1) {
|
||||
window.history.back()
|
||||
} else {
|
||||
nav('/explore')
|
||||
}
|
||||
})
|
||||
|
||||
export default component$(() => {
|
||||
return (
|
||||
<header class="bg-wildebeest-900 sticky top-[3.9rem] xl:top-0 xl:pt-2.5 z-10">
|
||||
<Slot />
|
||||
<div class="flex bg-wildebeest-700 xl:rounded-t overflow-hidden">
|
||||
{!!withBackButton && (
|
||||
<div class="flex justify-between items-center bg-wildebeest-700">
|
||||
<button class="text-semi no-underline text-wildebeest-vibrant-400 bg-transparent p-4" onClick$={goBack}>
|
||||
<i class="fa fa-chevron-left mr-2 w-3 inline-block" />
|
||||
<span class="hover:underline">Back</span>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<Slot />
|
||||
</div>
|
||||
</header>
|
||||
)
|
||||
})
|
||||
|
|
|
@ -48,14 +48,7 @@ export default component$(() => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<StickyHeader>
|
||||
<div class="flex justify-between items-center xl:rounded-t header bg-wildebeest-700">
|
||||
<Link class="text-semi no-underline text-wildebeest-vibrant-400 bg-transparent p-4" href="/explore">
|
||||
<i class="fa fa-chevron-left mr-2 w-3 inline-block" />
|
||||
<span class="hover:underline">Back</span>
|
||||
</Link>
|
||||
</div>
|
||||
</StickyHeader>
|
||||
<StickyHeader withBackButton />
|
||||
<div class="bg-wildebeest-700 p-4">
|
||||
<AccountCard status={loaderData.status} />
|
||||
<div class="leading-normal inner-html-content text-lg" dangerouslySetInnerHTML={loaderData.status.content} />
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { $, component$, useStyles$ } from '@builder.io/qwik'
|
||||
import { loader$, useNavigate } from '@builder.io/qwik-city'
|
||||
import { component$, useStyles$ } from '@builder.io/qwik'
|
||||
import { loader$ } from '@builder.io/qwik-city'
|
||||
import { MastodonAccount } from 'wildebeest/backend/src/types'
|
||||
import StickyHeader from '~/components/StickyHeader/StickyHeader'
|
||||
import { formatDateTime } from '~/utils/dateTime'
|
||||
|
@ -34,18 +34,9 @@ export const accountLoader = loader$<{ DATABASE: D1Database }, Promise<MastodonA
|
|||
|
||||
export default component$(() => {
|
||||
useStyles$(styles)
|
||||
const nav = useNavigate()
|
||||
|
||||
const accountDetails = accountLoader.use().value
|
||||
|
||||
const goBack = $(() => {
|
||||
if (window.history.length > 1) {
|
||||
window.history.back()
|
||||
} else {
|
||||
nav('/explore')
|
||||
}
|
||||
})
|
||||
|
||||
const fields = [
|
||||
{
|
||||
name: 'Joined',
|
||||
|
@ -73,14 +64,7 @@ export default component$(() => {
|
|||
|
||||
return (
|
||||
<div>
|
||||
<StickyHeader>
|
||||
<div class="flex justify-between items-center xl:rounded-t header bg-wildebeest-700">
|
||||
<button class="text-semi no-underline text-wildebeest-vibrant-400 bg-transparent p-4" onClick$={goBack}>
|
||||
<i class="fa fa-chevron-left mr-2 w-3 inline-block" />
|
||||
<span class="hover:underline">Back</span>
|
||||
</button>
|
||||
</div>
|
||||
</StickyHeader>
|
||||
<StickyHeader withBackButton />
|
||||
<div class="relative mb-16">
|
||||
<img
|
||||
src={accountDetails.header}
|
||||
|
|
|
@ -42,7 +42,7 @@ export default component$(() => {
|
|||
return (
|
||||
<div class="flex flex-col flex-1">
|
||||
<StickyHeader>
|
||||
<h2 class="text-reg text-md m-0 p-4 flex bg-wildebeest-700 xl:rounded-t">
|
||||
<h2 class="text-reg text-md m-0 p-4 flex bg-wildebeest-700">
|
||||
<i class="fa fa-hashtag fa-fw mr-3 w-5 leading-tight inline-block" />
|
||||
<span>Explore</span>
|
||||
</h2>
|
||||
|
|
|
@ -4,7 +4,7 @@ test('Navigation to and view of an individual toot', async ({ page }) => {
|
|||
await page.goto('http://127.0.0.1:8788/explore')
|
||||
await page.locator('article').filter({ hasText: 'Ken White' }).locator('i.fa-globe + span').click()
|
||||
|
||||
const backButtonLocator = page.locator('a', { hasText: 'Back' })
|
||||
const backButtonLocator = page.getByRole('button', { name: 'Back' })
|
||||
await expect(backButtonLocator).toBeVisible()
|
||||
|
||||
const avatarLocator = page.locator('img[alt="Avatar of Ken White"]')
|
||||
|
@ -19,7 +19,7 @@ test('Navigation to and view of an individual toot', async ({ page }) => {
|
|||
await expect(tootContentLocator).toBeVisible()
|
||||
})
|
||||
|
||||
test('Navigation to and view of a reply toot', async ({ page }) => {
|
||||
test("Navigation to and view of a toot's replies", async ({ page }) => {
|
||||
await page.goto('http://127.0.0.1:8788/explore')
|
||||
|
||||
await page
|
||||
|
@ -43,4 +43,19 @@ test('Navigation to and view of a reply toot', async ({ page }) => {
|
|||
await expect(page.getByRole('link', { name: 'Avatar of Zach Weinersmith' })).toBeVisible()
|
||||
await expect(page.getByRole('link', { name: 'Zach Weinersmith', exact: true })).toBeVisible()
|
||||
await expect(page.getByText('Yes we did!')).toBeVisible()
|
||||
|
||||
await page.getByRole('button', { name: 'Back' }).click()
|
||||
|
||||
await page
|
||||
.locator('article')
|
||||
.filter({ hasText: 'nixCraft' })
|
||||
.filter({
|
||||
hasText: 'Yes you guys did it!',
|
||||
})
|
||||
.locator('i.fa-globe + span')
|
||||
.click()
|
||||
|
||||
await expect(page.getByRole('link', { name: 'Avatar of nixCraft' })).toBeVisible()
|
||||
await expect(page.getByRole('link', { name: 'nixCraft 🐧', exact: true })).toBeVisible()
|
||||
await expect(page.getByText('Yes you guys did it!')).toBeVisible()
|
||||
})
|
||||
|
|
Ładowanie…
Reference in New Issue