xmengnet/yacd
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

feat: display current backend host in title

Browse source 
for https://github.com/haishanh/yacd/issues/531
This commit is contained in:
Haishan 2020-10-31 17:57:39 +08:00
parent cbb6b9c9bb
commit e62c916548
2 changed files with 63 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
src/components/Root.js → src/components/Root.tsx
View file

@ -1,9 +1,11 @@
import './Root.css';
import React, { lazy, Suspense } from 'react';
import { PartialRouteObject } from 'react-router';
import { HashRouter as Router, useRoutes } from 'react-router-dom';
import { RecoilRoot } from 'recoil';
import { About } from 'src/components/about/About';
import { Head } from 'src/components/shared/Head';
import { actions, initialState } from '../store';
import APIConfig from './APIConfig';
@ -16,40 +18,45 @@ import SideBar from './SideBar';
import StateProvider from './StateProvider';
import StyleGuide from './StyleGuide';
const Connections = lazy(() =>
import(
/* webpackChunkName: "conns" */
/* webpackPrefetch: true */
'./Connections'
)
const Connections = lazy(
() =>
import(
/* webpackChunkName: "conns" */
/* webpackPrefetch: true */
'./Connections'
)
);
const Config = lazy(() =>
import(
/* webpackChunkName: "config" */
/* webpackPrefetch: true */
'./Config'
)
const Config = lazy(
() =>
import(
/* webpackChunkName: "config" */
/* webpackPrefetch: true */
'./Config'
)
);
const Logs = lazy(() =>
import(
/* webpackChunkName: "logs" */
/* webpackPrefetch: true */
'./Logs'
)
const Logs = lazy(
() =>
import(
/* webpackChunkName: "logs" */
/* webpackPrefetch: true */
'./Logs'
)
);
const Proxies = lazy(() =>
import(
/* webpackChunkName: "proxies" */
/* webpackPrefetch: true */
'./proxies/Proxies'
)
const Proxies = lazy(
() =>
import(
/* webpackChunkName: "proxies" */
/* webpackPrefetch: true */
'./proxies/Proxies'
)
);
const Rules = lazy(() =>
import(
/* webpackChunkName: "rules" */
/* webpackPrefetch: true */
'./Rules'
)
const Rules = lazy(
() =>
import(
/* webpackChunkName: "rules" */
/* webpackPrefetch: true */
'./Rules'
)
);
const routes = [
@ -61,7 +68,7 @@ const routes = [
{ path: '/rules', element: <Rules /> },
{ path: '/about', element: <About /> },
__DEV__ ? { path: '/style', element: <StyleGuide /> } : false,
].filter(Boolean);
].filter(Boolean) as PartialRouteObject[];
function RouteInnerApp() {
return useRoutes(routes);
@ -94,6 +101,7 @@ const Root = () => (
<StateProvider initialState={initialState} actions={actions}>
<Router>
<div className={s0.app}>
<Head />
<Suspense fallback={<Loading2 />}>
<App />
</Suspense>

24
src/components/shared/Head.tsx Normal file
View file

@ -0,0 +1,24 @@
import * as React from 'react';
import { Helmet } from 'react-helmet';
import { connect } from 'src/components/StateProvider';
import { getClashAPIConfig } from 'src/store/app';
const mapState = (s) => ({
apiConfig: getClashAPIConfig(s),
});
function HeadImpl({ apiConfig }: { apiConfig: { baseURL: string } }) {
let title = 'yacd';
try {
title = new URL(apiConfig.baseURL).host;
} catch (e) {
// ignore
}
return (
<Helmet>
<title>{title}</title>
</Helmet>
);
}
export const Head = connect(mapState)(HeadImpl);