URL parameters disappear on page reload

Vue 2.6.6
Algoliasearch 4.4.0
vue-instantsearch 3.1.0

I have a project that which loads a default search on page load:
./search/?new=true
Whenever I have a refinement under “feature_list” selected with “new=true”, the “feature_list” parameter disappears on page reload (or when I click on a result and go back). Every other refinement works fine (and is coded the same). For example, all of the (below) examples persist in the URL:
./search/?new=true&door_count=4
./search/?new=true&color=Blue
./search/?new=false&feature_list=Brake%2520assist

Yet something like:
./search/?new=true&feature_list=Brake%2520assist
does not persist in the URL address upon page refresh

Here’s a snippet of my vue component (I tried to keep it short)

"SearchComponent.vue
<template>
  <ais-instant-search
    :index-name="indexName"
    :search-client="searchClient"
    :routing="routing"
    :initial-ui-state="initialUiState"
  >
....
<ais-menu attribute="new" class="newFilterMenu">
            <ul
              slot-scope="{ items, refine, createURL }"
              class="condition-new-filters"
            >
              <li>
                <a
                  :href="createURL('true')"
                  :style="{
                    fontWeight: conditionNew ? 'bold' : '',
                    background: conditionNew ? '#0072CE' : '',
                    color: conditionNew ? '#FFFFFF' : '#0072CE',
                    pointerEvents: conditionNew ? 'none': 'all',
                  }"
                  @click.prevent="refineCondition(refine, 'true')"
                >
                 <span>New</span>
                </a>
              </li>

              <li>
                <a
                  :href="createURL('false')"
                  :style="{
                    fontWeight: !conditionNew ? 'bold' : '',
                    background: !conditionNew ? '#0072CE' : '',
                    color: !conditionNew ? '#FFFFFF' : '#0072CE',
                    pointerEvents: !conditionNew ? 'none': 'all',
                  }"
                  @click.prevent="refineCondition(refine, 'false')"
                >
                 <span>Used</span>
                </a>
              </li>
            </ul>
          </ais-menu>
...
                <!-- Transmission Filter -->
                <div class="col">
                  <ais-panel>
                    <template slot="header">
                      <h6>Transmission</h6>
                    </template>
                    <template slot="default">
                      <ais-menu attribute="transmission" />
                    </template>
                  </ais-panel>
                </div>

                <hr class="divider" />


                <!-- Engine Filter -->
                <div class="col-12">
                  <ais-panel>
                    <template slot="header">
                      <h6>Engine</h6>
                    </template>
                    <template slot="default">
                      <ais-menu attribute="engine" />
                    </template>
                  </ais-panel>
                </div>

                <hr class="divider" />

                <!-- Features Filter -->
                <div class="col-12">
                  <ais-panel>
                    <template slot="header">
                      <h6>Features</h6>
                    </template>
                    <template slot="default">
                      <ais-menu
                        :limit="8"
                        attribute="feature_list"
                        :show-more="true"
                        :show-more-limit="50"
                        :sort-by="['isRefined']"
                      />
                    </template>
                  </ais-panel>
                </div>
.....
  </ais-instant-search>
</template>

And here’s the logic for my routing routing.js

