fix(chat/post): PostCard-Bilder-Ecken, Chat-Spinner-Hänger, Bild-Cache
- PostCard: Bilder mit borderRadius 10 + overflow:hidden — Ecken wieder rund - dm.tsx: myUserId synchron aus useAuthStore statt async getSession — behebt den hängenden Lade-Spinner beim Zurück aus einer Conversation (async getSession-Fenster auf jedem Mount → enabled-Flackern der Query) - ChatBubble: expo-image memory-disk-Cache + 200ms-Transition für smootheres Bild-Laden Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
704958320b
commit
834e6efffc
@ -16,13 +16,13 @@ import { Ionicons } from '@expo/vector-icons';
|
|||||||
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
import { useQuery, useQueryClient } from '@tanstack/react-query';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import { apiFetch } from '../lib/api';
|
import { apiFetch } from '../lib/api';
|
||||||
import { supabase } from '../lib/supabase';
|
|
||||||
import { ChatBubble, type ChatMsg } from '../components/chat/ChatBubble';
|
import { ChatBubble, type ChatMsg } from '../components/chat/ChatBubble';
|
||||||
import { ChatInput, type SendPayload } from '../components/chat/ChatInput';
|
import { ChatInput, type SendPayload } from '../components/chat/ChatInput';
|
||||||
import { DmChatBackground } from '../components/chat/DmChatBackground';
|
import { DmChatBackground } from '../components/chat/DmChatBackground';
|
||||||
import { useDmRealtime } from '../hooks/useChatRealtime';
|
import { useDmRealtime } from '../hooks/useChatRealtime';
|
||||||
import { useColors } from '../lib/theme';
|
import { useColors } from '../lib/theme';
|
||||||
import { useThemeStore } from '../stores/theme';
|
import { useThemeStore } from '../stores/theme';
|
||||||
|
import { useAuthStore } from '../stores/auth';
|
||||||
import { UserAvatar } from '../components/UserAvatar';
|
import { UserAvatar } from '../components/UserAvatar';
|
||||||
import { ChatHeaderStatus } from '../components/chat/ChatHeaderStatus';
|
import { ChatHeaderStatus } from '../components/chat/ChatHeaderStatus';
|
||||||
|
|
||||||
@ -60,7 +60,7 @@ export default function DmScreen() {
|
|||||||
const styles = makeStyles(colors);
|
const styles = makeStyles(colors);
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
const flatRef = useRef<FlatList>(null);
|
const flatRef = useRef<FlatList>(null);
|
||||||
const [myUserId, setMyUserId] = useState<string | undefined>(undefined);
|
const myUserId = useAuthStore((s) => s.user?.id);
|
||||||
|
|
||||||
const colorScheme = useThemeStore((s) => s.colorScheme);
|
const colorScheme = useThemeStore((s) => s.colorScheme);
|
||||||
const chatBg = colorScheme === 'dark' ? '#1a1f1e' : '#EDE8E1';
|
const chatBg = colorScheme === 'dark' ? '#1a1f1e' : '#EDE8E1';
|
||||||
@ -95,13 +95,6 @@ export default function DmScreen() {
|
|||||||
setReplyTo(null);
|
setReplyTo(null);
|
||||||
}, [userId]);
|
}, [userId]);
|
||||||
|
|
||||||
// Lade meine User-ID
|
|
||||||
useEffect(() => {
|
|
||||||
supabase.auth.getSession().then(({ data }) => {
|
|
||||||
setMyUserId(data.session?.user.id);
|
|
||||||
});
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
// Lade DM-History — staleTime:0 erzwingt immer frischen Fetch (kein Cache-Hit-Bug)
|
// Lade DM-History — staleTime:0 erzwingt immer frischen Fetch (kein Cache-Hit-Bug)
|
||||||
const { isLoading, isFetching } = useQuery({
|
const { isLoading, isFetching } = useQuery({
|
||||||
queryKey: ['dm-history', userId],
|
queryKey: ['dm-history', userId],
|
||||||
|
|||||||
@ -315,8 +315,8 @@ function PostCardImpl({ post, onCommentPress }: Props) {
|
|||||||
setImageAspectRatio(Math.max(0.6, Math.min(1.78, ratio)));
|
setImageAspectRatio(Math.max(0.6, Math.min(1.78, ratio)));
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
className="w-full rounded-xl mt-3"
|
className="w-full mt-3"
|
||||||
style={{ aspectRatio: imageAspectRatio ?? 1.78 }}
|
style={{ aspectRatio: imageAspectRatio ?? 1.78, borderRadius: 10, overflow: 'hidden' }}
|
||||||
contentFit="cover"
|
contentFit="cover"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -199,6 +199,8 @@ export function ChatBubble({
|
|||||||
source={{ uri: msg.attachmentUrl }}
|
source={{ uri: msg.attachmentUrl }}
|
||||||
style={styles.image}
|
style={styles.image}
|
||||||
contentFit="cover"
|
contentFit="cover"
|
||||||
|
cachePolicy="memory-disk"
|
||||||
|
transition={200}
|
||||||
/>
|
/>
|
||||||
{isImageOnly && (
|
{isImageOnly && (
|
||||||
<View style={styles.imageTimeOverlay}>
|
<View style={styles.imageTimeOverlay}>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user