check service work update on reload & init room

src/App.js

@@ -5,6 +5,7 @@ import { Sidebar } from './Sidebar';
 import { PressureHelper } from './PressureHelper';
 import { TokenCtx } from './UserAction';
 import { load_config, bgimg_style } from './Config';
+import { check_service_work_update } from './Common';
 import { load_attentions } from './Attention.js';
 import { listen_darkmode } from './infrastructure/functions';
 import { LoginPopup, TitleLine } from './infrastructure/widgets';
@@ -40,6 +41,7 @@ class App extends Component {
     window.BACKEND =
       localStorage['BACKEND'] || process.env.REACT_APP_BACKEND || '/';
 
+    check_service_work_update(false);
     if (process.env.NODE_ENV === 'production') {
       setTimeout(() => {
         fetch('https://api.github.com/users/hole-thu')

src/Common.js

@@ -11,6 +11,7 @@ import {
   split_text,
 } from './text_splitter';
 import renderMd from './Markdown';
+import { cache } from './cache';
 
 export { format_time, Time, TitleLine };
 
@@ -488,3 +489,25 @@ export class ClickHandler extends PureComponent {
     );
   }
 }
+
+export function check_service_work_update(update_now = false) {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready.then((serviceWorker) => {
+      const waitingServiceWorker = serviceWorker.waiting;
+      if (
+        waitingServiceWorker &&
+        (update_now || window.confirm('发现新版本，是否立即使用并刷新？'))
+      ) {
+        cache().clear();
+        waitingServiceWorker.addEventListener('statechange', (event) => {
+          if (event.target.state === 'activated') {
+            window.location.reload();
+          }
+        });
+        waitingServiceWorker.postMessage({ type: 'SKIP_WAITING' });
+      } else {
+        if (update_now) alert('没有已下载的更新');
+      }
+    });
+  }
+}

src/Config.js

@@ -32,7 +32,7 @@ const DEFAULT_CONFIG = {
   block_cw: ['xxg', 'zzxg'],
   block_words_v4: ['🕷️', '[系统自动代发]'],
   whitelist_cw: [],
-  room_id: process.env.REACT_APP_ROOM_ID,
+  room: process.env.REACT_APP_ROOM_ID,
 };
 
 export function load_config() {
@@ -222,13 +222,13 @@ class ConfigRoomId extends PureComponent {
   constructor(props) {
     super(props);
     this.state = {
-      room_id: window.config.room_id,
+      room: window.config.room,
     };
   }
 
   save_changes() {
     this.props.callback({
-      room_id: this.state.room_id,
+      room: this.state.room,
     });
   }
 
@@ -236,7 +236,7 @@ class ConfigRoomId extends PureComponent {
     let value = e.target.value;
     this.setState(
       {
-        room_id: value,
+        room: value,
       },
       this.save_changes.bind(this),
     );
@@ -249,7 +249,7 @@ class ConfigRoomId extends PureComponent {
           <b>分区编号：</b>
           <select
             className="config-select"
-            value={this.state.room_id}
+            value={this.state.room}
             onChange={this.on_select.bind(this)}
           >
             <option value="0">0区(默认分区)</option>
@@ -259,7 +259,7 @@ class ConfigRoomId extends PureComponent {
             <option value="4">4区</option>
             <option value="5">5区</option>
           </select>
-          &nbsp;<small>#room_id</small>
+          &nbsp;<small>#room</small>
         </p>
         <p className="config-description">
           选择分区编号，会作为发言时的分区和影响查看到的内容
@@ -416,7 +416,7 @@ export class ConfigUI extends PureComponent {
             callback={this.save_changes_bound}
           />
           <hr />
-          <ConfigRoomId id="room-id" callback={this.save_changes_bound} />
+          <ConfigRoomId id="room" callback={this.save_changes_bound} />
           <hr />
           <ConfigSwitch
             callback={this.save_changes_bound}

src/Flows.js

@@ -293,8 +293,8 @@ class FlowItem extends PureComponent {
             <code className="box-id">
               <a href={'##' + info.pid} onClick={this.copy_link.bind(this)}>
                 #{info.pid}
-                {info.room_id !== parseInt(window.config.room_id) && (
+                {info.room_id !== parseInt(window.config.room) && (
-                  <> @{info.room_id}</>
+                  <> @{info.room}</>
                 )}
               </a>
             </code>

src/Title.js

@@ -206,7 +206,7 @@ export function Title(props) {
               }
             >
               新T树洞
-              <sup>{window.config.room_id || '?'}</sup>
+              <sup>{window.config.room || '?'}</sup>
             </span>
           </p>
         </div>

src/UserAction.js

@@ -6,13 +6,13 @@ import {
   SafeTextarea,
   PromotionBar,
   HighlightedMarkdown,
+  check_service_work_update,
 } from './Common';
 import { MessageViewer } from './Message';
 import { LoginPopup } from './infrastructure/widgets';
 import { ColorPicker } from './color_picker';
 import { ConfigUI } from './Config';
 import copy from 'copy-to-clipboard';
-import { cache } from './cache';
 import { get_json } from './flows_api';
 import { save_attentions } from './Attention';
 
@@ -60,25 +60,7 @@ export function InfoSidebar(props) {
           <a
             href="###"
             onClick={() => {
-              if ('serviceWorker' in navigator) {
+              check_service_work_update(true);
-                navigator.serviceWorker.ready.then((serviceWorker) => {
-                  const waitingServiceWorker = serviceWorker.waiting;
-                  if (waitingServiceWorker) {
-                    cache().clear();
-                    waitingServiceWorker.addEventListener(
-                      'statechange',
-                      (event) => {
-                        if (event.target.state === 'activated') {
-                          window.location.reload();
-                        }
-                      },
-                    );
-                    waitingServiceWorker.postMessage({ type: 'SKIP_WAITING' });
-                  } else {
-                    alert('没有已下载的更新');
-                  }
-                });
-              }
             }}
           >
             立即更新
@@ -588,7 +570,7 @@ export class PostForm extends Component {
       text: text,
       allow_search: allow_search ? '1' : '',
       use_title: use_title ? '1' : '',
-      room_id: window.config.room_id,
+      room_id: window.config.room,
     });
     if (has_poll) {
       poll_options.forEach((opt) => {

src/flows_api.js

@@ -169,7 +169,7 @@ export const API = {
   get_list: async (page, token, submode) => {
     let response = await fetch(
       `${get_api_base()}/getlist?p=${page}&order_mode=${submode}&room_id=${
-        window.config.show_all_rooms ? '' : window.config.room_id
+        window.config.show_all_rooms ? '' : window.config.room
       }`,
       {
         headers: { 'User-Token': token },
@@ -181,7 +181,7 @@ export const API = {
   get_search: async (page, keyword, token, submode) => {
     let response = await fetch(
       `${get_api_base()}/search?search_mode=${submode}&page=${page}&room_id=${
-        window.config.show_all_rooms ? '' : window.config.room_id
+        window.config.show_all_rooms ? '' : window.config.room
       }&keywords=${encodeURIComponent(keyword)}&pagesize=${SEARCH_PAGESIZE}`,
       {
         headers: { 'User-Token': token },