<script lang="ts">
  import { faBriefcase, faGraduationCap, faLocationPin } from '@fortawesome/free-solid-svg-icons';
  import ExtraItem from './ExtraItem.svelte';

  export let location: string | undefined = undefined;
  export let school: string | undefined = undefined;
  export let workplace: string | undefined = undefined;
</script>

{#if location || school || workplace}
  <div class="flex flex-wrap gap-x-3 gap-y-2">
    {#if location}
      <ExtraItem icon={faLocationPin} text={location.trim()} />
    {/if}
    {#if school}
      <ExtraItem icon={faGraduationCap} text={school.trim()} />
    {/if}
    {#if workplace}
      <ExtraItem icon={faBriefcase} text={workplace.trim()} />
    {/if}
  </div>
{/if}
