diff --git a/client/src/components/Window.tsx b/client/src/components/Window.tsx
index e022e92..61c0678 100644
--- a/client/src/components/Window.tsx
+++ b/client/src/components/Window.tsx
@@ -1,6 +1,6 @@
import React, { useState } from 'react';
import { ThemeProvider, CssBaseline, createMuiTheme } from '@material-ui/core';
-import { QueryElem } from '../lib/Query';
+import { QueryElem } from '../lib/query/Query';
import QueryBuilder from './querybuilder/QueryBuilder';
const darkTheme = createMuiTheme({
diff --git a/client/src/components/querybuilder/QBQueryElem.tsx b/client/src/components/querybuilder/QBQueryElem.tsx
index 2478610..1655ec8 100644
--- a/client/src/components/querybuilder/QBQueryElem.tsx
+++ b/client/src/components/querybuilder/QBQueryElem.tsx
@@ -1,22 +1,28 @@
import React from 'react';
-import { QueryLeafElem, QueryNodeElem, QueryElem, isLeafElem, isNodeElem } from '../../lib/Query';
+import { QueryLeafElem, QueryNodeElem, QueryElem, isLeafElem, isNodeElem } from '../../lib/query/Query';
import { QBQueryLeafElem } from './QBQueryLeafElem';
import { QBQueryNodeElem } from './QBQueryNodeElem';
export interface IProps {
elem: QueryLeafElem | QueryNodeElem,
- onReplace: (q: QueryElem) => void,
+ onReplace: (q: QueryElem | null) => void,
+ editingQuery: boolean,
}
export function QBQueryElem(props: IProps) {
let e = props.elem;
if (isLeafElem(e)) {
- return
+ return
} else if (isNodeElem(e)) {
return
}
diff --git a/client/src/components/querybuilder/QBQueryElemMenu.tsx b/client/src/components/querybuilder/QBQueryElemMenu.tsx
index 9d8ed8c..75d2167 100644
--- a/client/src/components/querybuilder/QBQueryElemMenu.tsx
+++ b/client/src/components/querybuilder/QBQueryElemMenu.tsx
@@ -1,7 +1,7 @@
import React, { useState } from 'react';
import { Menu, TextField } from '@material-ui/core';
import NestedMenuItem from "material-ui-nested-menu-item";
-import { QueryElem, QueryLeafBy, QueryLeafOp } from '../../lib/Query';
+import { QueryElem, QueryLeafBy, QueryLeafOp } from '../../lib/query/Query';
import Autocomplete from '@material-ui/lab/Autocomplete'
export interface FreeSoloInputProps {
diff --git a/client/src/components/querybuilder/QBQueryLeafElem.tsx b/client/src/components/querybuilder/QBQueryLeafElem.tsx
index c53f5d3..01f83cb 100644
--- a/client/src/components/querybuilder/QBQueryLeafElem.tsx
+++ b/client/src/components/querybuilder/QBQueryLeafElem.tsx
@@ -1,57 +1,108 @@
import React from 'react';
-import { QueryLeafElem, QueryLeafBy, QueryLeafOp, QueryElem } from '../../lib/Query';
-import { Chip, Typography } from '@material-ui/core';
+import { QueryLeafElem, QueryLeafBy, QueryLeafOp, QueryElem } from '../../lib/query/Query';
+import { Chip, Typography, IconButton, Box } from '@material-ui/core';
import { QBQueryPlaceholder } from './QBQueryPlaceholder';
+import CloseIcon from '@material-ui/icons/Close';
export interface ElemChipProps {
- label: any
+ label: any,
+ extraElements?: any,
}
export function LabeledElemChip(props: ElemChipProps) {
- const label = {props.label}
+ const label =
+ {props.label}
+ {props.extraElements}
+
return
}
export interface LeafProps {
- elem: QueryLeafElem
- onReplace: (q: QueryElem) => void
+ elem: QueryLeafElem,
+ onReplace: (q: QueryElem) => void,
+ extraElements?: any,
}
export function QBQueryElemArtistEquals(props: LeafProps) {
- return
+ return
}
export function QBQueryElemArtistLike(props: LeafProps) {
- return
+ return
}
export function QBQueryElemTitleEquals(props: LeafProps) {
- return
+ return
}
export function QBQueryElemTitleLike(props: LeafProps) {
- return
+ return
}
-export function QBQueryLeafElem(props: LeafProps) {
+export interface DeleteButtonProps {
+ onClick?: (e: any) => void,
+}
+
+export function QBQueryElemDeleteButton(props: DeleteButtonProps) {
+ return
+
+
+}
+
+export interface IProps {
+ elem: QueryLeafElem,
+ onReplace: (q: QueryElem | null) => void,
+ editingQuery: boolean,
+}
+
+export function QBQueryLeafElem(props: IProps) {
let e = props.elem;
+ const extraElements = props.editingQuery ?
+ props.onReplace(null)}
+ />
+ : undefined;
+
if (e.a == QueryLeafBy.ArtistName &&
e.leafOp == QueryLeafOp.Equals &&
typeof e.b == "string") {
- return
+ return
} else if (e.a == QueryLeafBy.ArtistName &&
e.leafOp == QueryLeafOp.Like &&
typeof e.b == "string") {
- return
+ return
} if (e.a == QueryLeafBy.SongTitle &&
e.leafOp == QueryLeafOp.Equals &&
typeof e.b == "string") {
- return
+ return
} else if (e.a == QueryLeafBy.SongTitle &&
e.leafOp == QueryLeafOp.Like &&
typeof e.b == "string") {
- return
+ return
} else if (e.leafOp == QueryLeafOp.Placeholder) {
return void,
+ onReplace: (q: QueryElem | null) => void,
+ editingQuery: boolean,
}
export function QBQueryNodeElem(props: NodeProps) {
let e = props.elem;
- const onReplace = (idx: number, q: QueryElem) => {
+ const onReplace = (idx: number, q: QueryElem | null) => {
var ops = e.operands;
- ops[idx] = q;
- let newNode = { operands: ops, nodeOp: e.nodeOp };
+ if (q) {
+ ops[idx] = q;
+ } else {
+ ops.splice(idx, 1);
+ }
+ let newNode = simplify({ operands: ops, nodeOp: e.nodeOp });
props.onReplace(newNode);
}
const children = e.operands.map((o: any, idx: number) => {
- if (isNodeElem(o)) {
- return onReplace(idx, q)}
- />
- }
- return onReplace(idx, q)}
+ onReplace={(q: QueryElem | null) => onReplace(idx, q)}
+ editingQuery={props.editingQuery}
/>
});
diff --git a/client/src/components/querybuilder/QBQueryPlaceholder.tsx b/client/src/components/querybuilder/QBQueryPlaceholder.tsx
index 23ea5f7..4497e41 100644
--- a/client/src/components/querybuilder/QBQueryPlaceholder.tsx
+++ b/client/src/components/querybuilder/QBQueryPlaceholder.tsx
@@ -1,7 +1,7 @@
import React from 'react';
import { Chip } from '@material-ui/core';
import { QBQueryElemMenu } from './QBQueryElemMenu';
-import { QueryElem } from '../../lib/Query';
+import { QueryElem } from '../../lib/query/Query';
export interface IProps {
onReplace: (q: QueryElem) => void,
diff --git a/client/src/components/querybuilder/QueryBuilder.tsx b/client/src/components/querybuilder/QueryBuilder.tsx
index f8574e6..f14fb9e 100644
--- a/client/src/components/querybuilder/QueryBuilder.tsx
+++ b/client/src/components/querybuilder/QueryBuilder.tsx
@@ -2,7 +2,7 @@ import React, { useState } from 'react';
import { Box } from '@material-ui/core';
import QBQueryButton from './QBQueryButton';
import { QBQueryElem } from './QBQueryElem';
-import { QueryElem, addPlaceholders, removePlaceholders, simplify } from '../../lib/Query';
+import { QueryElem, addPlaceholders, removePlaceholders, simplify } from '../../lib/query/Query';
export interface IProps {
query: QueryElem | null,
@@ -33,6 +33,7 @@ export default function QueryBuilder(props: IProps) {
{showQuery && }
diff --git a/client/src/lib/Query.tsx b/client/src/lib/query/Query.tsx
similarity index 100%
rename from client/src/lib/Query.tsx
rename to client/src/lib/query/Query.tsx