<commit_before>import { useEffect, useState } from 'react';
import cachedFetch from './cached-fetch';

const TIKTOK_VIDEO_RE = /^https?:\/\/(?:www\.)?tiktok\.com\/@.+?\/video\/(\d+)/i;
const TIKTOK_SHORT_VIDEO_RE = /^https?:\/\/vm\.tiktok\.com\/(\w+)/i;

export function canShowURL(url) {
  return TIKTOK_VIDEO_RE.test(url) || TIKTOK_SHORT_VIDEO_RE.test(url);
}

export default function TikTokVideoPreview({ url }) {
  const [id, setId] = useState(() => TIKTOK_VIDEO_RE.exec(url)?.[1]);
  const [isError, setIsError] = useState(false);
  const [byline, setByline] = useState(null);

  useEffect(() => {
    cachedFetch(`https://www.tiktok.com/oembed?url=${encodeURIComponent(url)}`).then((data) => {
      if (data.title) {
        setByline(`${data.title} by ${data.author_name}`);
        setId(/data-video-id="(\d+)"/.exec(data.html)?.[1]);
      } else {
        setIsError(true);
      }
    });
  }, [url]);

  if (isError) {
    return (
      <div className="link-preview-content">Cannot load TikTok data, probably link is broken.</div>
    );
  }

  if (!id) {
    return (
      <div className="link-preview-content">
        <div className="tiktok-video-preview">Loading preview data…</div>
      </div><commit_msg>Fix Tiktok preview with empty title<commit_after>import { useEffect, useState } from 'react';
import cachedFetch from './cached-fetch';

const TIKTOK_VIDEO_RE = /^https?:\/\/(?:www\.)?tiktok\.com\/@.+?\/video\/(\d+)/i;
const TIKTOK_SHORT_VIDEO_RE = /^https?:\/\/vm\.tiktok\.com\/(\w+)/i;

export function canShowURL(url) {
  return TIKTOK_VIDEO_RE.test(url) || TIKTOK_SHORT_VIDEO_RE.test(url);
}

export default function TikTokVideoPreview({ url }) {
  const [id, setId] = useState(() => TIKTOK_VIDEO_RE.exec(url)?.[1]);
  const [isError, setIsError] = useState(false);
  const [byline, setByline] = useState(null);

  useEffect(() => {
    cachedFetch(`https://www.tiktok.com/oembed?url=${encodeURIComponent(url)}`).then((data) => {
      if ('title' in data) {
        setByline(`${data.title || 'Untitled'} by ${data.author_name}`);
        setId(/data-video-id="(\d+)"/.exec(data.html)?.[1]);
      } else {
        setIsError(true);
      }
    });
  }, [url]);

  if (isError) {
    return (
      <div className="link-preview-content">Cannot load TikTok data, probably link is broken.</div>
    );
  }

  if (!id) {
    return (
      <div className="link-preview-content">
        <div className="tiktok-video-preview">Loading preview data…</div>
      </div>
{'fraction_non_alphanumeric': 0.201764941837144, 'fraction_numerical': 0.001604492579221821, 'mean_word_length': 3.4298401420959146, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 21, 'https://': 2, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2478007', 'n_tokens_mistral': 913, 'n_tokens_neox': 904, 'n_words': 151}