feat(post): add floating preview of media from link in post content

This commit is contained in:
Tom (plebeius.eth)
2024-06-08 16:41:05 +02:00
parent ddd063fdef
commit 39a48c9515
40 changed files with 192 additions and 74 deletions
+3 -4
View File
@@ -1,4 +1,5 @@
import { useEffect, useRef } from 'react';
import { useEffect, useRef, useState } from 'react';
import { createPortal } from 'react-dom';
import { useTranslation } from 'react-i18next';
import { Link, useLocation } from 'react-router-dom';
import { Comment, useComment } from '@plebbit/plebbit-react-hooks';
@@ -13,9 +14,6 @@ import PostMenuDesktop from '../post/post-desktop/post-menu-desktop/';
import styles from './catalog-row.module.css';
import _ from 'lodash';
import React, { useState } from 'react';
import { createPortal } from 'react-dom';
interface CatalogPostMediaProps {
commentMediaInfo: any;
isOutOfFeed?: boolean;
@@ -109,6 +107,7 @@ const CatalogPost = ({ post }: { post: Comment }) => {
const timeoutRef = useRef<NodeJS.Timeout | null>(null);
const { refs, floatingStyles, update } = useFloating({
open: showPortal,
placement: placementRef.current,
middleware: [
shift({ padding: 10 }),