[HRD-Console] React SDK implementation (#319)

* HRD in Console WIP

* Set login function

* Form reacting to webhook challenge update

* Reorganize the state

* Remove comment

* Publish beta release

* Create changeset

* Remove log

* Use lastest Core SDK

* Revert dev env

* Fix leftovers

* Adjust the implementation

* Write unit tests

* Propagate flow cancelled error upstream

* Use suffixed token

* Adjust Remix SDK

* whitespace

* Write unit tests for org suffix

* Fix dev file

* Apply changes based on code review feedback

* Add a separate changeset for token storage changes

* Fix logout behaviour, debug switching WIP

* Remove the logs, store user on switch

* Get most recent user handle for the org switching flow

* Fix the race condition when storing new user token

* Add additional log out test

* Extract common bits, refactor org switching flow

* Refactor auth flow

* Use null factor

* Rename symbol

* Define handlers per flow

Author: kaspermroz

.changeset/late-peas-turn.md

@@ -0,0 +1,5 @@
+---
+"@slashid/react": minor
+---
+
+Store user tokens for multiple organizations, suffixed with org ID

.changeset/tough-chairs-glow.md

@@ -0,0 +1,5 @@
+---
+"@slashid/react": minor
+---
+
+Create internal components for the new org switching flow

packages/react-primitives/package.json

@@ -76,7 +76,7 @@
   },
   "devDependencies": {
     "@faker-js/faker": "^8.0.2",
-    "@slashid/slashid": "3.17.1",
+    "@slashid/slashid": "3.29.0",
     "@storybook/addon-essentials": "7.6.19",
     "@storybook/addon-interactions": "7.4.0",
     "@storybook/addon-links": "7.4.0",

packages/react/.env

@@ -1 +1,2 @@
-VITE_ORG_ID=
+VITE_ORG_ID=
+VITE_ORG_SWITCHING_ORG_ID=

packages/react/package.json

@@ -60,7 +60,7 @@
   },
   "devDependencies": {
     "@faker-js/faker": "^8.0.2",
-    "@slashid/slashid": "3.28.0",
+    "@slashid/slashid": "3.29.0",
     "@storybook/addon-essentials": "7.6.19",
     "@storybook/addon-interactions": "7.4.0",
     "@storybook/addon-links": "7.4.0",

packages/react/src/components/dynamic-flow/index.tsx

@@ -3,7 +3,7 @@ import { clsx } from "clsx";
 import { FormProvider } from "../../context/form-context";
 import { useCallback, useRef } from "react";
 import { Handle, LoginOptions } from "../../domain/types";
-import { CreateFlowOptions } from "../form/flow";
+import { CreateFlowOptions } from "../form/flow/flow.common";
 import { useFlowState } from "../form/useFlowState";
 import { AuthenticatingImplementation as Authenticating } from "../form/authenticating";
 import { Success } from "../form/success";

packages/react/src/components/dynamic-flow/initial.tsx

@@ -3,7 +3,7 @@ import { Factor } from "@slashid/slashid";
 import { Divider } from "@slashid/react-primitives";
 
 import { FormProvider } from "../../context/form-context";
-import { InitialState } from "../form/flow";
+import { InitialState } from "../form/flow/flow.common";
 import { Logo } from "../form/initial/logo";
 import { Oidc } from "./oidc";
 import { Text } from "../text";

packages/react/src/components/form/authenticating/authenticating.test.tsx

@@ -1,6 +1,6 @@
 import { render, screen } from "@testing-library/react";
 import { AuthenticatingImplementation as Authenticating } from "./index";
-import { AuthenticatingState } from "../flow";
+import { AuthenticatingState } from "../flow/flow.common";
 import {
   TestSlashIDProvider,
   TestTextProvider,

packages/react/src/components/form/authenticating/authenticating.types.ts

@@ -1,4 +1,4 @@
-import { AuthenticatingState } from "../flow";
+import { AuthenticatingState } from "../flow/flow.common";
 
 export type Props = {
   flowState: AuthenticatingState;

packages/react/src/components/form/authenticating/index.tsx

@@ -22,7 +22,7 @@ import { Children, useEffect, useRef, useState } from "react";
 import { TOTPState } from "./totp";
 import { Delayed } from "@slashid/react-primitives";
 import { useInternalFormContext } from "../internal-context";
-import { AuthenticatingState } from "../flow";
+import { AuthenticatingState } from "../flow/flow.common";
 import { TIME_MS } from "../types";
 import { Loader } from "./icons";
 import {