dashboard: add dev mode for better dev experience

changkun · Aug 29, 2021 · 979b308 · 979b308
1 parent 01c9ef5
commit 979b308
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 20 deletions.
diff --git a/dashboard/public/index.html b/dashboard/public/index.html
@@ -12,7 +12,7 @@
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
     <!-- {{.AdminView}} and {{.StatsMode}} are replaced by server, e.g. -->
-    <!-- <div id="root" is-admin="true" stats-mode="true"></div> -->
-    <div id="root" is-admin="{{.AdminView}}" stats-mode="{{.StatsMode}}"></div>
+    <!-- <div id="root" is-admin="true" stats-mode="true" dev-mode="true"></div> -->
+    <div id="root" is-admin="{{.AdminView}}" stats-mode="{{.StatsMode}}" dev-mode="{{.DevMode}}"></div>
   </body>
 </html>
diff --git a/dashboard/src/App.js b/dashboard/src/App.js
@@ -11,9 +11,11 @@ const App = () => {
     const root = document.getElementById('root')
     const isAdmin = root.getAttribute('is-admin')
     const statsMode = root.getAttribute('stats-mode')
+    const devMode = root.getAttribute('dev-mode')
     return <Home
         isAdmin={isAdmin === 'true' ? true : false}
         statsMode={statsMode === 'true' ? true : false}
+        devMode={devMode === 'true' ? true : false}
     />
 }
 

diff --git a/dashboard/src/components/Home.js b/dashboard/src/components/Home.js
@@ -36,7 +36,7 @@ const Home = (props) => {
           {props.isAdmin ? <RedirCreate refreshRef={tableRefresh}/> : <div></div>}
           </div>
 
-          <RedirTable isAdmin={props.isAdmin} statsMode={props.statsMode} refreshRef={tableRefresh}/>
+          <RedirTable isAdmin={props.isAdmin} statsMode={props.statsMode} devMode={props.devMode} refreshRef={tableRefresh}/>
         </div>
       </Content>
       <Footer style={{ textAlign: 'center' }}>redir &copy; 2020-2021 Created by <a href='https://changkun.de'>Changkun Ou</a>. Open sourced under MIT license on <a href='https://changkun.de/s/redir'>GitHub</a>.</Footer>

diff --git a/dashboard/src/components/RedirTable.js b/dashboard/src/components/RedirTable.js
@@ -113,7 +113,7 @@ const RedirTable = (props) => {
 
   let pageSize = 10
   const expandedRowRender = (params) => {
-    return <Stats alias={params.alias}/>
+    return <Stats alias={params.alias} devMode={props.devMode}/>
   }
   return (
     <ConfigProvider locale={enUS}>
@@ -126,10 +126,18 @@ const RedirTable = (props) => {
         expandable={props.isAdmin && props.statsMode ? { expandedRowRender } : false}
         request={async (params) => {
           const mode = props.isAdmin ? 'index-pro' : 'index'
-          const host = window.location.origin
-          const path = window.location.pathname.endsWith('/') ?
-            window.location.pathname.slice(0, -1) :
-            window.location.pathname;
+
+          let host = ''
+          let path = ''
+          if (props.devMode) {
+            host = 'http://localhost:9123'
+            path = '/s'
+          } else {
+            host = window.location.origin
+            path = window.location.pathname.endsWith('/') ?
+              window.location.pathname.slice(0, -1) :
+              window.location.pathname;
+          }
 
           const url = `${host}${path}/?mode=${mode}&pn=${params.current}&ps=${params.pageSize}`
           const resp = await fetch(url, {

diff --git a/dashboard/src/components/Stats.js b/dashboard/src/components/Stats.js
@@ -29,10 +29,17 @@ const Stats = (props) => {
     setT1(t1)
   }
 
+  let endpoint = '/s/?'
+  if (props.devMode) {
+    endpoint = 'http://localhost:9123/s/?'
+  }
+
+  console.log(begin, end)
+
   const [pvuvData, setPVUVData] = useState([])
   useEffect(() => asyncFetchTime(t0, t1), [])
   const asyncFetchTime = (t0, t1) => {
-    fetch('/s/?'+ new URLSearchParams({
+    fetch(endpoint+ new URLSearchParams({
       mode: 'stats',
       a: props.alias,
       stat: 'time',
@@ -51,7 +58,7 @@ const Stats = (props) => {
   const [refData, setRefData] = useState([])
   useEffect(() => asyncFetchRef(t0, t1), [])
   const asyncFetchRef = (t0, t1) => {
-    fetch('/s/?'+ new URLSearchParams({
+    fetch(endpoint+ new URLSearchParams({
       mode: 'stats',
       a: props.alias,
       stat: 'referer',
@@ -70,7 +77,7 @@ const Stats = (props) => {
   const [uaData, setUAData] = useState([])
   useEffect(() => {asyncFetchUA(t0, t1)}, [])
   const asyncFetchUA = (t0, t1) => {
-    fetch('/s/?'+ new URLSearchParams({
+    fetch(endpoint+ new URLSearchParams({
       mode: 'stats',
       a: props.alias,
       stat: 'ua',
@@ -139,11 +146,13 @@ const Stats = (props) => {
     return 0
   })
   const dateRangeOnChange = (_, dateString) => {
-    setT0(dateString[0])
-    setT1(dateString[1])
-    asyncFetchTime(t0, t1)
-    asyncFetchRef(t0, t1)
-    asyncFetchUA(t0, t1)
+    const d0 = dateString[0]
+    const d1 = dateString[1]
+    setT0(d0)
+    setT1(d1)
+    asyncFetchTime(d0, d1)
+    asyncFetchRef(d0, d1)
+    asyncFetchUA(d0, d1)
   }
   return (
     <div>
@@ -152,7 +161,7 @@ const Stats = (props) => {
         onBack={false}
         title="Visitors"
       />
-      <DatePicker.RangePicker style={{float: 'right', bottom: '5px'}} defaultValue={[moment(t0), moment(t1)]} onChange={dateRangeOnChange}/>
+      <DatePicker.RangePicker style={{float: 'right', bottom: '5px'}} defaultValue={[moment(begin), moment(end)]} onChange={dateRangeOnChange}/>
       <Divider />
       <StatLine alias={props.alias} data={pvuvData} t0={t0} t1={t1}/>
       <Row>

diff --git a/short.go b/short.go
@@ -385,9 +385,7 @@ func (s *server) checkvcs(ctx context.Context, alias string) (*models.Redir, err
 
 	// construct the try path and make the request to vcs
 	repoPath := config.Conf.X.RepoPath
-	if strings.HasSuffix(repoPath, "/*") {
-		repoPath = strings.TrimSuffix(repoPath, "/*")
-	}
+	repoPath = strings.TrimSuffix(repoPath, "/*")
 	tryPath := fmt.Sprintf("%s/%s", repoPath, alias)
 	resp, err := http.Get(tryPath)
 	if err != nil {
@@ -445,9 +443,11 @@ func (s *server) sIndex(
 	e := struct {
 		AdminView bool
 		StatsMode bool
+		DevMode   bool
 	}{
 		AdminView: false,
 		StatsMode: config.Conf.Stats.Enable,
+		DevMode:   false,
 	}
 
 	mode := r.URL.Query().Get("mode")