fix(foxy-filter-attribute-form): hide Create button when filter query is empty

Author: pheekus

src/elements/public/FilterAttributeForm/FilterAttributeForm.test.ts

@@ -140,15 +140,15 @@ describe('FilterAttributeForm', () => {
     expect(element.hiddenSelector.matches('filter-name', true)).to.be.false;
   });
 
-  it('hides action if filter query is empty and attribute is not created yet', async () => {
+  it('hides action when appropriate', async () => {
     const layout = html`<foxy-filter-attribute-form></foxy-filter-attribute-form>`;
     const element = await fixture<Form>(layout);
 
     expect(element.hiddenSelector.matches('action', true)).to.be.true;
     element.data = await getTestData('./hapi/store_attributes/0');
     expect(element.hiddenSelector.matches('action', true)).to.be.false;
     element.edit({ value: '' });
-    expect(element.hiddenSelector.matches('action', true)).to.be.false;
+    expect(element.hiddenSelector.matches('action', true)).to.be.true;
   });
 
   it('uses fixed visibility and attribute name when creating a resource', async () => {

src/elements/public/FilterAttributeForm/FilterAttributeForm.ts

@@ -60,9 +60,10 @@ export class FilterAttributeForm extends Base<Data> {
     const constructor = this.constructor as typeof FilterAttributeForm;
     const filterQuery = this.__getValueParam(constructor.filterQueryKey);
     const hasData = !!this.data;
+    const hasValue = !!this.form.value;
 
     if (!hasData) alwaysHidden.push('filter-name');
-    if (!filterQuery && !hasData) alwaysHidden.push('action');
+    if (!hasValue || (!filterQuery && !hasData)) alwaysHidden.push('action');
 
     return new BooleanSelector(`${alwaysHidden.join(' ')} ${super.hiddenSelector}`.trim());
   }