Moved profiling-supported subscription into ProfilerContext
Brian Vaughn committed
May 23, 2019 at 08:48 UTC
541dd6c4b6a51e853aa0e09843aed64dda313c3f
3 files changed
+16
-27
src/devtools/views/DevTools.js
+2
-20
@@ -5,7 +5,7 @@
5
import '@reach/menu-button/styles.css';
6
import '@reach/tooltip/styles.css';
7
8
-import React, { useMemo, useState } from 'react';
8
+import React, { useState } from 'react';
9
import Store from '../store';
10
import { BridgeContext, StoreContext } from './context';
11
import Components from './Components/Components';
@@ -18,7 +18,6 @@ import ViewElementSourceContext from './Components/ViewElementSourceContext';
18
import { ProfilerContextController } from './Profiler/ProfilerContext';
19
import { ModalDialogContextController } from './ModalDialog';
20
import ReactLogo from './ReactLogo';
21
-import { useSubscription } from './hooks';
21
22
import styles from './DevTools.css';
23
@@ -92,20 +91,6 @@ export default function DevTools({
91
setTab(overrideTab);
92
}
93
95
- const supportsProfilingSubscription = useMemo(
96
- () => ({
97
- getCurrentValue: () => store.supportsProfiling,
98
- subscribe: (callback: Function) => {
99
- store.addListener('supportsProfiling', callback);
100
- return () => store.removeListener('supportsProfiling', callback);
101
- },
102
- }),
103
- [store]
104
- );
105
- const supportsProfiling = useSubscription<boolean, Store>(
106
- supportsProfilingSubscription
107
- );
108
-
94
return (
95
<BridgeContext.Provider value={bridge}>
96
<StoreContext.Provider value={store}>
@@ -146,10 +131,7 @@ export default function DevTools({
131
className={styles.TabContent}
132
hidden={tab !== 'profiler'}
133
>
149
- <Profiler
150
- portalContainer={profilerPortalContainer}
151
- supportsProfiling={supportsProfiling}
152
- />
134
+ <Profiler portalContainer={profilerPortalContainer} />
135
</div>
136
<div
137
className={styles.TabContent}
src/devtools/views/Profiler/Profiler.js
+3
-6
@@ -23,11 +23,7 @@ import portaledContent from '../portaledContent';
23
24
import styles from './Profiler.css';
25
26
-export type Props = {|
27
- supportsProfiling: boolean,
28
-|};
29
-
30
-function Profiler({ supportsProfiling }: Props) {
26
+function Profiler(_: {||}) {
27
const {
28
didRecordCommits,
29
isProcessingData,
@@ -35,6 +31,7 @@ function Profiler({ supportsProfiling }: Props) {
31
selectedFiberID,
32
selectedTabID,
33
selectTab,
34
+ supportsProfiling,
35
} = useContext(ProfilerContext);
36
37
let view = null;
@@ -86,7 +83,7 @@ function Profiler({ supportsProfiling }: Props) {
83
<div className={styles.Profiler}>
84
<div className={styles.LeftColumn}>
85
<div className={styles.Toolbar}>
89
- <RecordToggle />
86
+ <RecordToggle disabled={!supportsProfiling} />
87
<ReloadAndProfileButton />
88
<ClearProfilingDataButton />
89
<ProfilingImportExportButtons />
src/devtools/views/Profiler/ProfilerContext.js
+11
-1
@@ -21,6 +21,9 @@ import type { ProfilingDataFrontend } from './types';
21
export type TabID = 'flame-chart' | 'ranked-chart' | 'interactions';
22
23
export type Context = {|
24
+ // Does the Store support profiling?
25
+ supportsProfiling: boolean,
26
+
27
// Which tab is selexted in the Profiler UI?
28
selectedTabID: TabID,
29
selectTab(id: TabID): void,
@@ -77,6 +80,7 @@ type StoreProfilingState = {|
80
isProcessingData: boolean,
81
isProfiling: boolean,
82
profilingData: ProfilingDataFrontend | null,
83
+ supportsProfiling: boolean,
84
|};
85
86
type Props = {|
@@ -97,25 +101,29 @@ function ProfilerContextController({ children }: Props) {
101
isProcessingData: profilerStore.isProcessingData,
102
isProfiling: profilerStore.isProfiling,
103
profilingData: profilerStore.profilingData,
104
+ supportsProfiling: store.supportsProfiling,
105
}),
106
subscribe: (callback: Function) => {
107
profilerStore.addListener('profilingData', callback);
108
profilerStore.addListener('isProcessingData', callback);
109
profilerStore.addListener('isProfiling', callback);
110
+ store.addListener('supportsProfiling', callback);
111
return () => {
112
profilerStore.removeListener('profilingData', callback);
113
profilerStore.removeListener('isProcessingData', callback);
114
profilerStore.removeListener('isProfiling', callback);
115
+ store.removeListener('supportsProfiling', callback);
116
};
117
},
118
}),
112
- [profilerStore]
119
+ [profilerStore, store]
120
);
121
const {
122
didRecordCommits,
123
isProcessingData,
124
isProfiling,
125
profilingData,
126
+ supportsProfiling,
127
} = useSubscription<StoreProfilingState, Store>(subscription);
128
129
const [prevProfilingData, setPrevProfilingData] = useState();
@@ -221,6 +229,7 @@ function ProfilerContextController({ children }: Props) {
229
profilingData,
230
startProfiling,
231
stopProfiling,
232
+ supportsProfiling,
233
234
rootID,
235
setRootID,
@@ -250,6 +259,7 @@ function ProfilerContextController({ children }: Props) {
259
profilingData,
260
startProfiling,
261
stopProfiling,
262
+ supportsProfiling,
263
264
rootID,
265
setRootID,