Config.svelte

<script>
    import { token } from "./stores.js";
  
    let fetching;
    
    // The bike list will be part of the athlete Data strava provides us...
    let athleteData;
    
    async function getAthleteData() {
        fetching = true;
        let response = await fetch(
            //$ http GET "https://www.strava.com/api/v3/athlete" "Authorization: Bearer [[token]]"
            "https://www.strava.com/api/v3/athlete",
            {
                headers: {
                    Authorization: "Bearer " + $token.access_token,
                },
            }
        );
        athleteData = await response.json();
        fetching = false;
        return;
    }
</script>

<div>
    {#if $token}        
        Hi there 
        {#if athleteData}
          {athleteData.firstname}
        {:else}
          authenticated user
        {/if}!
        <button on:click={getAthleteData}>Get athlete data!</button>    
    {/if}

    {#if fetching}One sec...{/if}
  
    {#if athleteData && athleteData.bikes}
      <h3>Bike List</h3>
      <ul>
      {#each athleteData.bikes as bike}
        <li>
          {bike.name} 
          ({bike.id})
          {#if bike.primary}
            (Strava Default)
          {/if}
      {/each}
      </ul>
    {/if}
</div>