routing.js
import { history as historyRouter } from "instantsearch.js/es/lib/routers";
import CONFIG from "config";
const INDEX_NAME = CONFIG.ALGOLIA_INDEX;
const routeParams = [
    "year",
    "price",
    "mileage",
    "highway_mpg",
    "city_mpg",
    "new",
    "make",
    "model",
    "fuel",
    "color",
    "drivetrain_description",
    "body",
    "feature_list",
    "trim",
    "transmission",
    "certified",
    "query",
    "engine",
    "page",
    "door_count",
    "cylinders",
    "sortBy"
];
export const routingLogic = {
    router: historyRouter({
        // writeDelay: 400,
        createURL({ qsModule, location, routeState }) {
            const urlParts = location.href.match(/^(.*?)\/search/);
            const baseUrl = `${urlParts ? urlParts[1] : ""}/`;
            const queryParameters = {};
            routeParams.map((param) => {
                if (routeState[param]) {
                    queryParameters[param] = encodeURIComponent(routeState[param]);
                }
            });
            const queryString = qsModule.stringify(queryParameters, {
                addQueryPrefix: true,
                arrayFormat: "repeat",
            });
            return `${baseUrl}search/${queryString}`;
        },
        parseURL({ qsModule, location }) {
            const {
                query = "",
                page,
                make = "",
                model = "",
                fuel = "",
                color = "",
                drivetrain_description = "",
                body = "",
                mileage = "",
                year = "",
                price = "",
                highway_mpg = "",
                city_mpg = "",
                feature_list = "",
                trim = "",
                transmission = "",
                certified = "",
                engine = "",
                door_count = "",
                cylinders = "",
                sortBy = "",
            } = qsModule.parse(location.search.slice(1));
            let newFilter = qsModule.parse(location.search.slice(1)).new;
            if (newFilter == undefined) {
                newFilter = "true";
            } else {
                newFilter.toLowerCase();
            }
            return {
                query: decodeURIComponent(query),
                page: page,
                make: decodeURIComponent(make),
                model: decodeURIComponent(model),
                fuel: decodeURIComponent(fuel),
                color: decodeURIComponent(color),
                drivetrain_description: decodeURIComponent(drivetrain_description),
                body: decodeURIComponent(body),
                new: decodeURIComponent(newFilter),
                mileage: decodeURIComponent(mileage),
                year: decodeURIComponent(year),
                price: decodeURIComponent(price),
                highway_mpg: decodeURIComponent(highway_mpg),
                city_mpg: decodeURIComponent(city_mpg),
                feature_list: decodeURIComponent(feature_list),
                trim: decodeURIComponent(trim),
                transmission: decodeURIComponent(transmission),
                certified: decodeURIComponent(certified),
                engine: decodeURIComponent(engine),
                door_count: decodeURIComponent(door_count),
                cylinders: decodeURIComponent(cylinders),
                sortBy: decodeURIComponent(sortBy),
            };
        },
    }),
    stateMapping: {
        stateToRoute(uiState) {
            const indexUiState = uiState[INDEX_NAME] || {};
            let menu = indexUiState['menu'];
            $('.applyMakeModelButton').hide();
            $('.applyBodyButton').hide();
            if (menu) {
                if ('make' in menu || 'model' in menu) {
                    $('.applyMakeModelButton').show();
                }
                if ('body' in menu) {
                    $('.applyBodyButton').show();
                }
            }
            return {
                query: indexUiState.query,
                page: indexUiState.page,
                new: indexUiState.menu && indexUiState.menu.new,
                make: indexUiState.menu && indexUiState.menu.make,
                model: indexUiState.menu && indexUiState.menu.model,
                fuel: indexUiState.menu && indexUiState.menu.fuel,
                color: indexUiState.menu && indexUiState.menu.color,
                drivetrain_description:
                    indexUiState.menu && indexUiState.menu.drivetrain_description,
                body: indexUiState.menu && indexUiState.menu.body,
                year: indexUiState.range && indexUiState.range.year,
                price: indexUiState.range && indexUiState.range.price,
                mileage: indexUiState.range && indexUiState.range.mileage,
                highway_mpg: indexUiState.range && indexUiState.range.highway_mpg,
                city_mpg: indexUiState.range && indexUiState.range.city_mpg,
                feature_list: indexUiState.menu && indexUiState.menu.feature_list,
                trim: indexUiState.menu && indexUiState.menu.trim,
                transmission: indexUiState.menu && indexUiState.menu.transmission,
                certified: indexUiState.menu && indexUiState.menu.certified,
                engine: indexUiState.menu && indexUiState.menu.engine,
                door_count: indexUiState.menu && indexUiState.menu.door_count,
                cylinders: indexUiState.menu && indexUiState.menu.cylinders,
                sortBy: indexUiState.sortBy
            };
        },
        routeToState(routeState) {
            const stateObject = {
                query: routeState.query,
                page: routeState.page,
                menu: {
                    new: routeState.new,
                    make: routeState.make,
                    model: routeState.model,
                    fuel: routeState.fuel,
                    color: routeState.color,
                    drivetrain_description: routeState.drivetrain_description,
                    body: routeState.body,
                    feature_list: routeState.feature_list,
                    trim: routeState.trim,
                    transmission: routeState.transmission,
                    certified: routeState.certified,
                    engine: routeState.engine,
                    door_count: routeState.door_count,
                    cylinders: routeState.cylinders,
                },
                range: {
                    year: routeState.year,
                    price: routeState.price,
                    mileage: routeState.mileage,
                    highway_mpg: routeState.highway_mpg,
                    city_mpg: routeState.city_mpg,
                },
                sortBy: routeState.sortBy,
            };
            return {
                dev_cars: stateObject,
                local_search: stateObject,
                clawson_search_production: stateObject,
                algo_1: stateObject,
            };
        },
    },
};

So even though feature_list is pretty much identical to all the other components, it does not persist when new=true

And within my SearchComponent.vue, my script tag contains the following:

script