add filter with material

client/src/app/features/recipes/recipes.component.html

@@ -122,10 +122,25 @@
                   (input)="setSearch($event)"
                   (keydown.enter)="search($event)"
                 />
+                <ng-select
+                  [items]="materialList"
+                  class="join-item text-base"
+                  bindLabel="name"
+                  bindValue="id"
+                  [multiple]="true"
+                  [closeOnSelect]="false"
+                  [(ngModel)]="selectMaterialFilter"
+                >
+                  <ng-template ng-option-tmp let-item="item">
+                    <p class="text-xs">{{ item.name }}</p>
+                    <small class="text-xs text-gray-500">{{ item.id }}</small>
+                  </ng-template>
+                </ng-select>
                 <button class="btn join-item" (click)="search($event)">
                   Search
                 </button>
               </div>
+
               <div class="flex gap-2">
                 <button class="btn rounded-lg" (click)="openJsonTab()">
                   View JSON