Creepso/p-stream
1
0
Fork 0
mirror of https://github.com/p-stream/p-stream.git synced 2026-04-18 08:02:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix reorder sources button on player

Browse source
This commit is contained in:
Pas 2025-11-08 11:27:24 -07:00
parent bf1bb2775b
commit 1199a21df5
2 changed files with 105 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/components/player/atoms/settings/SourceSelectingView.tsx
View file

@ -217,7 +217,9 @@ export function SourceSelectionView({
rightSide={
<button
type="button"
onClick={() => window.open("/settings#source-order")}
onClick={() => {
window.location.href = "/settings#source-order";
}}
className="-mr-2 -my-1 px-2 p-[0.4em] rounded tabbable hover:bg-video-context-light hover:bg-opacity-10"
>
{t("player.menus.sources.editOrder")}

108
src/pages/Settings.tsx
View file

@ -175,7 +175,7 @@ export function SettingsPage() {
useEffect(() => {
const hash = window.location.hash;
if (hash) {
const categoryId = hash.substring(1); // Remove the # symbol
const hashId = hash.substring(1); // Remove the # symbol
// Check if it's a valid settings category
const validCategories = [
"settings-account",
@ -184,17 +184,113 @@ export function SettingsPage() {
"settings-captions",
"settings-connection",
];
if (validCategories.includes(categoryId)) {
// Map sub-section hashes to their parent categories
const subSectionToCategory: Record<string, string> = {
"source-order": "settings-preferences",
};
// Check if it's a sub-section hash
if (subSectionToCategory[hashId]) {
const categoryId = subSectionToCategory[hashId];
setSelectedCategory(categoryId);
}
const element = document.querySelector(hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
// Wait for the section to render, then scroll
setTimeout(() => {
const element = document.querySelector(hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}, 100);
} else if (validCategories.includes(hashId)) {
// It's a category hash
setSelectedCategory(hashId);
const element = document.querySelector(hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
} else {
// Try to find the element anyway (might be a sub-section)
const element = document.querySelector(hash);
if (element) {
// Find which category this element belongs to
const parentSection = element.closest('[id^="settings-"]');
if (parentSection) {
const categoryId = parentSection.id;
if (validCategories.includes(categoryId)) {
setSelectedCategory(categoryId);
setTimeout(() => {
element.scrollIntoView({ behavior: "smooth" });
}, 100);
}
} else {
element.scrollIntoView({ behavior: "smooth" });
}
}
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
// Handle hash changes after initial load
useEffect(() => {
const handleHashChange = () => {
const hash = window.location.hash;
if (hash) {
const hashId = hash.substring(1);
const validCategories = [
"settings-account",
"settings-preferences",
"settings-appearance",
"settings-captions",
"settings-connection",
];
const subSectionToCategory: Record<string, string> = {
"source-order": "settings-preferences",
};
if (subSectionToCategory[hashId]) {
const categoryId = subSectionToCategory[hashId];
setSelectedCategory(categoryId);
setTimeout(() => {
const element = document.querySelector(hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}, 100);
} else if (validCategories.includes(hashId)) {
setSelectedCategory(hashId);
setTimeout(() => {
const element = document.querySelector(hash);
if (element) {
element.scrollIntoView({ behavior: "smooth" });
}
}, 100);
} else {
const element = document.querySelector(hash);
if (element) {
const parentSection = element.closest('[id^="settings-"]');
if (parentSection) {
const categoryId = parentSection.id;
if (validCategories.includes(categoryId)) {
setSelectedCategory(categoryId);
setTimeout(() => {
element.scrollIntoView({ behavior: "smooth" });
}, 100);
}
} else {
element.scrollIntoView({ behavior: "smooth" });
}
}
}
}
};
window.addEventListener("hashchange", handleHashChange);
return () => {
window.removeEventListener("hashchange", handleHashChange);
};
}, []);
// Scroll to top when category changes (but not on initial load or when searching)
useEffect(() => {
if (