diff --git a/client/src/components/appbar/AppBar.tsx b/client/src/components/appbar/AppBar.tsx index 35839b6..b7308aa 100644 --- a/client/src/components/appbar/AppBar.tsx +++ b/client/src/components/appbar/AppBar.tsx @@ -18,7 +18,6 @@ export interface TabProps { export function Tab(props: any) { const { onClose, label, ...restProps } = props; - const [hover, setHover] = useState(false); const labelElem = {label} - {hover && + - } + ; return setHover(true)} - onMouseLeave={() => setHover(false)} label={labelElem} {...restProps} /> @@ -75,9 +72,9 @@ export default function AppBar(props: IProps) { } \ No newline at end of file diff --git a/client/src/components/tables/ResultsTable.tsx b/client/src/components/tables/ResultsTable.tsx index cfae983..154bdaa 100644 --- a/client/src/components/tables/ResultsTable.tsx +++ b/client/src/components/tables/ResultsTable.tsx @@ -6,6 +6,7 @@ import { newWindowReducer, WindowType } from '../windows/Windows'; import PersonIcon from '@material-ui/icons/Person'; import AlbumIcon from '@material-ui/icons/Album'; import AudiotrackIcon from '@material-ui/icons/Audiotrack'; +import LocalOfferIcon from '@material-ui/icons/LocalOffer'; export interface SongGetters { getTitle: (song: any) => string, @@ -15,6 +16,7 @@ export interface SongGetters { getAlbumNames: (song: any) => string[], getAlbumIds: (song: any) => number[], getTagNames: (song: any) => string[][], // Each tag is represented as a series of strings. + getTagIds: (song: any) => number[][], // Each tag is represented as a series of ids. } export interface IProps { @@ -55,19 +57,13 @@ export function SongTable(props: IProps) { const mainAlbumName = albumNames[0]; const mainAlbumId = props.songGetters.getAlbumIds(song)[0]; const songId = props.songGetters.getId(song); - const tags = props.songGetters.getTagNames(song).map((tag: string[]) => { - return - { - return (idx === 0) ? e : " / " + e; - })} /> - - }); + const tagIds = props.songGetters.getTagIds(song); const onClickArtist = () => { props.mainDispatch({ type: MainWindowStateActions.AddTab, tabState: { - tabLabel: <>{mainArtistName}, + tabLabel: <>{mainArtistName}, artistId: mainArtistId, metadata: null, }, @@ -80,7 +76,7 @@ export function SongTable(props: IProps) { props.mainDispatch({ type: MainWindowStateActions.AddTab, tabState: { - tabLabel: <>{mainAlbumName}, + tabLabel: <>{mainAlbumName}, albumId: mainAlbumId, metadata: null, }, @@ -93,7 +89,7 @@ export function SongTable(props: IProps) { props.mainDispatch({ type: MainWindowStateActions.AddTab, tabState: { - tabLabel: <>{title}, + tabLabel: <>{title}, songId: songId, metadata: null, }, @@ -102,6 +98,31 @@ export function SongTable(props: IProps) { }) } + const onClickTag = (id: number, name: string) => { + props.mainDispatch({ + type: MainWindowStateActions.AddTab, + tabState: { + tabLabel: <>{name}, + tagId: id, + metadata: null, + }, + tabReducer: newWindowReducer[WindowType.Tag], + tabType: WindowType.Tag, + }) + } + + const tags = props.songGetters.getTagNames(song).map((tag: string[], i: number) => { + const fullTag = stringifyList(tag, undefined, (idx: number, e: string) => { + return (idx === 0) ? e : " / " + e; + }) + return + onClickTag(tagIds[i][tagIds[i].length-1], fullTag)} + /> + + }); + const TextCell = (props: any) => { const classes = makeStyles({ button: { diff --git a/client/src/components/windows/AlbumWindow.tsx b/client/src/components/windows/AlbumWindow.tsx index adf703a..2ad17a8 100644 --- a/client/src/components/windows/AlbumWindow.tsx +++ b/client/src/components/windows/AlbumWindow.tsx @@ -81,7 +81,7 @@ export default function AlbumWindow(props: IProps) { value: m }); }) - }, []); + }, [props.state.metadata?.name]); return resolveTag(tag)); - } + }, + getTagIds: (song: any) => { + // Recursively resolve the id. + const resolveTag = (tag: any) => { + var r = [tag.tagId]; + if (tag.parent) { r.unshift(resolveTag(tag.parent)); } + return r; + } + + return song.tags.map((tag: any) => resolveTag(tag)); + }, } const doQuery = async (_query: QueryElem) => { diff --git a/client/src/components/windows/SongWindow.tsx b/client/src/components/windows/SongWindow.tsx index c7b97ef..b937b8f 100644 --- a/client/src/components/windows/SongWindow.tsx +++ b/client/src/components/windows/SongWindow.tsx @@ -81,7 +81,7 @@ export default function SongWindow(props: IProps) { value: m }); }) - }, []); + }, [props.state.metadata?.title]); return