DevTools Profiler commit selector wraps around (#17760)
I used to disable the <- and -> buttons when you reached the beginning or end of the profiler data. This can be kind of annoying though when you just want to get to the last commit, and I don't think there's a good reason to enforce it anyway, so I backed that change out. The buttons now wrap around at the beginning or end of the list.
Brian Vaughn committed
Jan 2, 2020 at 14:44 UTC
cca994c6a1f13dd0b64ad0a909b5209b10cc8609
1 file changed
+10
-13
packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotSelector.js
+10
-13
@@ -95,20 +95,20 @@ export default function SnapshotSelector(_: Props) {
95
96
const viewNextCommit = useCallback(
97
() => {
98
- const nextCommitIndex = Math.min(
99
- ((selectedFilteredCommitIndex: any): number) + 1,
100
- filteredCommitIndices.length - 1,
101
- );
98
+ let nextCommitIndex = ((selectedFilteredCommitIndex: any): number) + 1;
99
+ if (nextCommitIndex === filteredCommitIndices.length) {
100
+ nextCommitIndex = 0;
101
+ }
102
selectCommitIndex(filteredCommitIndices[nextCommitIndex]);
103
},
104
[selectedFilteredCommitIndex, filteredCommitIndices, selectCommitIndex],
105
);
106
const viewPrevCommit = useCallback(
107
() => {
108
- const nextCommitIndex = Math.max(
109
- ((selectedFilteredCommitIndex: any): number) - 1,
110
- 0,
111
- );
108
+ let nextCommitIndex = ((selectedFilteredCommitIndex: any): number) - 1;
109
+ if (nextCommitIndex < 0) {
110
+ nextCommitIndex = filteredCommitIndices.length - 1;
111
+ }
112
selectCommitIndex(filteredCommitIndices[nextCommitIndex]);
113
},
114
[selectedFilteredCommitIndex, filteredCommitIndices, selectCommitIndex],
@@ -141,7 +141,7 @@ export default function SnapshotSelector(_: Props) {
141
<span className={styles.IndexLabel}>{label}</span>
142
<Button
143
className={styles.Button}
144
- disabled={selectedFilteredCommitIndex === 0 || numFilteredCommits === 0}
144
+ disabled={numFilteredCommits === 0}
145
onClick={viewPrevCommit}
146
title="Select previous commit">
147
<ButtonIcon type="previous" />
@@ -173,10 +173,7 @@ export default function SnapshotSelector(_: Props) {
173
</div>
174
<Button
175
className={styles.Button}
176
- disabled={
177
- selectedFilteredCommitIndex === null ||
178
- selectedFilteredCommitIndex >= numFilteredCommits - 1
179
- }
176
+ disabled={numFilteredCommits === 0}
177
onClick={viewNextCommit}
178
title="Select next commit">
179
<ButtonIcon type="next" />