pstream is dead; long live pstream
taciturnaxolotl.github.io/pstream-ng/
fix reorder sources button on player
+105
-7
+3
-1
src/components/player/atoms/settings/SourceSelectingView.tsx
+3
-1
src/components/player/atoms/settings/SourceSelectingView.tsx
···
217
217
rightSide={
218
218
<button
219
219
type="button"
220
-
onClick={() => window.open("/settings#source-order")}
220
+
onClick={() => {
221
+
window.location.href = "/settings#source-order";
222
+
}}
221
223
className="-mr-2 -my-1 px-2 p-[0.4em] rounded tabbable hover:bg-video-context-light hover:bg-opacity-10"
222
224
>
223
225
{t("player.menus.sources.editOrder")}
+102
-6
src/pages/Settings.tsx
+102
-6
src/pages/Settings.tsx
···
175
175
useEffect(() => {
176
176
const hash = window.location.hash;
177
177
if (hash) {
178
-
const categoryId = hash.substring(1); // Remove the # symbol
178
+
const hashId = hash.substring(1); // Remove the # symbol
179
179
// Check if it's a valid settings category
180
180
const validCategories = [
181
181
"settings-account",
···
184
184
"settings-captions",
185
185
"settings-connection",
186
186
];
187
-
if (validCategories.includes(categoryId)) {
187
+
188
+
// Map sub-section hashes to their parent categories
189
+
const subSectionToCategory: Record<string, string> = {
190
+
"source-order": "settings-preferences",
191
+
};
192
+
193
+
// Check if it's a sub-section hash
194
+
if (subSectionToCategory[hashId]) {
195
+
const categoryId = subSectionToCategory[hashId];
188
196
setSelectedCategory(categoryId);
189
-
}
190
-
const element = document.querySelector(hash);
191
-
if (element) {
192
-
element.scrollIntoView({ behavior: "smooth" });
197
+
// Wait for the section to render, then scroll
198
+
setTimeout(() => {
199
+
const element = document.querySelector(hash);
200
+
if (element) {
201
+
element.scrollIntoView({ behavior: "smooth" });
202
+
}
203
+
}, 100);
204
+
} else if (validCategories.includes(hashId)) {
205
+
// It's a category hash
206
+
setSelectedCategory(hashId);
207
+
const element = document.querySelector(hash);
208
+
if (element) {
209
+
element.scrollIntoView({ behavior: "smooth" });
210
+
}
211
+
} else {
212
+
// Try to find the element anyway (might be a sub-section)
213
+
const element = document.querySelector(hash);
214
+
if (element) {
215
+
// Find which category this element belongs to
216
+
const parentSection = element.closest('[id^="settings-"]');
217
+
if (parentSection) {
218
+
const categoryId = parentSection.id;
219
+
if (validCategories.includes(categoryId)) {
220
+
setSelectedCategory(categoryId);
221
+
setTimeout(() => {
222
+
element.scrollIntoView({ behavior: "smooth" });
223
+
}, 100);
224
+
}
225
+
} else {
226
+
element.scrollIntoView({ behavior: "smooth" });
227
+
}
228
+
}
193
229
}
194
230
}
195
231
// eslint-disable-next-line react-hooks/exhaustive-deps
232
+
}, []);
233
+
234
+
// Handle hash changes after initial load
235
+
useEffect(() => {
236
+
const handleHashChange = () => {
237
+
const hash = window.location.hash;
238
+
if (hash) {
239
+
const hashId = hash.substring(1);
240
+
const validCategories = [
241
+
"settings-account",
242
+
"settings-preferences",
243
+
"settings-appearance",
244
+
"settings-captions",
245
+
"settings-connection",
246
+
];
247
+
const subSectionToCategory: Record<string, string> = {
248
+
"source-order": "settings-preferences",
249
+
};
250
+
251
+
if (subSectionToCategory[hashId]) {
252
+
const categoryId = subSectionToCategory[hashId];
253
+
setSelectedCategory(categoryId);
254
+
setTimeout(() => {
255
+
const element = document.querySelector(hash);
256
+
if (element) {
257
+
element.scrollIntoView({ behavior: "smooth" });
258
+
}
259
+
}, 100);
260
+
} else if (validCategories.includes(hashId)) {
261
+
setSelectedCategory(hashId);
262
+
setTimeout(() => {
263
+
const element = document.querySelector(hash);
264
+
if (element) {
265
+
element.scrollIntoView({ behavior: "smooth" });
266
+
}
267
+
}, 100);
268
+
} else {
269
+
const element = document.querySelector(hash);
270
+
if (element) {
271
+
const parentSection = element.closest('[id^="settings-"]');
272
+
if (parentSection) {
273
+
const categoryId = parentSection.id;
274
+
if (validCategories.includes(categoryId)) {
275
+
setSelectedCategory(categoryId);
276
+
setTimeout(() => {
277
+
element.scrollIntoView({ behavior: "smooth" });
278
+
}, 100);
279
+
}
280
+
} else {
281
+
element.scrollIntoView({ behavior: "smooth" });
282
+
}
283
+
}
284
+
}
285
+
}
286
+
};
287
+
288
+
window.addEventListener("hashchange", handleHashChange);
289
+
return () => {
290
+
window.removeEventListener("hashchange", handleHashChange);
291
+
};
196
292
}, []);
197
293
198
294
// Scroll to top when category changes (but not on initial load or when searching)