Reset a Formik form after clicking another Formik form

I have a react.js component which is a facet and its content is populated according to some keyword search. Every time that a new search is made, the content of the facet changes (country name - number). The facet and the search are two different Formik forms. In this example, if any of the country is checked then it is kept in the next search if the same country is also found in the following search. How is it possible to clear the facet form after every keyword search?

import React, { useState, useEffect } from 'react';

import { Formik, Field, FieldArray, Form, useFormikContext } from 'formik';


function Facet (props) {

  return(
    <div>
      <Formik
        enableReintialize={true}
        initialValues={{
          countries: ''
        }}
        onSubmit={async (values) => {
          await sleep(500);
          alert(JSON.stringify(values, null, 2));
        }}
      >
        {({ values }) => (
          <Form>
            <FormObserver />

            <b>Countries </b>

            <div>
              <FieldArray
                name="countries"
                render={arrayHelpers => (
                  <div>
                    {props.countryDist.map(countries_dist => (
                      <div key={countries_dist.country}>
                        <label>
                          <input
                            name="countries"
                            type="checkbox"
                            value={countries_dist.country}
                            checked={values.countries.includes(countries_dist.country)}
                            onChange={e => {
                              if (e.target.checked) {
                                arrayHelpers.push(countries_dist.country);
                              } else {
                                const idx = values.countries.indexOf(countries_dist.country);
                                arrayHelpers.remove(idx);
                              }
                            }}
                          />
                          {" " + countries_dist.country +
                           " (" + countries_dist.count + ")"}
                        </label>
                      </div>
                    ))}
                  </div>
                )}
              />
            </div>

          </Form>
        )}
      </Formik>
    </div>
  );
}

export default Facet;

Edit:

Search.js

import React from 'react';

import { Formik } from 'formik';
import { Button, Col, Form, Row } from 'react-bootstrap';

function Search (props) {

  const onSubmit_func = async (values, actions) => {
    await props.search_p(values.query);
  }

  return (

    <Formik
      initialValues={{
        query: ''
      }}
      onSubmit={onSubmit_func}
    >
      {({
        handleChange,
        handleSubmit,
        setFieldValue,
        values
      }) => (
        <Form noValidate onSubmit={handleSubmit}>
          <Form.Group controlId='query'>
            <Row>
              <Col>
                <Form.Control
                  autoFocus
                  type='text'
                  name='query'
                  value={values.query}

                  onChange={e => {
                    setFieldValue('countries', [])
                    handleChange(e)
                  }}

                />

              </Col>
              
              <Col>
                <p>
                  <Button type='submit' variant='primary'>Search</Button>
                </p>
              </Col>
            </Row>
          </Form.Group>
        </Form>
      )}
    </Formik>

  );
}

export default Search;