diff --git a/web/components/editor.tsx b/web/components/editor.tsx index 8f49c498..018d94a6 100644 --- a/web/components/editor.tsx +++ b/web/components/editor.tsx @@ -21,8 +21,6 @@ import { useMutation } from 'react-query' import { linkClass } from './site-link' import { DisplayMention } from './editor/mention' import { DisplayContractMention } from './editor/contract-mention' -import GridComponent from './editor/tiptap-grid-cards' - import Iframe from 'common/util/tiptap-iframe' import TiptapTweet from './editor/tiptap-tweet' import { EmbedModal } from './editor/embed-modal' @@ -80,7 +78,6 @@ export const editorExtensions = (simple = false): Extensions => [ DisplayLink, DisplayMention, DisplayContractMention, - GridComponent, Iframe, TiptapTweet, TiptapSpoiler.configure({ @@ -361,7 +358,6 @@ export function RichContent(props: { DisplayLink.configure({ openOnClick: false }), // stop link opening twice (browser still opens) DisplayMention, DisplayContractMention, - GridComponent, Iframe, TiptapTweet, TiptapSpoiler.configure({ diff --git a/web/components/editor/market-modal.tsx b/web/components/editor/market-modal.tsx index ae0f50e1..1e2c1482 100644 --- a/web/components/editor/market-modal.tsx +++ b/web/components/editor/market-modal.tsx @@ -1,7 +1,7 @@ import { Editor } from '@tiptap/react' import { Contract } from 'common/contract' import { SelectMarketsModal } from '../contract-select-modal' -import { embedContractCode } from '../share-embed-button' +import { embedContractCode, embedContractGridCode } from '../share-embed-button' import { insertContent } from './utils' export function MarketModal(props: { @@ -15,10 +15,7 @@ export function MarketModal(props: { if (contracts.length == 1) { insertContent(editor, embedContractCode(contracts[0])) } else if (contracts.length > 1) { - insertContent( - editor, - `` - ) + insertContent(editor, embedContractGridCode(contracts)) } } diff --git a/web/components/editor/tiptap-grid-cards.tsx b/web/components/editor/tiptap-grid-cards.tsx deleted file mode 100644 index 48242ea2..00000000 --- a/web/components/editor/tiptap-grid-cards.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { mergeAttributes, Node } from '@tiptap/core' -import React from 'react' -import { NodeViewWrapper, ReactNodeViewRenderer } from '@tiptap/react' -import { ContractsGrid } from '../contract/contracts-grid' - -import { useContractsFromIds } from 'web/hooks/use-contract' -import { LoadingIndicator } from '../loading-indicator' - -export default Node.create({ - name: 'gridCardsComponent', - - group: 'block', - - atom: true, - - addAttributes() { - return { - contractIds: [], - } - }, - - parseHTML() { - return [ - { - tag: 'grid-cards-component', - }, - ] - }, - - renderHTML({ HTMLAttributes }) { - return ['grid-cards-component', mergeAttributes(HTMLAttributes)] - }, - - addNodeView() { - return ReactNodeViewRenderer(GridComponent) - }, -}) - -export function GridComponent(props: any) { - const contractIds = props.node.attrs.contractIds - const contracts = useContractsFromIds(contractIds.split(',')) - - return ( - - {contracts ? ( - - ) : ( - - )} - - ) -} diff --git a/web/hooks/use-contract.ts b/web/hooks/use-contract.ts index 2e7c4f84..acaf7730 100644 --- a/web/hooks/use-contract.ts +++ b/web/hooks/use-contract.ts @@ -3,12 +3,10 @@ import { useFirestoreDocumentData } from '@react-query-firebase/firestore' import { Contract, contracts, - getContractFromId, listenForContract, } from 'web/lib/firebase/contracts' import { useStateCheckEquality } from './use-state-check-equality' import { doc, DocumentData } from 'firebase/firestore' -import { useQuery } from 'react-query' export const useContract = (contractId: string) => { const result = useFirestoreDocumentData( @@ -20,17 +18,6 @@ export const useContract = (contractId: string) => { return result.isLoading ? undefined : result.data } -export const useContractsFromIds = (contractIds: string[]) => { - const contractResult = useQuery(['contracts', contractIds], () => - Promise.all(contractIds.map(getContractFromId)) - ) - const contracts = contractResult.data?.filter( - (contract): contract is Contract => !!contract - ) - - return contractResult.isLoading ? undefined : contracts -} - export const useContractWithPreload = ( initial: Contract | null | undefined ) => {