Revamp UI: share ord-app's look-and-feel and stack; add landing page

README.md

@@ -75,14 +75,15 @@ ORD_INTERFACE_TESTING=TRUE uv run uvicorn ord_interface.api.main:app --port 5000
 
 ### 3. Run the React SPA
 
-Download [Ketcher v2.5.1](https://github.com/epam/ketcher/releases/download/v2.5.1/ketcher-standalone-2.5.1.zip), extract it, and place the `standalone/` directory's contents inside `./app/public/ketcher/` (so that `app/public/ketcher/static/` and `app/public/ketcher/asset-manifest.json` exist). Then:
-
 ```shell
 cd app
 npm install
 npm run serve
 ```
 
+The molecule editor (Ketcher) is bundled from npm (`ketcher-react` +
+`ketcher-standalone`), so no separate download step is needed.
+
 Open <http://localhost:8080>. Vite hot-reloads source changes; `npm run dev` and `npm run preview` are also available as aliases for `vite` and `vite preview` respectively.
 
 ## Deployment
@@ -94,7 +95,7 @@ Production deployment is managed via Pulumi/ECS in the [`ord-infrastructure`](ht
 ### Minor changes (e.g. enum additions)
 
 - Update the `ord-schema` specifier in `pyproject.toml` under `[project] dependencies`, then run `uv lock` to refresh `uv.lock`.
-- Update the matching `ord-schema` version in [`app/package.json`](./app/package.json), then run `npm install` to refresh `app/package-lock.json`.
+- Update the matching `ord-schema-protobufjs` version in [`app/package.json`](./app/package.json), then run `npm install` to refresh `app/package-lock.json`.
 - Contact the ORD site administrator to roll out the new version to staging.
 
 ### Major changes (new message types, etc.)

app/index.html

@@ -50,31 +50,17 @@
       gtag('js', new Date());
       gtag('config', 'G-REEDLYB0ZJ');
     </script>
-    <!-- https://datatables.net/download/ -->
     <link
-      rel="stylesheet"
-      type="text/css"
-      href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.1.3/css/bootstrap.min.css"
+      rel="preconnect"
+      href="https://fonts.googleapis.com"
     />
     <link
-      rel="stylesheet"
-      type="text/css"
-      href="https://cdn.datatables.net/v/bs5/jq-3.6.0/dt-1.12.0/b-2.2.3/b-html5-2.2.3/fh-3.2.3/sb-1.3.3/sp-2.0.1/datatables.min.css"
+      rel="preconnect"
+      href="https://fonts.gstatic.com"
+      crossorigin
     />
-    <script
-      type="text/javascript"
-      src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.1.3/js/bootstrap.bundle.min.js"
-    ></script>
-    <script
-      type="text/javascript"
-      src="https://cdn.datatables.net/v/bs5/jq-3.6.0/dt-1.12.0/b-2.2.3/b-html5-2.2.3/fh-3.2.3/sb-1.3.3/sp-2.0.1/datatables.min.js"
-    ></script>
-    <script
-      type="text/javascript"
-      src="https://cdn.datatables.net/plug-ins/1.12.1/dataRender/ellipsis.js"
-    ></script>
     <link
-      href="https://fonts.googleapis.com/icon?family=Material+Icons"
+      href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"
       rel="stylesheet"
     />
   </head>