@clicktap/state 0.1.0 → 0.1.2

package/src/auth/auth.ts

@@ -1,408 +0,0 @@
-import { createMachine } from 'xstate';
-import { assign } from '@xstate/immer';
-import type { DoneInvokeEvent } from 'xstate';
-
-export interface AuthMachineContext {
-  user: {
-    email: string;
-    username: string;
-    firstName: string;
-    lastName: string;
-    birthdate?: Date;
-    gender?: string /** @todo use enum? */;
-    createdAt: Date;
-    updatedAt: Date;
-    role?: string /** @todo use enum? */;
-    locked: boolean;
-    affiliateId: string;
-    stripeId: string;
-  } | null;
-  accessToken: string;
-  refreshToken: string;
-  ignoreRefreshToken: boolean;
-  endpoints: {
-    login: string;
-    logout: string;
-    refresh: string;
-    ssrRefresh: string;
-  };
-}
-
-export interface RefreshTokenEvent {
-  type: 'REFRESH_TOKEN';
-  accessToken: AuthMachineContext['accessToken'];
-}
-
-export interface LoginEvent {
-  type: 'LOGIN';
-  username: string;
-  password: string;
-  // grant_type: 'password';
-  // client_id: string;
-  // client_secret: string;
-  // scope: 'default';
-}
-
-export interface LogoutEvent {
-  type: 'LOGOUT';
-}
-
-export interface AuthenticateSuccessEvent {
-  type: 'AUTHENTICATE_SUCCESS';
-  user: AuthMachineContext['user'];
-  accessToken: AuthMachineContext['accessToken'];
-}
-
-export interface RefreshTokenSuccessEvent {
-  type: 'REFRESH_TOKEN_SUCCESS';
-  accessToken: AuthMachineContext['accessToken'];
-}
-
-// type AuthEvents = RefreshTokenEvent | AnotherEvent;
-export type AuthMachineEvents =
-  | RefreshTokenEvent
-  | LoginEvent
-  | LogoutEvent
-  | DoneInvokeEvent<AuthenticateSuccessEvent>
-  | DoneInvokeEvent<RefreshTokenSuccessEvent>;
-
-type RefreshTokenResponse = {
-  accessToken?: string;
-};
-type AuthenticateResponse = {
-  accessToken?: string;
-  message?: string;
-  success: boolean;
-  user?: AuthenticateSuccessEvent['user'];
-};
-async function request<T>(url: string, options: object): Promise<T> {
-  const response = await fetch(url, options);
-  if (response.status === 200) {
-    return response.json() as Promise<T>;
-  }
-
-  return Promise.resolve({
-    message: response.statusText,
-    success: false,
-  }) as Promise<T>;
-}
-
-export const authMachine =
-  /** @xstate-layout N4IgpgJg5mDOIC5QEMCuAXAFgOjVsAdugJYDGyJBUAxBAPYFjbEEBudA1k3jj4SeUpQELdoOIMA2gAYAujNmJQABzqxiJBkpAAPRAEZ9Adn3YAbABYATAGYr1gKwWLDoxYA0IAJ6JbATmwADkCXPyszK0CzPyijAF84zx5cDEx+MgoWGjAAJxy6HOxlABsKADMCgFsUrBq0ogyhETY6cSk5BW1VdU0CbT0EfWkncysHYelba0DXTx8EBzNTCxDXPzMbaTCjQISk1OxUAj4G8SpaBiZRTm4Do5OBTKpmsUz2+TkutQ0JPqRdRAAWkMAUiNkCxjMO02+gsNjmvkCVmw+hsRnRjiM0hMexAyXuqXSZ2yeQKRVK6AqOWq+OOhNOT2E1zaBAUnX+3R+Wn+A2R0RsmwhRjMUKsRgcSIRCCR2Fs6MCYSmDn0wVxyRyYDKGtgmCyF0YzBaXDq2A1WrguuezLerI6nw5316-UQRhi2BiQ2kk2VkylUSCfnB9iWwSxYrVBzN2stJPyhRK5SqJqjFqyL1aNrZ9pUjt+zoQFn0Zmw0gs6Ks0n0gZMMSlwOx2ELTj80jMTisYvCEdqxToUBgEAA8hhqAAZQcAcQAkgA5dk5np5nm+KElsyBcWWQzhMZSizSQLYVzbhyB8F+Pz6bs4Xv9yBTghjyeDgCqABV5yBOU7l9KjDYghmQJhgVPwHArKw6yrYswKWf8HE2cYJWvbBbwHB9qB0WB0AobgynQXIAAozC9L0AEpqGSND71tRQHUXblQAGKJkVdZwqwlMIokCKCjGwYUYThf8SLRCwEkSEACDoCA4G0HgvgYv4mKBIs+LBIUoUCQT4W8IFIgsRtFmMMskMvKwUIeRosgUrklIBQZKwA1soWccJXU2PwpVEktjBmdcIhiZwUIJfAGSEGyf2UhBAQM0N1gPJYoVbHYoJCHyTCiLYYnXcMJPVTVo2s+jbPzawAkMSZwmxBUJX0KUxUPOV3LYy8tjEvKDmoocMAipcopsAJTzRNY0VhWEpVcaQSy0sVxjGFs0RQrqH16xj7MMOFGxWRYBXBRYeN0hA3XsINnBCfcLyvcSgA */
-  createMachine<AuthMachineContext, AuthMachineEvents>(
-    {
-      context: {
-        // id: '',
-        user: null,
-        accessToken: '',
-        refreshToken: '', // will only be on the request from the server side for initial check, does not get passed to the client
-        /**
-         * If unauthenticating fails, we need a way to ignore the refresh token on subsequent access token refresh.
-         * This would be set to true done/error of unauthenticate service, and false on done of authenticate service
-         */
-        ignoreRefreshToken: false,
-        endpoints: {
-          login: '',
-          logout: '',
-          refresh: '',
-          ssrRefresh: '',
-        },
-      },
-      predictableActionArguments: true,
-      id: 'auth',
-      initial: 'refreshing',
-      states: {
-        authenticating: {
-          invoke: {
-            src: 'authenticate',
-            onDone: [
-              {
-                actions: 'setUserContext',
-                target: 'loggedIn',
-              },
-            ],
-            onError: [
-              {
-                target: 'loggedOut',
-              },
-            ],
-          },
-        },
-        unauthenticating: {
-          invoke: {
-            src: 'unauthenticate',
-            onDone: [
-              {
-                actions: 'unsetUserContext',
-                target: 'loggedOut',
-              },
-            ],
-            onError: [
-              {
-                actions: ['unsetUserContext', 'setIgnoreRefreshToken'],
-                target: 'loggedOut',
-              },
-            ],
-          },
-        },
-        refreshing: {
-          invoke: {
-            src: 'refreshAccessToken',
-            onDone: [
-              {
-                actions: ['unsetRefreshToken', 'setAccessToken'],
-                target: 'loggedIn',
-              },
-            ],
-            onError: [
-              {
-                actions: 'unsetRefreshToken',
-                target: 'unauthenticating',
-              },
-            ],
-          },
-        },
-        loggedOut: {
-          on: {
-            LOGIN: {
-              target: 'authenticating',
-            },
-          },
-        },
-        loggedIn: {
-          after: {
-            '60000': {
-              cond: () => typeof window !== 'undefined',
-              target: 'refreshing',
-            },
-          },
-          // entry: ['unsetUserContext'],
-          on: {
-            LOGOUT: {
-              target: 'unauthenticating',
-            },
-          },
-        },
-      },
-    },
-    {
-      actions: {
-        // setAccessToken: assign<UserContext, RefreshTokenEvent>((context, event) => {
-        //   context.accessToken = event.accessToken;
-        // }),
-        setUserContext: assign(
-          (
-            context: AuthMachineContext,
-            event: DoneInvokeEvent<AuthenticateSuccessEvent>
-          ) => {
-            // event.type - done.invoke.auth.authenticating:invocation[0]
-            if (event.data.type !== 'AUTHENTICATE_SUCCESS') return;
-
-            // context.user = event.data.user;
-            context.accessToken = event.data.accessToken;
-            context.ignoreRefreshToken = false;
-          }
-        ),
-        unsetUserContext: assign((context) => {
-          Object.assign(context, authMachine.initialState.context);
-          // context = authMachine.initialState.context;
-        }),
-        setAccessToken: assign(
-          (
-            context: AuthMachineContext,
-            event: DoneInvokeEvent<RefreshTokenSuccessEvent>
-          ) => {
-            if (event.data.type !== 'REFRESH_TOKEN_SUCCESS') return; // is this really necessary?
-
-            context.accessToken = event.data.accessToken;
-            context.ignoreRefreshToken = false;
-          }
-        ),
-        unsetRefreshToken: assign(
-          (
-            context: AuthMachineContext,
-            event: DoneInvokeEvent<RefreshTokenSuccessEvent>
-          ) => {
-            if (event.data.type !== 'REFRESH_TOKEN_SUCCESS') return; // is this really necessary?
-
-            context.refreshToken = '';
-          }
-        ),
-        setIgnoreRefreshToken: assign((context) => {
-          context.ignoreRefreshToken = true;
-        }),
-      },
-      services: {
-        refreshAccessToken: (context) => async () => {
-          // eslint-disable-next-line no-console
-          // console.log(
-          //   'refresh access token (%s)',
-          //   typeof window === 'undefined' ? 'server' : 'client'
-          // );
-          // eslint-disable-next-line no-console
-          // console.log('--------------------');
-
-          let response: RefreshTokenResponse;
-          if (typeof window === 'undefined') {
-            // server
-            // eslint-disable-next-line no-console
-            // console.log('in server refreshAccessToken');
-            // eslint-disable-next-line no-console
-            // console.log(context.refreshToken);
-            if (context.refreshToken === '') throw new Error('Unauthorized.');
-
-            try {
-              response = await request<RefreshTokenResponse>(
-                'http://nginx:5210/auth/refresh',
-                {
-                  method: 'POST',
-                  mode: 'cors',
-                  credentials: 'include',
-                  headers: {
-                    Cookie: `refresh_token=${context.refreshToken}`,
-                    'Content-Type': 'application/json',
-                  },
-                  body: JSON.stringify({
-                    grant_type: 'refresh_token',
-                    // client_id: 'default',
-                    // client_secret: 'Password123!',
-                    // scope: 'default',
-                  }).toString(),
-                }
-              );
-
-              const data = response;
-
-              if (typeof data.accessToken === 'undefined') {
-                throw new Error('Unauthorized.');
-              }
-
-              return {
-                type: 'REFRESH_TOKEN_SUCCESS',
-                accessToken: data.accessToken,
-              } as RefreshTokenSuccessEvent;
-            } catch (err) {
-              // eslint-disable-next-line no-console
-              // console.log(err);
-              throw new Error('Could not complete refresh request (server)');
-            }
-          } else {
-            // client
-            response = await request<RefreshTokenResponse>(
-              'https://middleware-clicktap.local-rmgmedia.com/auth/refresh',
-              {
-                method: 'POST',
-                mode: 'cors',
-                credentials: 'include',
-                headers: {
-                  'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({
-                  grant_type: 'refresh_token',
-                  // client_id: 'default',
-                  // client_secret: 'Password123!',
-                  // scope: 'default',
-                }).toString(),
-              }
-            );
-
-            const data = response;
-
-            if (typeof data.accessToken === 'undefined') {
-              throw new Error('Unauthorized.');
-            }
-
-            return {
-              type: 'REFRESH_TOKEN_SUCCESS',
-              accessToken: data.accessToken,
-            };
-          }
-        },
-        authenticate: (context, event) => async () => {
-          const e = event as LoginEvent; // workaround to typescript not allowing casting in parameter
-          if (e.type !== 'LOGIN') {
-            throw new Error(
-              `Authenticate can only be called for "LOGIN" event type. Event caller: ${String(
-                e.type
-              )}`
-            );
-          }
-
-          const response = await request<AuthenticateResponse>(
-            'https://middleware-clicktap.local-rmgmedia.com/auth/login',
-            {
-              method: 'POST',
-              mode: 'cors',
-              credentials: 'include',
-              headers: {
-                'Content-Type': 'application/json',
-              },
-              body: JSON.stringify({
-                username: e.username,
-                password: e.password,
-                // grant_type: 'password',
-                // client_id: 'default',
-                // client_secret: 'Password123!',
-                // scope: 'default',
-              }).toString(),
-            }
-          );
-          /** @todo do we need to handle different status codes here...like what if the service is down? */
-          const data = response;
-
-          if (typeof data.accessToken === 'undefined') {
-            throw new Error(
-              data.message?.toString() ?? 'Sign in failed. Please try again.'
-            );
-          }
-
-          return {
-            type: 'AUTHENTICATE_SUCCESS',
-            // user: data.user,
-            accessToken: data.accessToken,
-          } as AuthenticateSuccessEvent;
-          // /** @todo how to call immer assign from inside invoke here to update context? */
-
-          // console.log(data);
-          // console.log(event);
-        },
-        unauthenticate: (context) => async () => {
-          // const response = await fetch(
-          await fetch(
-            'https://middleware-clicktap.local-rmgmedia.com/auth/logout',
-            {
-              method: 'POST',
-              mode: 'cors',
-              credentials: 'include',
-              // headers: {
-              //   'Access-Control-Allow-Origin': 'https://middleware-clicktap.local-rmgmedia.com',
-              //   'Access-Control-Allow-Credentials': 'true',
-              // },
-            }
-          );
-          /** @todo do we need to handle different status codes here...like what if the service is down? */
-          // const data = await response.json();
-
-          return { type: 'UNAUTHENTICATE' };
-
-          // if (!data.success) {
-          //   throw new Error(data.message ?? 'Sign in failed. Please try again.');
-          // }
-
-          // return {
-          //   type: 'AUTHENTICATE_SUCCESS',
-          //   user: data.user,
-          //   accessToken: data.accessToken,
-          // };
-        },
-      },
-      // doesn't make sense in the case where you have an access token that is about to expire
-      // and the loggedIn state won't fire another refresh for 15 min
-      //
-      // guards: {
-      //   checkIfLoggedIn: (context, _event) => {
-      //     if (context.user) return true;
-      //   },
-      // },
-    }
-  );

