Geolocation effect service

Until now we did not use RuntimeClient, since we run effects all on the server. As such, RuntimeClient is still empty:

import { Layer, ManagedRuntime } from "effect";

const MainLayer = Layer.empty;

export const RuntimeClient = ManagedRuntime.make(MainLayer);

RuntimeClient is used for all client-only services. Let's implement an example.

Geolocation service

In this example we use the Geolocation API to get the current location of the user.

Geolocation is a browser API, as such it's only available on the client.

Some API services are already available inside @effect/platform-browser, Geolocation is one of them. Let's install it:

pnpm add @effect/platform-browser

@effect/platform is a library that provides generic services. The effect ecosystem then has other libraries specific for various platforms (like @effect/platform-browser).

We can now use Geolocation to get the current location. We do this in a new Location.tsx component:

"use client";

import { Geolocation } from "@effect/platform-browser";
import { Effect } from "effect";

const action = Effect.gen(function* () {
  const geolocation = yield* Geolocation.Geolocation;
  return yield* geolocation.getCurrentPosition();
});

export default function Location() {
  return <p>Location: TODO</p>;
}

action is of type Effect<GeolocationPosition, Geolocation.GeolocationError, Geolocation.Geolocation>.