Merge pull request #475 from player-ui/docsite-fixes

Docsite Fixes

BUILD.bazel

@@ -4,7 +4,6 @@ load("@npm//:defs.bzl", "npm_link_all_packages")
 load("@aspect_rules_js//js:defs.bzl", "js_library")
 load("@bazel_gazelle//:def.bzl", "gazelle_binary", "gazelle")
 load("@rules_swift_package_manager//swiftpkg:defs.bzl", "swift_update_packages")
-load("@bazel_tools//tools/jdk:default_java_toolchain.bzl", "default_java_toolchain")
 
 package(default_visibility = ["//visibility:public"])
 

MODULE.bazel

@@ -7,9 +7,9 @@ bazel_dep(name = "rules_player")
 
 archive_override(
   module_name = "rules_player",
-  strip_prefix = "rules_player-1.1.2",
-  urls = ["https://github.com/player-ui/rules_player/archive/refs/tags/v1.1.2.tar.gz"],
-  integrity = "sha256-7aroW0aRlDpr5tOKVloMANRaLvt6xOiDVxESrSy0t58="
+  strip_prefix = "rules_player-1.1.3",
+  urls = ["https://github.com/player-ui/rules_player/archive/refs/tags/v1.1.3.tar.gz"],
+  integrity = "sha256-Fqe4Y9aY5R0Y2yL9k+fsNKDrNPFP5/utyS5DQaoeYBA="
 )
 #local_path_override(module_name = "rules_player", path = "../rules_player")
 

docs/BUILD

@@ -1,4 +1,3 @@
-load("@bazel_tools//tools/build_defs/pkg:pkg.bzl", "pkg_tar")
 load("@rules_player//distribution/tar:defs.bzl", "stamp_tar_files")
 load("@rules_player//gh-pages:defs.bzl","gh_pages")
 
@@ -30,6 +29,7 @@ stamp_tar_files(
      "DOCS_BASE_PATH": "{STABLE_DOCS_BASE_PATH}",
      "ALGOLIA_SEARCH_API_KEY": "{STABLE_ALGOLIA_SEARCH_API_KEY}",
   },
+  stable = True
 )
 
 genrule(

docs/site/components/Image.tsx

@@ -1,13 +1,14 @@
-// import path from "path-browserify";
+import path from "path-browserify";
+import { BASE_PREFIX } from "../config/constants";
 
 export function withBasePrefix(location?: string): string | undefined {
   if (!location) {
     return location;
   }
 
-  // if (process.env.NEXT_PUBLIC_BASE_PATH) {
-  //   return path.join(process.env.NEXT_PUBLIC_BASE_PATH, location);
-  // }
+  if (BASE_PREFIX) {
+    return path.join("/", BASE_PREFIX, location);
+  }
 
   return location;
 }

docs/site/components/Navigation.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { Link, useLocation, useNavigate } from "react-router-dom";
+import { Link, useLocation } from "react-router-dom";
 import {
   Flex,
   Image,
@@ -10,7 +10,6 @@ import {
   Icon,
   Link as CLink,
   IconButton,
-  chakra,
   Drawer,
   Heading,
   Text,
@@ -27,7 +26,7 @@ import { HamburgerIcon } from "@chakra-ui/icons";
 import type { Route } from "../config/navigation";
 import NAV, { PATH_TO_NAV, Platform } from "../config/navigation";
 import { ColorSchemeSwitch } from "./ColorSchemeSwitch";
-import { DOCS_BASE_URL, GITHUB_URL } from "../config/constants";
+import { DOCS_BASE_URL, GITHUB_URL, BASE_PREFIX } from "../config/constants";
 import { withBasePrefix } from "./Image";
 import { SearchInput } from "./Search";
 import { GithubIcon } from "./gh-icon";
@@ -120,7 +119,7 @@ const SideNavigationList = (props: { route: Route }) => {
   );
 };
 
-export const SideNavigation = () => {
+export const SideNavigation = (): React.JSX.Element | null => {
   const { pathname } = useLocation();
   const subRoutes = PATH_TO_NAV.get(pathname);
 
@@ -141,7 +140,7 @@ export const Footer = () => {
   return null;
 };
 
-export const GitHubButton = () => {
+export const GitHubButton = (): React.JSX.Element => {
   return (
     <Link aria-label="Go to our GitHub page" to={GITHUB_URL}>
       <IconButton
@@ -192,9 +191,8 @@ const useGetReleasedVersions = () => {
   return releasedVersions;
 };
 
-export const VersionSelector = () => {
+export const VersionSelector = (): React.JSX.Element => {
   const location = useLocation();
-  const navigate = useNavigate();
   const released = useGetReleasedVersions();
 
   return (
@@ -206,9 +204,9 @@ export const VersionSelector = () => {
         display: "flex",
         flexShrink: "0",
       }}
-      value={location.pathname || "/latest"}
+      value={BASE_PREFIX || "latest"}
       onChange={(e) => {
-        navigate(`${DOCS_BASE_URL}/${e.target.value}`);
+        window.location.href = `${DOCS_BASE_URL}${e.target.value}/#${location.pathname}`;
       }}
     >
       <option value="latest">Latest</option>
@@ -222,7 +220,7 @@ export const VersionSelector = () => {
   );
 };
 
-export const TopNavigation = () => {
+export const TopNavigation = (): React.JSX.Element => {
   const { pathname, search } = useLocation();
   const subRoutes = PATH_TO_NAV.get(pathname);
   const mobileNavDisclosure = useDisclosure();

docs/site/config/constants.ts

@@ -1,2 +1,5 @@
-export const GITHUB_URL = 'https://github.com/player-ui/player';
-export const DOCS_BASE_URL = 'https://player-ui.github.io/';
+export const GITHUB_URL = "https://github.com/player-ui/player";
+export const DOCS_BASE_URL = "https://player-ui.github.io/";
+
+export const BASE_PREFIX: string | undefined =
+  process.env.NODE_ENV === "production" ? "DOCS_BASE_PATH" : undefined;

docs/site/webpack.config.ts

@@ -12,10 +12,6 @@ import fs from "fs";
 
 const __dirname = new URL(".", import.meta.url).pathname;
 
-// This will be replaced during the build stamping
-export const BASE_PREFIX =
-  process.env.NODE_ENV === "production" ? "/DOCS_BASE_PATH" : undefined;
-
 const findPageRoutes = (searchPath = "./pages") => {
   const files = fs.readdirSync(searchPath);
   const routes: string[] = [];