Skip to content

Commit

Permalink
chore(ui): move moment poller to a dedicated component
Browse files Browse the repository at this point in the history
  • Loading branch information
prymitive committed Jun 16, 2020
1 parent 0bab7d3 commit fdc6e1b
Show file tree
Hide file tree
Showing 4 changed files with 21 additions and 11 deletions.
7 changes: 7 additions & 0 deletions ui/src/App.tsx
Expand Up @@ -45,6 +45,12 @@ const FaviconBadge = React.lazy(() =>
}))
);

const MomentPolledTimer = React.lazy(() =>
import("Components/MomentPolledTimer").then((module) => ({
default: module.MomentPolledTimer,
}))
);

interface UIDefaults {
Refresh: number;
HideFiltersWhenIdle: boolean;
Expand Down Expand Up @@ -156,6 +162,7 @@ const App: FunctionComponent<AppProps> = ({ defaultFilters, uiDefaults }) => {
<React.Suspense fallback={null}>
<FaviconBadge alertStore={alertStore} />
<Fetcher alertStore={alertStore} settingsStore={settingsStore} />
<MomentPolledTimer />
</React.Suspense>
</ErrorBoundary>
));
Expand Down
12 changes: 12 additions & 0 deletions ui/src/Components/MomentPolledTimer/index.js
@@ -0,0 +1,12 @@
import React, { useEffect } from "react";

import Moment from "react-moment";

export function MomentPolledTimer() {
useEffect(() => {
Moment.startPooledTimer();
return () => Moment.clearPooledTimer();
}, []);

return <span id="moment-polled-timer" />;
}
6 changes: 2 additions & 4 deletions ui/src/Stores/AlertStore.js
Expand Up @@ -4,8 +4,6 @@ import throttle from "lodash.throttle";

import qs from "qs";

import moment from "moment";

import { FetchGet } from "Common/Fetch";

const QueryStringEncodeOptions = {
Expand Down Expand Up @@ -280,7 +278,7 @@ class AlertStore {
setIdle() {
this.value = AlertStoreStatuses.Idle;
this.error = null;
this.lastUpdateAt = moment();
this.lastUpdateAt = new Date();
},
setFetching() {
this.value = AlertStoreStatuses.Fetching;
Expand All @@ -292,7 +290,7 @@ class AlertStore {
setFailure(err) {
this.value = AlertStoreStatuses.Failure;
this.error = err;
this.lastUpdateAt = moment();
this.lastUpdateAt = new Date();
},
pause() {
this.paused = true;
Expand Down
7 changes: 0 additions & 7 deletions ui/src/index.tsx
Expand Up @@ -7,8 +7,6 @@ import "react-app-polyfill/stable";
import React from "react";
import ReactDOM from "react-dom";

import Moment from "react-moment";

import "mobx-react-lite/batchingForReactDom";

import {
Expand All @@ -21,11 +19,6 @@ import { App } from "./App";

SetupSentry(SettingsElement());

// global timer for updating timestamps to human readable offsets
// this needs to be run before any <Moment/> instance
// https://www.npmjs.com/package/react-moment#pooled-timer
Moment.startPooledTimer();

// https://wetainment.com/testing-indexjs/
export default ReactDOM.render(
<App
Expand Down

0 comments on commit fdc6e1b

Please sign in to comment.