# Fetching the selected Organization

> Learn how to fetch the selected organization from the backend and frontend.

*Canonical: https://makerkit.dev/docs/remix-supabase/how-to/contextual-data/organization*

---

There are several ways to fetch the current selected organization, depending on the use-case.

### Using "parseOrganizationIdCookie" to get the Organization ID

You can use the `parseOrganizationIdCookie` function in:

- Remix Loaders
- Remix Actions

```tsx
import { LoaderFunctionArgs } from '@remix-run/node';
import getSupabaseServerClient from '~/core/supabase/server-client';
import requireSession from '~/lib/user/require-session.server';

import {
  parseOrganizationIdCookie,
} from '~/lib/server/cookies/organization.cookie';

async function getOrganizationId(request: Request) {
  const client = getSupabaseServerClient(request);
  const session = await requireSession(client);

  return parseOrganizationIdCookie(request, session.user.id);
}

export async function loader(args: LoaderFunctionArgs) {
  const organizationId = await getOrganizationId(args.request);

  return json({ organizationId });
}
```

This can be nullish, so remember to check for that.

## Fetching the selected Organization from the backend

To do so, use the function `getCurrentOrganization`, which also takes care of redirecting the user to the login page if they are not signed in, and checking the correct MFA access level if the user opted in.

You can use this function in:
- API Routes
- Server Actions
- Server Components

This function requires the current user ID and the (optionally) organization UID.

1. Get the current user ID from the session: we use the `requireSession` helper to do so.
2. Get the organization: we use the `getCurrentOrganization` helper to do so using the user ID and the organization UID.

```tsx
import { ActionFunctionArgs } from '@remix-run/node';

import getCurrentOrganization from '~/lib/server/organizations/get-current-organization';
import getSupabaseServerClient from '~/core/supabase/server-client';
import requireSession from '~/lib/user/require-session.server';

import {
  parseOrganizationIdCookie,
} from '~/lib/server/cookies/organization.cookie';

export async function action({ request }: ActionFunctionArgs) {
  const client = getSupabaseServerClient();
  const session = await requireSession(client);
  const userId = session.user.id;
  const organizationId = await parseOrganizationIdCookie(request, userId);

  const organizationResponse = await getCurrentOrganization(client, {
    organizationId,
    userId,
  });
}
```

## Fetching the selected Organization from the frontend

Within the `_app` layout, the layout loader passes the current organization is passed from the backend to the frontend using the Context API. Therefore, we can require it using the `useCurrentOrganization` hook.

### Getting the Organization with "useCurrentOrganization"

To retrieve the signed in user from the frontend, you can use the `useUserSession` hook:

```tsx
import useCurrentOrganization from '~/lib/organizations/hooks/use-current-organization';

const organization = useCurrentOrganization();
```

This is a React hook and can only be used inside a React component.

### Getting if the Organization subscription status is set to "active" on the frontend

You can use the `useIsSubscriptionActive` hook to get the subscription status of the current organization. You may want to use this function to gate access to certain parts of the app.

```tsx
import useCurrentOrganization from '~/lib/organizations/hooks/use-is-subscription-active';

const isActive = useIsSubscriptionActive();
```

This is a React hook and can only be used inside a React component.