Fixed the bug of missing relation names in join relational algebra statements

Signed-off-by: Michael Mior <[email protected]>

Author: axj2613

src/RelExpr.js

@@ -101,6 +101,8 @@ const RelExpr: StatelessFunctionalComponent<Props> = (props) => {
           <Join
             type={expr.join.type}
             condition={exprToString(expr.join.condition)}
+            left={exprToString(expr.join.left.relation)}
+            right={exprToString(expr.join.right.relation)}
           />
         );
 

src/RelExprTree.js

@@ -104,6 +104,8 @@ const RelExprTree: StatelessFunctionalComponent<Props> = (props) => {
           <Join
             type={expr.join.type}
             condition={exprToString(expr.join.condition)}
+            left={exprToString(expr.join.left.relation)}
+            right={exprToString(expr.join.right.relation)}
           />
         );
       case 'except':

src/RelOp.js

@@ -139,23 +139,25 @@ export const Intersect: StatelessFunctionalComponent<{||}> = () => (
 export const Join: StatelessFunctionalComponent<{
   type: string,
   condition: string,
+  left: string,
+  right: string,
 }> = (props) => {
   if (props.type === 'left') {
     return (
       <span>
-        ⟕<sub>{props.condition}</sub>
+        {props.left} ⟕<sub>{props.condition}</sub> {props.right}
       </span>
     );
   } else if (props.type === 'right') {
     return (
       <span>
-        ⟖<sub>{props.condition}</sub>
+        {props.left} ⟖<sub>{props.condition}</sub> {props.right}
       </span>
     );
   } else {
     return (
       <span>
-        ⋈<sub>{props.condition}</sub>
+        {props.left} ⋈<sub>{props.condition}</sub> {props.right}
       </span>
     );
   }

src/RelOp.test.js

@@ -15,7 +15,6 @@ import {
   Join,
   Union,
 } from './RelOp';
-import {exprToString} from './util';
 
 each([
   ['unary operators', <UnaryRelOp />],
@@ -88,23 +87,23 @@ it('renders a Product', () => {
 /** @test {Join} */
 it('renders an inner Join', () => {
   const {container} = render(
-    <Join type={'inner'} condition={'foo=3 ∧ bar=2'} />
+    <Join type={'inner'} left={'A'} condition={'foo=3 ∧ bar=2'} right={'B'} />
   );
-  expect(container).toContainHTML('⋈<sub>foo=3 ∧ bar=2</sub>');
+  expect(container).toContainHTML('A ⋈<sub>foo=3 ∧ bar=2</sub> B');
 });
 
 /** @test {Join} */
 it('renders a left outer Join', () => {
   const {container} = render(
-    <Join type={'left'} condition={'foo=3 ∧ bar=2'} />
+    <Join type={'left'} left={'A'} condition={'foo=3 ∧ bar=2'} right={'B'} />
   );
-  expect(container).toContainHTML('⟕<sub>foo=3 ∧ bar=2</sub>');
+  expect(container).toContainHTML('A ⟕<sub>foo=3 ∧ bar=2</sub> B');
 });
 
 /** @test {Join} */
 it('renders a right outer Join', () => {
   const {container} = render(
-    <Join type={'right'} condition={'foo=3 ∧ bar=2'} />
+    <Join type={'right'} left={'A'} condition={'foo=3 ∧ bar=2'} right={'B'} />
   );
   expect(container).toContainHTML('⟖<sub>foo=3 ∧ bar=2</sub>');
 });