load components using template names

rmorshea · rmorshea · commit af6601dd6f86 · 2021-08-11T18:25:37.000-07:00
diff --git a/README.md b/README.md
@@ -45,7 +45,6 @@ your_app/
 ├── urls.py
 └── sub_app/
     ├── __init__.py
-    ├── components.py
     ├── idom.py
     ├── templates/
     │   └── your-template.html
@@ -58,7 +57,7 @@ To start, we'll need to use [`channels`](https://channels.readthedocs.io/en/stab
 create a `ProtocolTypeRouter` that will become the top of our ASGI application stack.
 Under the `"websocket"` protocol, we'll then add a path for IDOM's websocket consumer
 using `idom_websocket_path`. If you wish to change the route where this
-websocket is served from see the available [settings](#settings.py).
+websocket is served from, see the available [settings](#settings.py).
 
 ```python
 
@@ -104,15 +103,13 @@ You may configure additional options as well:
 ```python
 # the base URL for all IDOM-releated resources
 IDOM_BASE_URL: str = "_idom/"
-
-# ignore these INSTALLED_APPS during component collection
-IDOM_IGNORE_INSTALLED_APPS: list[str] = ["some_app", "some_other_app"]
 ```
 
 ## `urls.py`
 
 You'll need to include IDOM's static web modules path using `idom_web_modules_path`.
-Similarly to the `idom_websocket_path()`, these resources will be used globally.
+Similarly to the `idom_websocket_path()`. If you wish to change the route where this
+websocket is served from, see the available [settings](#settings.py).
 
 ```python
 from django_idom import idom_web_modules_path
@@ -128,54 +125,26 @@ urlpatterns = [
 This is where, by a convention similar to that of
 [`views.py`](https://docs.djangoproject.com/en/3.2/topics/http/views/), you'll define
 your [IDOM](https://github.com/idom-team/idom) components. Ultimately though, you should
-feel free to organize your component modules you wish.
+feel free to organize your component modules you wish. The components created here will
+ultimately be referenced by name in `your-template.html`. `your-template.html`.
 
 ```python
 import idom
 
 @idom.component
 def Hello(name):  # component names are camelcase by convention
-    return idom.html.h1(f"Hello {name}!")
-```
-
-## `sub_app/idom.py`
-
-This file is automatically discovered by `django-idom` when scanning the list of
-[`INSTALLED_APPS`](https://docs.djangoproject.com/en/3.2/ref/settings/#std:setting-INSTALLED_APPS).
-All apps that export components will contain this module.
-
-Inside this module must be a `components` list that is imported from
-[`components.py`](#sub_appcomponents.py):
-
-```python
-from .components import Hello
-
-components = [
-    Hello,
-    ...
-]
-```
-
-You may alternately reference the components with strings for the purpose of renaming:
-
-```python
-from .components import Hello as SomeOtherName
-
-components = [
-    "SomeOtherName",
-    ...
-]
+    return Header(f"Hello {name}!")
 ```
 
 ## `sub_app/templates/your-template.html`
 
 In your templates, you may inject a view of an IDOM component into your templated HTML
 by using the `idom_view` template tag. This tag which requires the name of a component
-to render (of the form `app_name.ComponentName`) and keyword arguments you'd like to
+to render (of the form `module_name.ComponentName`) and keyword arguments you'd like to
 pass it from the template.
 
 ```python
-idom_view app_name.ComponentName param_1="something" param_2="something-else"
+idom_view module_name.ComponentName param_1="something" param_2="something-else"
 ```
 
 In context this will look a bit like the following...
@@ -189,7 +158,7 @@ In context this will look a bit like the following...
 <html>
   <body>
     ...
-    {% idom_view "your_app.sub_app.Hello" name="World" %}
+    {% idom_view "your_app.sub_app.components.Hello" name="World" %}
   </body>
 </html>
 ```
diff --git a/src/django_idom/__init__.py b/src/django_idom/__init__.py
@@ -1,6 +1,5 @@
-from .components import register_component
 from .paths import idom_web_modules_path, idom_websocket_path
 
 
 __version__ = "0.0.1"
-__all__ = ["idom_websocket_path", "idom_web_modules_path", "register_component"]
+__all__ = ["idom_websocket_path", "idom_web_modules_path"]
diff --git a/src/django_idom/components.py b/src/django_idom/components.py
diff --git a/src/django_idom/config.py b/src/django_idom/config.py
@@ -5,6 +5,7 @@
 
 
 IDOM_REGISTERED_COMPONENTS: Dict[str, ComponentConstructor] = {}
+IDOM_IGNORE_INSTALLED_APPS = set(getattr(settings, "IDOM_IGNORE_INSTALLED_APPS", []))
 
 IDOM_BASE_URL = getattr(settings, "IDOM_BASE_URL", "_idom/")
 IDOM_WEBSOCKET_URL = IDOM_BASE_URL + "websocket/"
diff --git a/src/django_idom/templatetags/idom.py b/src/django_idom/templatetags/idom.py
@@ -1,4 +1,6 @@
 import json
+import sys
+from importlib import import_module
 from urllib.parse import urlencode
 from uuid import uuid4
 
@@ -16,9 +18,7 @@
 
 @register.inclusion_tag("idom/view.html")
 def idom_view(_component_id_, **kwargs):
-    if _component_id_ not in IDOM_REGISTERED_COMPONENTS:
-        print(list(IDOM_REGISTERED_COMPONENTS))
-        raise ValueError(f"No component {_component_id_!r} exists")
+    _register_component(_component_id_)
 
     json_kwargs = json.dumps(kwargs, separators=(",", ":"))
 
@@ -29,3 +29,26 @@ def idom_view(_component_id_, **kwargs):
         "idom_view_id": _component_id_,
         "idom_view_params": urlencode({"kwargs": json_kwargs}),
     }
+
+
+def _register_component(full_component_name: str) -> None:
+    module_name, component_name = full_component_name.rsplit(".", 1)
+
+    if module_name in sys.modules:
+        module = sys.modules[module_name]
+    else:
+        try:
+            module = import_module(module_name)
+        except ImportError as error:
+            raise RuntimeError(
+                f"Failed to import {module_name!r} while loading {component_name!r}"
+            ) from error
+
+    try:
+        component = getattr(module, component_name)
+    except AttributeError as error:
+        raise RuntimeError(
+            f"Module {module_name!r} has no component named {component_name!r}"
+        ) from error
+
+    IDOM_REGISTERED_COMPONENTS[full_component_name] = component
diff --git a/tests/test_app/components.py b/tests/test_app/components.py
@@ -1,14 +1,12 @@
 import idom
 
-from django_idom import register_component
 
-
-@register_component
+@idom.component
 def HelloWorld():
     return idom.html.h1({"id": "hello-world"}, "Hello World!")
 
 
-@register_component
+@idom.component
 def Button():
     count, set_count = idom.hooks.use_state(0)
     return idom.html.div(
@@ -23,16 +21,16 @@ def Button():
     )
 
 
-@register_component
+@idom.component
 def ParametrizedComponent(x, y):
     total = x + y
     return idom.html.h1({"id": "parametrized-component", "data-value": total}, total)
 
 
-victory = idom.web.module_from_template("react", "victory-line", fallback="...")
+victory = idom.web.module_from_template("react", "victory-bar", fallback="...")
 VictoryBar = idom.web.export(victory, "VictoryBar")
 
 
-@register_component
+@idom.component
 def SimpleBarChart():
     return VictoryBar()
diff --git a/tests/test_app/templates/base.html b/tests/test_app/templates/base.html
@@ -15,11 +15,11 @@
 
   <body>
     <h1>IDOM Test Page</h1>
-    <div>{% idom_view "test_app.views.HelloWorld" %}</div>
-    <div>{% idom_view "test_app.views.Button" %}</div>
+    <div>{% idom_view "test_app.components.HelloWorld" %}</div>
+    <div>{% idom_view "test_app.components.Button" %}</div>
     <div>
-      {% idom_view "test_app.views.ParametrizedComponent" x=123 y=456 %}
+      {% idom_view "test_app.components.ParametrizedComponent" x=123 y=456 %}
     </div>
-    <div>{% idom_view "test_app.views.SimpleBarChart" %}</div>
+    <div>{% idom_view "test_app.components.SimpleBarChart" %}</div>
   </body>
 </html>
diff --git a/tests/test_app/views.py b/tests/test_app/views.py
@@ -1,8 +1,6 @@
 from django.http import HttpResponse
 from django.template import loader
 
-import test_app.components
-
 
 def base_template(request):
     context = {}
