Use Supabase with iOS and SwiftUI

<$Partial path="quickstart_db_setup.mdx" />

<StepHikeCompact.Details title="Create an iOS SwiftUI app with Xcode">

Open Xcode > New Project > iOS > App. You can skip this step if you already have a working app.

</StepHikeCompact.Details>

<StepHikeCompact.Details title="Install the Supabase client library">

  Add the [supabase-swift](https://github.com/supabase/supabase-swift) package to your app using the Swift Package Manager.

  In Xcode, navigate to **File > Add Package Dependencies...** and enter the repository URL `https://github.com/supabase/supabase-swift` in the search bar. For detailed instructions, see Apple's [tutorial on adding package dependencies](https://developer.apple.com/documentation/xcode/adding-package-dependencies-to-your-app).

  Make sure to add `Supabase` product package as a dependency to your application target.

</StepHikeCompact.Details>

<StepHikeCompact.Details title="Initialize the Supabase client">

  Create a new `Supabase.swift` file add a new Supabase instance using your project URL and publishable key:

  <ProjectConfigVariables variable="url" />
  <ProjectConfigVariables variable="publishable" />


</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```swift name=Supabase.swift
  import Supabase

  let supabase = SupabaseClient(
    supabaseURL: URL(string: "YOUR_SUPABASE_URL")!,
    supabaseKey: "YOUR_SUPABASE_PUBLISHABLE_KEY"
  )
  ```

  <$Partial path="api_settings_steps.mdx" variables={{ "framework": "swift", "tab": "mobiles" }} />

</StepHikeCompact.Code>

<StepHikeCompact.Details title="Create a data model for instruments">

Create a decodable struct to deserialize the data from the database.

Add the following code to a new file named `Instrument.swift`.

</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```swift name=Instrument.swift
  struct Instrument: Decodable, Identifiable {
    let id: Int
    let name: String
  }
  ```

</StepHikeCompact.Code>

<StepHikeCompact.Details title="Query data from the app">

  Use a `task` to fetch the data from the database and display it using a `List`.

  Replace the default `ContentView` with the following code.

</StepHikeCompact.Details>

<StepHikeCompact.Code>

  ```swift name=ContentView.swift
  import SwiftUI

  struct ContentView: View {

    @State var instruments: [Instrument] = []

    var body: some View {
      List(instruments) { instrument in
        Text(instrument.name)
      }
      .overlay {
        if instruments.isEmpty {
          ProgressView()
        }
      }
      .task {
        do {
          instruments = try await supabase.from("instruments").select().execute().value
        } catch {
          dump(error)
        }
      }
    }
  }
  ```

</StepHikeCompact.Code>

Run the app on a simulator or a physical device by hitting `Cmd + R` on Xcode.

</StepHikeCompact.Details>