BC-106 GitHub pages custom domain

docs/easy-deployments.md

@@ -29,10 +29,10 @@ Github pages have some [usage limits](https://docs.github.com/en/pages/getting-s
 
 ### Usage Instructions
 
-1. Confirm that you can [build this project from source](./build-from-source.md). Be sure to install optional dependencies.
-2. Enable the [Github Pages feature](https://docs.github.com/en/pages/getting-started-with-github-pages) for the `gh-pages` branch in your repository.
-3. Run `yarn deploy:github`. Be sure to follow the instructions that appear on the screen.
-4. (Optional) If you need a customization option, review `yarn deploy:github --help`.
+1. (Optional) If you need a customization option, review `yarn deploy:github --help`.
+2. Confirm that you can [build this project from source](./build-from-source.md). Be sure to install optional dependencies.
+3. Enable the [Github Pages feature](https://docs.github.com/en/pages/getting-started-with-github-pages) for the `gh-pages` branch in your repository.
+4. Run `yarn deploy:github`. Be sure to follow the instructions that appear on the screen. If you want to connect your github deployment to a custom domain remember to add `--custom-domain=mydomain.com`
 
 <br />
 

scripts/deploy-github.js

@@ -68,7 +68,7 @@ function getBaseUrl() {
     return envBaseUrl;
   }
   const defaultBaseUrl = customDomain
-    ? '/'
+    ? ''
     : '/' + getGithubDir() + '/';
   return defaultBaseUrl;
 }
@@ -77,6 +77,7 @@ function getEnv() {
   return {
     ...process.env,
     SNOWPACK_PUBLIC_BASE_URL: getBaseUrl(),
+    SNOWPACK_PUBLIC_GITHUB_PAGES: true,
   }
 }
 
@@ -110,6 +111,7 @@ function help() {
     "--deploy - don't ask for deploy confirmation",
     '--deploy-args="--help" - pass arguments to gh-pages, in this case gh-pages --help',
     '--github-remote="origin" - select github remote to use to detect github project name, default is "origin"',
+    '--custom-domain="example.com" - (no slashes) deploy to custom domain instead of github directory',
     '',
   ].join('\n'));
 }

src/App.tsx

@@ -1,8 +1,8 @@
 import React, { Component } from 'react';
-import { BrowserRouter as Router } from 'react-router-dom';
 import { I18nextProvider, getI18n } from 'react-i18next';
 import type { Config } from 'types/Config';
 
+import Router from './components/Router/Router';
 import Root from './components/Root/Root';
 import ConfigProvider from './providers/ConfigProvider';
 import QueryProvider from './providers/QueryProvider';
@@ -11,7 +11,6 @@ import './styles/main.scss';
 import { restoreWatchHistory } from './stores/WatchHistoryStore';
 import { initializeFavorites } from './stores/FavoritesStore';
 import { initializeAccount } from './stores/AccountStore';
-import { getPublicUrl } from './utils/domHelpers';
 
 interface State {
   error: Error | null;
@@ -61,7 +60,7 @@ class App extends Component {
             onValidationError={this.configErrorHandler}
             onValidationCompleted={this.configValidationCompletedHandler}
           >
-            <Router basename={getPublicUrl('/')}>
+            <Router>
               <Root error={this.state.error} />
             </Router>
           </ConfigProvider>

src/components/Router/Router.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import { BrowserRouter, HashRouter } from 'react-router-dom';
+import type { BrowserRouterProps, HashRouterProps } from 'react-router-dom';
+
+export default function Router(props: BrowserRouterProps | HashRouterProps) {
+  if (import.meta.env.SNOWPACK_PUBLIC_GITHUB_PAGES) {
+    return <HashRouter {...props} />;
+  }
+  return <BrowserRouter {...props} />;
+}