Pin frontend package versions (#1920)

reflex/components/datadisplay/code.py

@@ -19,7 +19,7 @@ PRISM_STYLES_PATH: str = "/styles/code/prism"
 class CodeBlock(Component):
     """A code block."""
 
-    library = "react-syntax-highlighter@^15.5.0"
+    library = "react-syntax-highlighter@15.5.0"
 
     tag = "Prism"
 

reflex/components/datadisplay/datatable.py

@@ -14,9 +14,9 @@ from reflex.vars import BaseVar, ComputedVar, ImportVar, Var
 class Gridjs(Component):
     """A component that wraps a nivo bar component."""
 
-    library = "gridjs-react@^6.0.1"
+    library = "gridjs-react@6.0.1"
 
-    lib_dependencies: List[str] = ["gridjs@^6.0.6"]
+    lib_dependencies: List[str] = ["gridjs@6.0.6"]
 
 
 class DataTable(Gridjs):

reflex/components/forms/debounce.py

@@ -16,7 +16,7 @@ class DebounceInput(Component):
     is experiencing high latency.
     """
 
-    library = "react-debounce-input@^3.3.0"
+    library = "react-debounce-input@3.3.0"
     tag = "DebounceInput"
 
     # Minimum input characters before triggering the on_change event

reflex/components/forms/upload.py

@@ -24,7 +24,7 @@ clear_selected_files: BaseVar = BaseVar(
 class Upload(Component):
     """A file upload component."""
 
-    library = "react-dropzone@^14.2.3"
+    library = "react-dropzone@14.2.3"
 
     tag = "ReactDropzone"
 

reflex/components/graphing/plotly.py

@@ -16,9 +16,9 @@ except ImportError:
 class PlotlyLib(NoSSRComponent):
     """A component that wraps a plotly lib."""
 
-    library = "react-plotly.js@^2.6.0"
+    library = "react-plotly.js@2.6.0"
 
-    lib_dependencies: List[str] = ["plotly.js@^2.22.0"]
+    lib_dependencies: List[str] = ["plotly.js@2.22.0"]
 
 
 class Plotly(PlotlyLib):

reflex/components/graphing/recharts/recharts.py

@@ -10,7 +10,7 @@ class Recharts(Component):
 
     library = "recharts"
 
-    lib_dependencies: List[str] = ["recharts@^2.8.0"]
+    lib_dependencies: List[str] = ["recharts@2.8.0"]
 
 
 class RechartsCharts(NoSSRComponent):
@@ -18,4 +18,4 @@ class RechartsCharts(NoSSRComponent):
 
     library = "recharts"
 
-    lib_dependencies: List[str] = ["recharts@^2.8.0"]
+    lib_dependencies: List[str] = ["recharts@2.8.0"]

reflex/components/libs/react_player.py

@@ -11,7 +11,7 @@ class ReactPlayerComponent(NoSSRComponent):
     reference: https://github.com/cookpete/react-player.
     """
 
-    library = "react-player@^2.12.0"
+    library = "react-player@2.12.0"
 
     tag = "ReactPlayer"
 

reflex/components/media/icon.py

@@ -8,7 +8,7 @@ from reflex.utils import format
 class ChakraIconComponent(Component):
     """A component that wraps a Chakra icon component."""
 
-    library = "@chakra-ui/icons@^2.0.19"
+    library = "@chakra-ui/icons@2.0.19"
 
 
 class Icon(ChakraIconComponent):

reflex/components/typography/markdown.py

@@ -73,7 +73,7 @@ def get_base_component_map() -> dict[str, Callable]:
 class Markdown(Component):
     """A markdown component."""
 
-    library = "react-markdown@^8.0.7"
+    library = "react-markdown@8.0.7"
 
     tag = "ReactMarkdown"
 
@@ -132,14 +132,14 @@ class Markdown(Component):
         imports.update(
             {
                 "": {ImportVar(tag="katex/dist/katex.min.css")},
-                "remark-math@^5.1.1": {
+                "remark-math@5.1.1": {
                     ImportVar(tag=_REMARK_MATH.name, is_default=True)
                 },
-                "remark-gfm@^3.0.1": {ImportVar(tag=_REMARK_GFM.name, is_default=True)},
-                "rehype-katex@^6.0.3": {
+                "remark-gfm@3.0.1": {ImportVar(tag=_REMARK_GFM.name, is_default=True)},
+                "rehype-katex@6.0.3": {
                     ImportVar(tag=_REHYPE_KATEX.name, is_default=True)
                 },
-                "rehype-raw@^6.1.1": {ImportVar(tag=_REHYPE_RAW.name, is_default=True)},
+                "rehype-raw@6.1.1": {ImportVar(tag=_REHYPE_RAW.name, is_default=True)},
             }
         )
 

reflex/constants/base.py

@@ -107,6 +107,8 @@ class Next(SimpleNamespace):
     NODE_MODULES = "node_modules"
     # The package lock file.
     PACKAGE_LOCK = "package-lock.json"
+    # Regex to check for message displayed when frontend comes up
+    FRONTEND_LISTENING_REGEX = "Local:[\\s]+(.*)"
 
 
 # Color mode variables

reflex/constants/installer.py

@@ -102,22 +102,23 @@ class PackageJson(SimpleNamespace):
     PATH = os.path.join(Dirs.WEB, "package.json")
 
     DEPENDENCIES = {
-        "@chakra-ui/react": "^2.6.0",
-        "@chakra-ui/system": "^2.5.6",
-        "@emotion/react": "^11.10.6",
-        "@emotion/styled": "^11.10.6",
-        "axios": "^1.4.0",
-        "chakra-react-select": "^4.6.0",
-        "focus-visible": "^5.2.0",
-        "json5": "^2.2.3",
-        "next": "^13.3.1",
-        "next-sitemap": "^4.1.8",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
-        "socket.io-client": "^4.6.1",
-        "universal-cookie": "^4.0.4",
+        "@chakra-ui/react": "2.6.0",
+        "@chakra-ui/system": "2.5.6",
+        "@emotion/react": "11.10.6",
+        "@emotion/styled": "11.10.6",
+        "axios": "1.4.0",
+        "chakra-react-select": "4.6.0",
+        "focus-visible": "5.2.0",
+        "framer-motion": "10.16.4",
+        "json5": "2.2.3",
+        "next": "13.5.4",
+        "next-sitemap": "4.1.8",
+        "react": "18.2.0",
+        "react-dom": "18.2.0",
+        "socket.io-client": "4.6.1",
+        "universal-cookie": "4.0.4",
     }
     DEV_DEPENDENCIES = {
-        "autoprefixer": "^10.4.14",
-        "postcss": "^8.4.24",
+        "autoprefixer": "10.4.14",
+        "postcss": "8.4.24",
     }

reflex/constants/style.py

@@ -13,7 +13,7 @@ class Tailwind(SimpleNamespace):
     """Tailwind constants."""
 
     # The Tailwindcss version
-    VERSION = "tailwindcss@^3.3.2"
+    VERSION = "tailwindcss@3.3.2"
     # The Tailwind config.
     CONFIG = os.path.join(Dirs.WEB, "tailwind.config.js")
     # Default Tailwind content paths

reflex/testing.py

@@ -57,7 +57,6 @@ except ImportError:
 
 DEFAULT_TIMEOUT = 10
 POLL_INTERVAL = 0.25
-FRONTEND_LISTENING_MESSAGE = re.compile(r"ready started server on.*, url: (.*:[0-9]+)$")
 FRONTEND_POPEN_ARGS = {}
 T = TypeVar("T")
 TimeoutType = Optional[Union[int, float]]
@@ -224,7 +223,7 @@ class AppHarness:
             if not line:
                 break
             print(line)  # for pytest diagnosis
-            m = FRONTEND_LISTENING_MESSAGE.search(line)
+            m = re.search(reflex.constants.Next.FRONTEND_LISTENING_REGEX, line)
             if m is not None:
                 self.frontend_url = m.group(1)
                 break

reflex/utils/exec.py

@@ -85,10 +85,10 @@ def run_process_and_launch_url(run_command: list[str]):
             )
         if process.stdout:
             for line in processes.stream_logs("Starting frontend", process):
-                match = re.search("ready started server on ([0-9.:]+), url: (.*)", line)
+                match = re.search(constants.Next.FRONTEND_LISTENING_REGEX, line)
                 if match:
                     if first_run:
-                        url = match.group(2)
+                        url = match.group(1)
                         if get_config().frontend_path != "":
                             url = urljoin(url, get_config().frontend_path)
                         console.print(f"App running at: [bold green]{url}")