Can't find relative component template

[khasbilegt]

Hello,

I was setting up django-components in my own project and I came across an exception TemplateDoesNotExist in one of my components with relative path. Initially, I thought I was missing some configs but the same thing happened when I ran the sample project by cloning the repo. I modified the calendarapp/templates/calendarapp/calendar.html file so it loads the component registered under the name "calendar_relative". Am I missing something or is there an issue?

[khasbilegt]

But if I add the component path in my STATICFILES_DIRS, the template is found without any problems.

[EmilStenstrom]

@JuroOravec Mind having a look?

[JuroOravec]

Hey both, I'm having a look now.

[JuroOravec]

Also, don't know if it will be related or not, but in our project we have a weird problem with the relative imports - things work locally, and in prod. BUT, there is a single JS file that does not get recognized by the django-component's path resolution logic.
The component defines HTML and JS, and the HTML is resolved ok, but JS file is not. It's really strange.

[JuroOravec]

Oki, so yesterday's fix also fixed this strange issue 🙌

[JuroOravec]

Ok, so I've copied the repo and run the project (see the commands below). After I've changed the calendar component to calendar_relative, I got the same error as @khasbilegt.

gh repo clone EmilStenstrom/django-components
cd django-components/sampleproject

mkdir .venv
pipenv install

python manage.py migrate && python manage.py runserver 0.0.0.0:8000

curl localhost:8000
curl localhost:8000/greeting/
curl localhost:8000/calendar/

What I noticed is that using the __module__ itself to derive the path of the file where the component was defined is not that reliable. For the todo and calendar components, the __module__ attribute prints values "todo" and "calendar" respectively. However, the code actually expects that in these cases, __module__ should've printed "components.todo" and "components.calendar", so including also the top-level module.

I got a suggestion from ChatGPT to use following method to derive the component's file path from component class:

import sys
module_name = attrs["__module__"]
module_obj = sys.modules[module_name]
file_path = module_obj.__file__
print("FILE_PATH: ", file_path)
# FILE_PATH: /Users/presenter/repos/django-components2/django-components/sampleproject/components/calendar/calendar.py

I'll poke a bit more around and see if using this approach would solve the bugs we're seeing.

[JuroOravec]

Update: Seems like using the sys.modules fixed the issue that @khasbilegt had with calendar_relative. I'll clean up the code and get the fix ready to go out next

[EmilStenstrom]

Thanks for troubleshoting! Awesome as always :)

[JuroOravec]

Oh, you make me blush! 😄

Anyway, this is the MR for the fix :) #432

[JuroOravec]

@khasbilegt We've released v0.65 that should fix this issue for you. For now I'll mark this as answered, but do give it a test yourself and let us know :)