Render Panel's built-in templates when embedding an app in Flask?

Hi,

I’m trying to embed my app within Flask while keeping the Vanilla template I use.

Suppose I have the following app:

import panel as pn

sidebar = [pn.widgets.Button(name='Button')]
main = [pn.pane.Markdown('Content')]
content = pn.template.VanillaTemplate(title='My app', main=main, sidebar=sidebar)

pn.serve({'myapp': content}, port=8888, websocket_origin='localhost:5000', show=False)

Then in a separate file:

from bokeh.embed import server_document
from flask import Flask, render_template

app = Flask(__name__)

@app.route("/")
def index():
    return f"""
<!DOCTYPE html>
<html>
<body>
    {server_document(f"http://localhost:8888")}
</body>
</html>
"""

app.run(port=5000)

When running both scripts, I can access the app at http://localhost:5000 but the template is not applied.

Flask has a render_template function which takes an html as input. I copied the content of the vanilla directory in “panel/template” in a local “templates” directory and tried the following but I get an jinja2 error (‘base’ is not defined):

@app.route("/")
def index():
    return render_template("vanilla.html", script=server_document("http://localhost:8888/myapp"))

Looking at the vanilla.html file, it looks like it needs to be built dynamically (I see for instance the related base.py file).

Is it possible to use the template in embed mode like this? Any help or insight would be appreciated!