Songs now also supported, fixed bug

client/src/components/Window.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react';
 import { ThemeProvider, CssBaseline, createMuiTheme } from '@material-ui/core';
-import { QueryLeafElem, QueryLeafBy, QueryLeafOp, QueryElem, QueryNodeElem, queryOr, queryAnd } from '../lib/Query';
+import { QueryElem } from '../lib/Query';
 import QueryBuilder from './querybuilder/QueryBuilder';
 
 const darkTheme = createMuiTheme({
@@ -12,6 +12,8 @@ const darkTheme = createMuiTheme({
 export default function Window(props: any) {
     const [query, setQuery] = useState<QueryElem | null>(null);
 
+    console.log("Query:", query);
+
     return <ThemeProvider theme={darkTheme}>
         <CssBaseline />
         <QueryBuilder

client/src/components/querybuilder/QBQueryLeafElem.tsx

@@ -3,19 +3,34 @@ import { QueryLeafElem, QueryLeafBy, QueryLeafOp, QueryElem } from '../../lib/Qu
 import { Chip, Typography } from '@material-ui/core';
 import { QBQueryPlaceholder } from './QBQueryPlaceholder';
 
+export interface ElemChipProps {
+    label: any
+}
+
+export function LabeledElemChip(props: ElemChipProps) {
+    const label = <Typography>{props.label}</Typography>
+    return <Chip label={label} />
+}
+
 export interface LeafProps {
     elem: QueryLeafElem
     onReplace: (q: QueryElem) => void
 }
 
 export function QBQueryElemArtistEquals(props: LeafProps) {
-    let e = props.elem;
+    return <LabeledElemChip label={"By " + props.elem.b}/>
+}
 
-    const label = <Typography>
+export function QBQueryElemArtistLike(props: LeafProps) {
-        By {e.b}
+    return <LabeledElemChip label={"Artist like \"" + props.elem.b + "\""}/>
-    </Typography>;
+}
 
-    return <Chip label={label} />
+export function QBQueryElemTitleEquals(props: LeafProps) {
+    return <LabeledElemChip label={"\"" + props.elem.b + "\""}/>
+}
+
+export function QBQueryElemTitleLike(props: LeafProps) {
+    return <LabeledElemChip label={"Title like \"" + props.elem.b + "\""}/>
 }
 
 export function QBQueryLeafElem(props: LeafProps) {
@@ -25,6 +40,18 @@ export function QBQueryLeafElem(props: LeafProps) {
         e.leafOp == QueryLeafOp.Equals &&
         typeof e.b == "string") {
         return <QBQueryElemArtistEquals {...props} />
+    } else if (e.a == QueryLeafBy.ArtistName &&
+        e.leafOp == QueryLeafOp.Like &&
+        typeof e.b == "string") {
+        return <QBQueryElemArtistLike {...props} />
+    } if (e.a == QueryLeafBy.SongTitle &&
+        e.leafOp == QueryLeafOp.Equals &&
+        typeof e.b == "string") {
+        return <QBQueryElemTitleEquals {...props} />
+    } else if (e.a == QueryLeafBy.SongTitle &&
+        e.leafOp == QueryLeafOp.Like &&
+        typeof e.b == "string") {
+        return <QBQueryElemTitleLike {...props} />
     } else if (e.leafOp == QueryLeafOp.Placeholder) {
         return <QBQueryPlaceholder
             onReplace={props.onReplace}

client/src/lib/Query.tsx

@@ -95,6 +95,15 @@ export function addPlaceholders(
         q.leafOp != QueryLeafOp.Placeholder &&
         inNode !== null) {
         return { operands: [q, makePlaceholder()], nodeOp: otherOp[inNode] };
+    } else if (isLeafElem(q) &&
+        q.leafOp != QueryLeafOp.Placeholder &&
+        inNode === null) {
+        return {
+            operands: [
+                { operands: [q, makePlaceholder()], nodeOp: QueryNodeOp.And },
+                makePlaceholder(),
+            ], nodeOp: QueryNodeOp.Or
+        }
     }
 
     return q;