# StatelessSurface\<T> Composable

### Understanding StatelessSurface and Its Use Case

**Scenario:**

Imagine you're building a news app where you want to display a list of articles from a remote server. In this case, the primary goal of the view is to fetch and display the articles, without requiring any user interaction or state changes within the view itself.

**StatelessSurface and Its Role:**

The `StatelessSurface` composable is ideal for this scenario because it's designed to handle a single state: the loading state. It doesn't require the view to maintain its own state for displaying the data.

**How It Works:**

1. **Data Fetching:** The view model fetches the list of articles from the server.
2. **Data Binding:** The `StatelessSurface` component is provided with the `RemoteData` object containing the fetched articles or an error message.
3. **State Handling:** The component automatically handles the loading state:
   * If data is not available (initial state or loading), it displays a loading indicator.
   * If an error occurs, it displays an error message.
   * If data is available, it displays the articles.

**Example Usage**

```kotlin
@Composable
fun NewsDetailScreen(newsId: Int) {
    val newsItem = viewModel.getNewsById(newsId).collectAsState()

    StatelessSurface<News>(
        remoteData = newsItem.value,
        loadingView = {
            CircularProgressIndicator()
        },
        errorView = { errMsg ->
            Text(text = "Error: $errMsg")
        },
        content = { news ->
            NewsDetails(news)
        }
    )
}
```

**Key Points:**

* **Single State:** `StatelessSurface` is primarily concerned with the loading state.
* **Data-Driven:** The view's appearance and behavior are driven solely by the data provided.
* **Simplified Logic:** The component handles common loading and error scenarios, reducing boilerplate code in the view.

**Contrast with Stateful Views:**

In contrast to stateful views, where the view maintains its own state (e.g., form input values, button states), `StatelessSurface` is designed for scenarios where the view's primary purpose is to display data without requiring user interaction or state changes.

**In Summary:**

`StatelessSurface` is a valuable tool for building simple, data-driven views that can efficiently handle loading and error states. It's particularly well-suited for scenarios where the view's primary goal is to display data from a remote source.