08Youtube URL Parsing

Youtube URL Parsing

Now that we have image parsing available on our second brain. Next step is to check if there is any youtube video url present. If yes, parse and display it on the frontend.

Parse the iframe from response in Frontend.

Add the following line under markdown component.

app/chat/[id]/page.tsx


iframe({ src }) {
    if (!src) return null;

    return (
        <div className="my-4 w-full overflow-hidden rounded-xl border border-white/10 bg-black">
            <div className="relative w-full" style={{ paddingTop: "56.25%" }}>
                <iframe
                    src={src}
                    title="Embedded video"
                    className="absolute top-0 left-0 w-full h-full"
                    allowFullScreen
                    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                    referrerPolicy="strict-origin-when-cross-origin"
                />
            </div>
        </div>
    );
}

Next Steps

In the next section, we’ll:

Hybrid Search and Reranking

Improve the LLM response using Hybrid Search (Semantic + Lexical Search)

If you want to know more about this, do checkout our video guide:

Image Parsing

Hybrid Search And Reranking