Mininal exampe of how to Twitter embeds with Santiy.io

BlockContent.js

// Example of how to output this in a React frontend
import React from 'react'
import BlockContent from '@sanity/block-content-to-react'
import { TwitterTweetEmbed } from 'react-twitter-embed'

const Tweet = ({url}) =>  {
  const exp = /\/status\/(\d+)($|[?/])/
  const [, id] = exp.exec(url) || []
  if (id) {
    return <TwitterTweetEmbed className="sliderBoxes" tweetId={id} options={{conversation: 'none', 'hide-thread': true}} />
  }
}
const serializers = {
  types: {
    tweet: ({node}) => <Tweet url={node.url} />
   }
}

const BlockContent = ({blocks}) => <BlockContent blocks={blocks} serializers={serializers} />
  
export default BlockContent

richText.js

// Minimal rich text field with a custom tweet embed block
export default {
  name: 'richText',
  type: 'array',
  title: 'Rich text',
  of: [
    {
      type: 'block'
    },
    {
      type: 'tweet'
    }
  ]
}

twitter.js

// Make a object type for the twitter data that holds the URL (and can be repurposed for any presentation)
import React from 'react'
import { TwitterTweetEmbed } from 'react-twitter-embed'

const Tweet = ({ value: {url} }) =>  {
  const exp = /\/status\/(\d+)($|[?/])/
  const [, id] = exp.exec(url) || []
  if (id) {
    return <TwitterTweetEmbed className="sliderBoxes" tweetId={id} options={{conversation: 'none', 'hide-thread': true}} />
  }
}

export default {
  name: 'tweet',
  type: 'object',
  title: 'Twitter embed',
  fields: [
    {
      name: 'url',
      type: 'string',
      title: 'Tweet URL'
    }
  ],
  preview: {
    select: { 'url': url },
    component: Tweet
  }
}