Реализовать js корзину товаров с локальным хранилищем

На странице товара есть объект в теге script

 let product = {
		id: '23',
		name: 'product 1',
		size: '',
		url: 'https://luxe-couture.site/product/product-1/',
		price: '100',
	};

Кликая по классу .add_to_cart товар должен проверяться по ид, если он есть в корзине, то ничего не делаем, если нет. То добавляем.

Все товары в корзине должны выводиться в класс .mini_cart и иметь такую разметку:


<div class="d-flex align-items-center">
<a class="flex-shrink-0" href="переменная url">
<img src="переменная img_url" class="bg-body-tertiary rounded" width="110" alt="Thumbnail">
</a>
<div class="w-100 min-w-0 ps-3">
<h5 class="d-flex animate-underline mb-2">
<a class="d-block fs-sm fw-medium text-truncate animate-target" href="shop-product-fashion.html">переменная name</a>
</h5>
<div class="h6 pb-1 mb-2">$ переменная price</div>
<div class="d-flex align-items-center justify-content-between">
<button type="button" class="btn-close fs-sm" data-bs-toggle="tooltip" data-bs-custom-class="tooltip-sm" data-bs-title="Remove" aria-label="Remove from cart"></button>
</div>
</div>
</div>

В классе .cart__badge выводим количество товаров в корзине
В классе .cart__total выводим сумму товаров
По клику на data-bs-title="Remove" удалять товар из локлаьного хранилища и мини корзины

Клик по классу .cart__clear очистка корзины и локального хранилища

По клику на chekout сейчас всплывает окно модальное с контактной формой, необходимо в скрытое поле с ид product__info передавать данне о товарах в корзине (название ,ссылка на товар, сумма товара, размер и сумма всех товаров)


Также требуется починить вывод товаров на странице архива https://luxe-couture.site/product/ (тут все товары выводятся независимо от галочек в фильтре бренда.
А в категории https://luxe-couture.site/category/suit/ не выводится, хотя должны по умолчанию все выводится, как на странице выше.

Также в фильтре не работает поиск по бренду