package/src/toast/ToastProvider.tsx

@@ -1,44 +0,0 @@
-import { createContext, useContext } from 'react';
-import type { InterpreterFrom } from 'xstate';
-import type { ReactNode } from 'react';
-import { toastMachine } from './toast';
-
-export const ToastContext = createContext(
-  {} as InterpreterFrom<typeof toastMachine>
-);
-
-export const useToast = () => {
-  return useContext(ToastContext);
-};
-
-type Props = {
-  children: ReactNode;
-  // options: {
-  //   devTools: boolean;
-  // };
-  // state: StateConfig<ToastMachineContext, ToastMachineEvents>;
-  // setState: Dispatch<
-  //   SetStateAction<StateConfig<ToastMachineContext, ToastMachineEvents>>
-  // >;
-  service: InterpreterFrom<typeof toastMachine>;
-};
-
-export function ToastProvider({
-  children,
-  service,
-}: // options = { devTools: false },
-// state,
-// setState,
-Props) {
-  // const toastService = interpret(toastMachine, {
-  //   devTools: options.devTools,
-  // }).start(state);
-
-  // toastService.subscribe((s) => {
-  //   setState(s);
-  // });
-
-  return (
-    <ToastContext.Provider value={service}>{children}</ToastContext.Provider>
-  );
-}

