Importing Angular Material components

Each Angular Material component is contained within its own module. These components are typically used in multiple places throughout our application, which is why we must import and re-export them from the shared module to avoid importing them in each module:

1. Open the shared/shared.module.ts file and add the following imports:

   import { MatToolbarModule } from 
     '@angular/material/toolbar';
   import { MatButtonModule } from 
     '@angular/material/button';
   import { MatIconModule } from 
     '@angular/material/icon';
   import { MatInputModule } from 
     '@angular/material/input';
   import { MatCardModule } from 
     '@angular/material/card';
   import { MatFormFieldModule } from 
     '@angular/material/form-field';
   import { MatTooltipModule } from 
     '@angular/material/tooltip';
   import { MatSnackBarModule } from 
    ...