アニメーション(#139) #252

マージ済み
みてるぞ が 16 個のコミットを feature/139 から main へマージ 2026-02-05 23:25:28 +09:00
2個のファイルの変更23行の追加23行の削除
コミット 9004ffb330 の変更だけを表示してゐます - すべてのコミットを表示
+4 -9
ファイルの表示
@@ -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"/>
+10 -5
ファイルの表示
@@ -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,9 +43,13 @@ 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
{
@@ -55,7 +61,6 @@ export default () => {
;
}
}) ()
}
}, [location.search])
return (
@@ -100,4 +105,4 @@ export default () => {
</TabGroup>
</MainArea>
</div>)
}
}) satisfies FC