package/src/toast/timer.ts

@@ -1,109 +0,0 @@
-import { createMachine } from 'xstate';
-import { assign } from '@xstate/immer';
-
-export interface TimerContext {
-  // The elapsed time (in ms)
-  elapsed: number;
-  // The maximum time (in ms)
-  duration: number;
-  // The interval to send TICK events (in ms)
-  interval: number;
-  // The interval timer
-  intervalId: NodeJS.Timer | null;
-}
-
-export type TimerEvents =
-  | {
-      // User intent to start the timer
-      type: 'START_TIMER';
-    }
-  | {
-      // User intent to resume the timer
-      type: 'RESUME_TIMER';
-    }
-  | {
-      // User intent to pause the timer
-      type: 'PAUSE_TIMER';
-    }
-  | {
-      // The TICK event sent by the spawned interval service
-      type: 'TICK';
-    }
-  | {
-      // User intent to update the duration
-      type: 'DURATION.UPDATE';
-      value: number;
-    }
-  | {
-      // User intent to reset the elapsed time to 0
-      type: 'RESET_TIMER';
-    };
-
-export const timerMachine =
-  /** @xstate-layout N4IgpgJg5mDOIC5QBcCWBbMAnAdABwEMBXWSAYgCUBRAZQFUBZKgfQBUBJJigbQAYBdRKDwB7WKjQiAdkJAAPRAFoAjADYATDmUBOXQA5tAZmV69AFgDsq1QBoQAT0SHehnAFYAvh7tpMuLERSUqhSUGQcAMIA0nyCSCCi4pIy8QoIJqo4qnoWbnaOCGZmmaq8Zbyqyi5uym6qXj4Y2DgBQSFhAAoAgnQ0LBxcsbKJEqjSsmlVbjimFmZ6agZmbsbq+U4u7g0gvs2twaFkQ-EjyRNObrxZOXkOiGbKFjjq5WbqFurFvNpmXt4gUhEEDgsl2WGGYlG41SSnUVS0um0BmMpks1nW6Tcmk8-zB+GIpAgEKSYxSoDSvAxn142zx+3axKhZPkiEpdwQhjmW1xTVwAGMROg8AAbMDISCMs4whBsgpuOp-DxAA */
-  createMachine<TimerContext, TimerEvents>({
-    id: 'timer',
-    initial: 'running',
-    context: {
-      elapsed: 0,
-      duration: 3000,
-      interval: 100,
-      intervalId: null,
-    },
-    states: {
-      paused: {
-        on: {
-          // START_TIMER: {
-          //   target: 'running',
-          //   cond: (context) => context.elapsed < context.duration,
-          // },
-          RESUME_TIMER: {
-            target: 'running',
-            cond: (context) => context.elapsed < context.duration,
-          },
-        },
-      },
-      running: {
-        invoke: {
-          src: (context) => (send) => {
-            // eslint-disable-next-line no-console
-            // console.log('context.interval: ', context.interval);
-            const interval = setInterval(() => {
-              send('TICK');
-            }, context.interval);
-            return () => {
-              clearInterval(interval);
-            };
-          },
-        },
-        always: [
-          {
-            target: 'completed',
-            cond: (context) => {
-              return context.elapsed >= context.duration;
-            },
-          },
-        ],
-        on: {
-          TICK: {
-            actions: assign((context, event) => {
-              if (event.type !== 'TICK') return;
-              context.elapsed += context.interval;
-              // eslint-disable-next-line no-console
-              // console.log(
-              //   'elapsed: %d | interval: %d',
-              //   context.elapsed,
-              //   context.interval
-              // );
-            }),
-          },
-          PAUSE_TIMER: { target: 'paused' },
-        },
-      },
-      completed: {
-        type: 'final',
-      },
-    },
-  });
-
-export default timerMachine;

package/src/toast/toast.spec.ts

@@ -1,7 +0,0 @@
-import { toastMachine } from './toast';
-
-describe('state', () => {
-  it('should work', () => {
-    expect(toastMachine).toEqual('toast');
-  });
-});