fix(explore): bugs in Custom SQL editor in filter popover (#12278)

* Fix Save button disabled until clause is switched

* Fix 'undefined undefined' when sql query is empty

* fix test

Co-authored-by: Ville Brofeldt <ville.v.brofeldt@gmail.com>

superset-frontend/spec/javascripts/explore/utils_spec.jsx

@@ -25,6 +25,7 @@ import {
   getExploreLongUrl,
   getDataTablePageSize,
   shouldUseLegacyApi,
+  getSimpleSQLExpression,
 } from 'src/explore/exploreUtils';
 import {
   buildTimeRangeString,
@@ -298,4 +299,31 @@ describe('exploreUtils', () => {
       );
     });
   });
+
+  describe('getSimpleSQLExpression', () => {
+    const subject = 'subject';
+    const operator = '=';
+    const comparator = 'comparator';
+    it('returns empty string when subject is undefined', () => {
+      expect(getSimpleSQLExpression(undefined, '=', 10)).toBe('');
+      expect(getSimpleSQLExpression()).toBe('');
+    });
+    it('returns subject when its provided and operator is undefined', () => {
+      expect(getSimpleSQLExpression(subject, undefined, 10)).toBe(subject);
+      expect(getSimpleSQLExpression(subject)).toBe(subject);
+    });
+    it('returns subject and operator when theyre provided and comparator is undefined', () => {
+      expect(getSimpleSQLExpression(subject, operator)).toBe(
+        `${subject} ${operator}`,
+      );
+    });
+    it('returns full expression when subject, operator and comparator are provided', () => {
+      expect(getSimpleSQLExpression(subject, operator, comparator)).toBe(
+        `${subject} ${operator} ${comparator}`,
+      );
+      expect(getSimpleSQLExpression(subject, operator, comparator, true)).toBe(
+        `${subject} ${operator} ('${comparator}')`,
+      );
+    });
+  });
 });