How do I use Jinja2's {% include %}?

Describe the problem I'm trying to use the {% include %} syntax, but I'm getting TemplateNotFound error.

I took out my layouts from my eleventy project but since eel is not a static site generator and doesn't supply any prefix path like in Eleventy, Jekyll or any other SSGs for the includes and layouts, I pointed out my include like this {% include "../includes/appbar/base.html" %}

here's my folder structure

and below is the traceback when I tried to use {% include %}

Traceback (most recent call last):
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 876, in _handle
    return route.call(**args)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 1756, in wrapper
    rv = callback(*a, **ka)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\eel\__init__.py", line 221, in _static      
    response = btl.HTTPResponse(template.render())
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 1301, in render
    self.environment.handle_exception()
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 936, in handle_exception
    raise rewrite_traceback_stack(source=source)
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\index.html", line 1, in top-level template code
    {% extends "base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\base.html", line 15, in top-level template code
    {% include "../includes/appbar/base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\loaders.py", line 195, in get_source
    pieces = split_template_path(template)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\loaders.py", line 36, in split_template_path
    raise TemplateNotFound(template)
Traceback (most recent call last):
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 876, in _handle
    return route.call(**args)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 1756, in wrapper
    rv = callback(*a, **ka)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\eel\__init__.py", line 221, in _static      
    response = btl.HTTPResponse(template.render())
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 1301, in render
    self.environment.handle_exception()
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 936, in handle_exception
    raise rewrite_traceback_stack(source=source)
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\index.html", line 1, in top-level template code
    {% extends "base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\base.html", line 15, in top-level template code
    {% include "includes/appbar/base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\loaders.py", line 218, in get_source
    raise TemplateNotFound(template)
Traceback (most recent call last):
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 876, in _handle
    return route.call(**args)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\bottle.py", line 1756, in wrapper
    rv = callback(*a, **ka)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\eel\__init__.py", line 221, in _static      
    response = btl.HTTPResponse(template.render())
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 1301, in render
    self.environment.handle_exception()
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\environment.py", line 936, in handle_exception
    raise rewrite_traceback_stack(source=source)
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\index.html", line 1, in top-level template code
    {% extends "base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\source\layouts\base.html", line 15, in top-level template code
    {% include "../includes/appbar/base.html" %}
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\loaders.py", line 195, in get_source
    pieces = split_template_path(template)
  File "D:\Projects\Python\Playground\eel\test-project-1\venv\lib\site-packages\jinja2\loaders.py", line 36, in split_template_path
    raise TemplateNotFound(template)
jinja2.exceptions.TemplateNotFound: ../includes/appbar/base.html

Code snippet(s) Here is some code that can be easily used to reproduce the problem or understand what I need help with.

[x] I know that if I don't provide sample code that allows someone to quickly step into my shoes, I may not get the help I want or my issue may be closed.

# File: "./main.py"

import eel
import platform
import sys

def main():
    source_path = 'source'
    main_page = 'layouts/index.html'
    eel_kwargs = dict(
        mode = 'chrome',
        host = 'localhost',
        port = 8080,
        size = (850, 480)
    )

    try:
        eel.init(source_path)
        eel.start(main_page, jinja_templates='layouts', **eel_kwargs)
    except EnvironmentError:
        if sys.platform in ['win32', 'win64'] and int(platform.release()) >= 10:
            eel.start(main_page, jinja_templates='layouts', **eel_kwargs)
        else:
            raise

if __name__ == '__main__':
    main()

<!-- File: "./source/layouts/base.html" -->

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Test App</title>
        <link rel="stylesheet" href="https://unpkg.com/mdui@1.0.2/dist/css/mdui.min.css"/>
    </head>
    <body class="mdui-theme-primary-indigo mdui-theme-accent-pink mdui-theme-layout-dark">
        <script type="text/javascript" src="/eel.js"></script>

        <header>
            {% include "../includes/appbar/base.html" %}
        </header>
        <main>
            {% block content %}
            {% endblock %}
        </main>

        <script src="https://unpkg.com/mdui@1.0.2/dist/js/mdui.min.js"></script>
    </body>
</html>

<!-- File: ./source/includes/appbar/base.html

<div class="mdui-appbar">
    <div class="mdui-toolbar mdui-color-theme">
        <button class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white">
            <i class="mdui-icon material-icons">menu</i>
        </button>
        <div class="mdui-typo-headline">Title</div>
        <div class="mdui-toolbar-spacer"></div>
        <button class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white">
            <i class="mdui-icon material-icons">search</i>
        </button>
        <button class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white">
            <i class="mdui-icon material-icons">refresh</i>
        </button>
        <button class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white">
            <i class="mdui-icon material-icons">more_vert</i>
        </button>
    </div>
</div>

Desktop (please complete the following information):

OS: [Windows 10 Pro 21H2 x64 Build 19044.1865]
Browser [Installed: Firefox, Chrome, Edge] [For use in eel: Chrome]
Version [version of what?? my Python??? eel??? or my Windows???]

Smartphone (please complete the following information):

I'm not accessing my app from a smartphone... yet, for now...

python-eel / Eel

How do I use Jinja2's {% include %}? #609