Merge pull request #117 from social-native/feat/add-raw-query-filter

Feat/add raw query filter

dev/app/context.ts

@@ -19,6 +19,7 @@ import {
 } from '../../src';
 import {IRangeConfig} from '../../src/filters/range_filter';
 import {reaction} from 'mobx';
+import QueryStringFilter from '../../src/filters/query_string_filter';
 // import {toJS} from 'mobx';
 
 const exampleFormInstance = new ExampleForm();
@@ -77,6 +78,22 @@ const customTermsFilter = new TermsFilter({
     fieldNameModifierAggs: (fieldName: string) => `${fieldName}.keyword`
 });
 
+const customQueryStringFilter = new QueryStringFilter({
+    defaultFilterInclusion: 'include',
+    defaultFilterKind: 'must',
+    getCount: false,
+    aggsEnabled: false,
+    fieldNameModifierQuery: (fieldName: string) => fieldName,
+    fieldNameModifierAggs: (fieldName: string) => fieldName
+}, {
+    'user.age': {
+        field: 'user.age',
+    },
+    'user_profile.age': {
+        field: 'user_profile.age',
+    }
+})
+
 const defaultRangeFilterConfig: IRangeConfig = {
     field: '',
     aggsEnabled: false,
@@ -98,7 +115,6 @@ const customRangeFilterConfig = {
 };
 
 const customRangeFilter = new RangeFilter(defaultRangeFilterConfig as any, customRangeFilterConfig);
-
 const client = new AxiosESClient(process.env.ELASTIC_SEARCH_ENDPOINT);
 // const client = new CreatorIndexGQLClient(gqlClient);
 const creatorCRM = new Manager(client, {
@@ -117,7 +133,8 @@ const creatorCRM = new Manager(client, {
     // ],
     filters: {
         range: customRangeFilter,
-        terms: customTermsFilter
+        terms: customTermsFilter,
+        queryString: customQueryStringFilter
     },
     suggestions: {
         prefix: customPrefixSuggestion

dev/app/features/index.ts

@@ -10,3 +10,4 @@ export {default as CustomQuery} from './custom_query';
 export {default as ExistsFilter} from './exists_filter';
 export {default as MultiSelectFilter} from './multi_select_filter';
 export {default as HistoryNav} from './history_nav';
+export {default as QueryStringFilter} from './query_string_filter';

dev/app/features/query_string_filter.tsx

@@ -0,0 +1,37 @@
+import React, {useContext, useState} from 'react';
+import Context from '../context';
+
+export type QueryStringFilterProps = {
+    field: string
+}
+
+// tslint:disable-next-line:variable-name
+const QueryStringFilter: React.FC<QueryStringFilterProps> = (props) => {
+    const { field } = props;
+    const creatorCRM = useContext(Context.creatorCRM);
+    const [queryStringInput, setQueryStringInput] = useState<string>('');
+
+    const {
+        filters: {queryString: queryStringFilter}
+    } = creatorCRM;
+
+    return (
+        <div style={{display: 'flex', flexDirection: 'column'}}>
+            <div>Query String Filter for {field}</div>
+            <br/>
+            <label htmlFor={'queryString'}>
+                Query String
+                <br/>
+                <input
+                    name={'queryString'}
+                    id={'queryString'}
+                    value={queryStringInput}
+                    onChange={({ target: { value } }) => setQueryStringInput(value)}
+                />
+            </label>
+            <br/>
+            <button onClick={() => queryStringFilter.setFilter(field, { query: queryStringInput, inclusion: 'must' })}>Apply</button>
+        </div>
+    );
+};
+export default QueryStringFilter

dev/app/index.tsx

@@ -13,7 +13,7 @@ import {
     Suggestion,
     ExistsFilter,
     MultiSelectFilter,
-    HistoryNav
+    HistoryNav, QueryStringFilter
 } from './features';
 
 const Main = styled.div`
@@ -63,6 +63,7 @@ export default () => (
             {/* <FilterSelector filterType={'boolean'} defaultFilterName={'instagram.is_business'}>
                 {filterName => <BooleanFilter filterName={filterName}/>}
             </FilterSelector> */}
+            <QueryStringFilter field={'user_profile.age'} />
         </HorizontalLayout>
         <ResultsTable />
     </Main>

package.json

@@ -1,6 +1,6 @@
 {
     "name": "elastic-composer",
-    "version": "4.3.1",
+    "version": "4.4.0",
     "description": "",
     "main": "dist/index.cjs.js",
     "module": "dist/index.es.js",

src/filters/index.ts

@@ -6,7 +6,7 @@ export {default as MultiSelectFilter} from './multi_select_filter';
 export {default as DateRangeFilter} from './date_range_filter';
 export {default as GeoFilter} from './geo_filter';
 export {default as TermsFilter} from './terms_filter';
-
+export {default as QueryStringFilter} from './query_string_filter';
 export {default as filterUtils} from './utils';
 
 import {