simplify match and fix some bugs in it

Author: adhami3310

reflex/compiler/templates.py

@@ -56,9 +56,9 @@ def render(component: Mapping[str, Any] | str) -> str:
             return component
         if "iterable" in component:
             return _RenderUtils.render_iterable_tag(component)
-        if component.get("name") == "match":
+        if "match_cases" in component:
             return _RenderUtils.render_match_tag(component)
-        if "cond" in component:
+        if "cond_state" in component:
             return _RenderUtils.render_condition_tag(component)
         if (contents := component.get("contents")) is not None:
             return contents
@@ -90,15 +90,15 @@ def render_iterable_tag(component: Any) -> str:
     @staticmethod
     def render_match_tag(component: Any) -> str:
         cases_code = ""
-        for case in component.get("match_cases", []):
-            for condition in case[:-1]:
-                cases_code += f"    case JSON.stringify({condition._js_expr}):\n"
-            cases_code += f"""      return {_RenderUtils.render(case[-1])};
+        for conditions, return_value in component["match_cases"]:
+            for condition in conditions:
+                cases_code += f"    case JSON.stringify({condition}):\n"
+            cases_code += f"""      return {_RenderUtils.render(return_value)};
       break;
 """
 
         return f"""(() => {{
-  switch (JSON.stringify({component["cond"]._js_expr})) {{
+  switch (JSON.stringify({component["cond"]})) {{
 {cases_code}    default:
       return {_RenderUtils.render(component["default"])};
       break;
@@ -107,16 +107,17 @@ def render_match_tag(component: Any) -> str:
 
     @staticmethod
     def get_import(module: _ImportDict) -> str:
-        if module.get("default") and module.get("rest"):
-            rest_imports = ",".join(sorted(module["rest"]))
-            return (
-                f'import {module["default"]}, {{{rest_imports}}} from "{module["lib"]}"'
-            )
-        if module.get("default"):
-            return f'import {module["default"]} from "{module["lib"]}"'
-        if module.get("rest"):
-            rest_imports = ",".join(sorted(module["rest"]))
-            return f'import {{{rest_imports}}} from "{module["lib"]}"'
+        default_import = module["default"]
+        rest_imports = module["rest"]
+
+        if default_import and rest_imports:
+            rest_imports_str = ",".join(sorted(rest_imports))
+            return f'import {default_import}, {{{rest_imports_str}}} from "{module["lib"]}"'
+        if default_import:
+            return f'import {default_import} from "{module["lib"]}"'
+        if rest_imports:
+            rest_imports_str = ",".join(sorted(rest_imports))
+            return f'import {{{rest_imports_str}}} from "{module["lib"]}"'
         return f'import "{module["lib"]}"'
 
 

reflex/components/component.py

@@ -2817,27 +2817,30 @@ def render_dict_to_var(tag: dict | Component | str) -> Var:
             func,
         )
 
-    if tag["name"] == "match":
-        element = tag["cond"]
+    if "match_cases" in tag:
+        element = Var(tag["cond"])
 
         conditionals = render_dict_to_var(tag["default"])
 
         for case in tag["match_cases"][::-1]:
-            condition = case[0].to_string() == element.to_string()
-            for pattern in case[1:-1]:
-                condition = condition | (pattern.to_string() == element.to_string())
+            conditions, return_value = case
+            condition = Var.create(False)
+            for pattern in conditions:
+                condition = condition | (
+                    Var(pattern).to_string() == element.to_string()
+                )
 
             conditionals = ternary_operation(
                 condition,
-                render_dict_to_var(case[-1]),
+                render_dict_to_var(return_value),
                 conditionals,
             )
 
         return conditionals
 
-    if "cond" in tag:
+    if "cond_state" in tag:
         return ternary_operation(
-            tag["cond"],
+            Var(tag["cond_state"]),
             render_dict_to_var(tag["true_value"]),
             render_dict_to_var(tag["false_value"])
             if tag["false_value"] is not None

reflex/components/core/cond.py

@@ -61,7 +61,7 @@ def create(
 
     def _render(self) -> Tag:
         return CondTag(
-            cond=self.cond,
+            cond_state=str(self.cond),
             true_value=self.children[0].render(),
             false_value=self.children[1].render(),
         )
@@ -72,17 +72,11 @@ def render(self) -> dict:
         Returns:
             The dictionary for template of component.
         """
-        tag = self._render()
-        return dict(
-            tag.add_props(
-                **self.event_triggers,
-                key=self.key,
-                sx=self.style,
-                id=self.id,
-                class_name=self.class_name,
-            ),
-            cond_state=str(self.cond),
-        )
+        return {
+            "cond_state": str(self.cond),
+            "true_value": self.children[0].render(),
+            "false_value": self.children[1].render(),
+        }
 
     def add_imports(self) -> ImportDict:
         """Add imports for the Cond component.