Browse Source

#139

pull/252/head
みてるぞ 1 week ago
parent
commit
9004ffb330
2 changed files with 23 additions and 23 deletions
  1. +4
    -9
      frontend/src/pages/posts/PostDetailPage.tsx
  2. +19
    -14
      frontend/src/pages/posts/PostListPage.tsx

+ 4
- 9
frontend/src/pages/posts/PostDetailPage.tsx View File

@@ -2,7 +2,7 @@ import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
import { motion } from 'framer-motion'
import { useEffect, useState } from 'react'
import { Helmet } from 'react-helmet-async'
import { useLocation, useParams } from 'react-router-dom'
import { useParams } from 'react-router-dom'

import PostEditForm from '@/components/PostEditForm'
import PostEmbed from '@/components/PostEmbed'
@@ -31,11 +31,6 @@ export default (({ user }: Props) => {
const postId = String (id ?? '')
const postKey = postsKeys.show (postId)

const location = useLocation ()
const navState = (location.state ?? { }) as { sharedId?: string }

const inboundSharedId = navState.sharedId

const { data: post, isError: errorFlg, error } = useQuery ({
enabled: Boolean (id),
queryKey: postKey,
@@ -112,15 +107,15 @@ export default (({ user }: Props) => {
{post
? (
<>
{inboundSharedId === `page-${ id }` && (
{(post.thumbnail || post.thumbnailBase) && (
<motion.div
layoutId={inboundSharedId}
layoutId={`page-${ id }`}
className="absolute top-4 left-4 w-[min(640px,calc(100vw-2rem))] h-[360px]
overflow-hidden rounded-xl pointer-events-none z-50"
initial={{ opacity: 1 }}
animate={{ opacity: 0 }}
transition={{ duration: .2, ease: 'easeOut' }}>
<img src={post.thumbnail || post.thumbnailBase || undefined}
<img src={post.thumbnail || post.thumbnailBase}
alt={post.title || post.url}
title={post.title || post.url || undefined}
className="object-cover w-full h-full"/>


+ 19
- 14
frontend/src/pages/posts/PostListPage.tsx View File

@@ -15,10 +15,12 @@ import { fetchPosts } from '@/lib/posts'
import { postsKeys } from '@/lib/queryKeys'
import { fetchWikiPageByTitle } from '@/lib/wiki'

import type { FC } from 'react'

import type { WikiPage } from '@/types'


export default () => {
export default (() => {
const containerRef = useRef<HTMLDivElement | null> (null)

const [wikiPage, setWikiPage] = useState<WikiPage | null> (null)
@@ -41,21 +43,24 @@ export default () => {
const totalPages = data ? Math.ceil (data.count / limit) : 0

useLayoutEffect (() => {
scroll (0, 0)

setWikiPage (null)
if (tags.length === 1)

if (tags.length !== 1)
return

void (async () => {
try
{
const tagName = tags[0]
setWikiPage (await fetchWikiPageByTitle (tagName, { }))
}
catch
{
void (async () => {
try
{
const tagName = tags[0]
setWikiPage (await fetchWikiPageByTitle (tagName, { }))
}
catch
{
;
}
}) ()
;
}
}) ()
}, [location.search])

return (
@@ -100,4 +105,4 @@ export default () => {
</TabGroup>
</MainArea>
</div>)
}
}) satisfies FC

Loading…
Cancel
Save