update all render to use position

reflex/.templates/jinja/web/pages/_app.js.jinja2

@@ -19,7 +19,15 @@ import * as {{library_alias}} from "{{library_path}}";
 {% block export %}
 function AppWrap({children}) {
 
-  {% for hook in hooks %}
+  {% for hook, data in hooks if data and data.position and data.position == const.hook_position.INTERNAL %}
+  {{ hook }}
+  {% endfor %}
+
+  {% for hook, data in hooks if not data or (not data.position or data.position == const.hook_position.PRE_TRIGGER) %}
+  {{ hook }}
+  {% endfor %}
+
+  {% for hook, data in hooks if data and data.position and data.position == const.hook_position.POST_TRIGGER %}
   {{ hook }}
   {% endfor %}
 

reflex/.templates/jinja/web/pages/custom_component.js.jinja2

@@ -8,9 +8,18 @@
 {% endfor %}
 
 export const {{component.name}} = memo(({ {{-component.props|join(", ")-}} }) => {
-    {% for hook in component.hooks %}
+    {% for hook, data in component.hooks if data and data.position and data.position == const.hook_position.INTERNAL %}
     {{ hook }}
     {% endfor %}
+
+    {% for hook, data in component.hooks if not data or (not data.position or data.position == const.hook_position.PRE_TRIGGER) %}
+    {{ hook }}
+    {% endfor %}
+
+    {% for hook, data in component.hooks if data and data.position and data.position == const.hook_position.POST_TRIGGER %}
+    {{ hook }}
+    {% endfor %}
+
     return(
         {{utils.render(component.render)}}
       )

reflex/.templates/jinja/web/pages/index.js.jinja2

@@ -8,7 +8,15 @@
 
 {% block export %}
 export default function Component() {
-  {% for hook in hooks %}
+  {% for hook, data in hooks.items() if data and data.position and data.position == const.hook_position.INTERNAL %}
+  {{ hook }}
+  {% endfor %}
+
+  {% for hook, data in hooks.items() if not data or (not data.position or data.position == const.hook_position.PRE_TRIGGER) %}
+  {{ hook }}
+  {% endfor %}
+
+  {% for hook, data in hooks.items() if data and data.position and data.position == const.hook_position.POST_TRIGGER %}
   {{ hook }}
   {% endfor %}
 

reflex/compiler/compiler.py

@@ -75,7 +75,7 @@ def _compile_app(app_root: Component) -> str:
     return templates.APP_ROOT.render(
         imports=utils.compile_imports(app_root._get_all_imports()),
         custom_codes=app_root._get_all_custom_code(),
-        hooks={**app_root._get_all_hooks_internal(), **app_root._get_all_hooks()},
+        hooks=app_root._get_all_hooks(),
         window_libraries=window_libraries,
         render=app_root.render(),
     )
@@ -149,7 +149,7 @@ def _compile_page(
         imports=imports,
         dynamic_imports=component._get_all_dynamic_imports(),
         custom_codes=component._get_all_custom_code(),
-        hooks={**component._get_all_hooks_internal(), **component._get_all_hooks()},
+        hooks=component._get_all_hooks(),
         render=component.render(),
         **kwargs,
     )

reflex/compiler/utils.py

@@ -290,7 +290,7 @@ def compile_custom_component(
             "name": component.tag,
             "props": props,
             "render": render.render(),
-            "hooks": {**render._get_all_hooks_internal(), **render._get_all_hooks()},
+            "hooks": {**render._get_all_hooks()},
             "custom_code": render._get_all_custom_code(),
         },
         imports,

reflex/components/component.py

@@ -1595,7 +1595,7 @@ class Component(BaseComponent, ABC):
         code = {}
 
         # Add the internal hooks for this component.
-        code.update(self._get_all_hooks_internal())
+        code.update(self._get_hooks_internal())
 
         # Add the hook code for this component.
         hooks = self._get_hooks()