@spacemade/ui 0.0.1

package/src/store/slice/api/authApiSlice.ts

@@ -0,0 +1,220 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { HYDRATE } from '@store/hydrate'
+import { User } from '@store/model'
+import { BASE_API_URL } from '@helpers/api'
+import { keysToCamel } from '@helpers/data-transform'
+
+export enum UserTokenAction {
+	reset_password = 'reset_password',
+	verify_email = 'verify_email',
+	project_invite = 'project_invite',
+	org_invite = 'org_invite',
+}
+
+export type AuthUserResponse = {
+	user: User
+	activeOrgId: string | null
+}
+
+export type VerifyUserResponse = {
+	user: User | null
+	nextStepUrl?: string | null
+	preserveSessionUser?: boolean
+}
+
+export const authApiSlice = createApi({
+	reducerPath: 'api/auth',
+	baseQuery: fetchBaseQuery({
+		baseUrl: BASE_API_URL,
+		credentials: 'include',
+	}),
+	extractRehydrationInfo(action, { reducerPath }) {
+		if (action.type === HYDRATE) {
+			return (action as any).payload[reducerPath]
+		}
+	},
+	tagTypes: ['ResendEmail', 'SignUpSubmitted', 'UpdateSubmitted'],
+	endpoints: (builder) => ({
+		checkSession: builder.query<{ hasSession: boolean }, void>({
+			query: () => `/auth/check`,
+		}),
+
+		signUpSessionData: builder.query<
+			{
+				id: string
+				email: string
+				name: string
+				canResendEmail: boolean
+				canResendEmailAgainInMinutes: number
+			},
+			void
+		>({
+			query: () => `/auth/signup`,
+			providesTags: ['ResendEmail', 'SignUpSubmitted',],
+		}),
+
+		signUp: builder.mutation<
+			void,
+			{
+				firstName: string,
+				lastName: string,
+				email: string,
+				password: string,
+				captcha: string | null
+			}
+		>({
+			query: ({ firstName, lastName, email, password, captcha }) => ({
+				url: `/auth/signup`,
+				method: 'POST',
+				body: {
+					first_name: firstName,
+					last_name: lastName,
+					email,
+					password,
+					captcha,
+				},
+			}),
+			invalidatesTags: ['SignUpSubmitted'],
+		}),
+
+		update: builder.mutation<
+			void,
+			{
+				token: string
+				firstName: string
+				lastName: string
+				password: string
+				captcha: string | null
+				orgId?: string
+			}
+		>({
+			query: ({ token, firstName, lastName, password, captcha, orgId }) => ({
+				url: `/auth/update`,
+				method: 'POST',
+				body: {
+					token,
+					first_name: firstName,
+					last_name: lastName,
+					password,
+					captcha,
+					org_id: orgId,
+				},
+			}),
+			invalidatesTags: ['UpdateSubmitted'],
+		}),
+		verifyUser: builder.mutation<VerifyUserResponse, string>({
+			query: (token) => ({
+				url: `/auth/signup/verify`,
+				method: 'POST',
+				body: {
+					token,
+				},
+			}),
+			transformResponse: ({
+				user,
+				nextStepUrl,
+				preserveSessionUser,
+			}: {
+				user: User | null
+				nextStepUrl?: string | null
+				preserveSessionUser?: boolean
+			}) => ({
+				user: user ? keysToCamel(user) : null,
+				nextStepUrl: nextStepUrl ?? null,
+				preserveSessionUser: !!preserveSessionUser,
+			}),
+		}),
+
+		resendVerifyEmail: builder.mutation<void, { captcha: string | null }>({
+			query: ({ captcha }) => ({
+				url: `/auth/signup/resend-verify`,
+				method: 'POST',
+				body: { captcha },
+			}),
+			invalidatesTags: ['ResendEmail'],
+		}),
+
+		singIn: builder.mutation<
+			AuthUserResponse,
+			{ email: string; password: string; captcha: string | null }
+		>({
+			query: (credentials) => ({
+				url: `/auth/signin`,
+				method: 'POST',
+				body: credentials,
+			}),
+			transformResponse: (res) => keysToCamel(res) as AuthUserResponse,
+		}),
+
+		signOut: builder.mutation<{ message: string }, void>({
+			query: () => ({
+				url: `/auth/signout`,
+				method: 'POST',
+			}),
+			transformResponse: ({ message }: { message: string }) =>
+				keysToCamel(message),
+		}),
+
+		verifyToken: builder.query<
+			{ isValid: boolean },
+			{ token: string; action: UserTokenAction; orgId?: string }
+		>({
+			query: (params) => ({
+				url: `/auth/verify-token`,
+				params,
+			}),
+		}),
+
+		forgotPassword: builder.mutation<
+			{ message: string },
+			{ email: string; captcha: string | null }
+		>({
+			query: (payload) => ({
+				url: `/auth/forgot`,
+				method: 'POST',
+				body: payload,
+			}),
+		}),
+
+		resetPassword: builder.mutation<
+			{ message: string },
+			{ token: string; password: string; captcha: string | null }
+		>({
+			query: (payload) => ({
+				url: `/auth/reset`,
+				method: 'POST',
+				body: payload,
+			}),
+		}),
+
+		changePassword: builder.mutation<
+			{ message: string },
+			{ currentPassword: string; newPassword: string; }
+		>({
+			query: ({ currentPassword, newPassword }) => ({
+				url: `/auth/change-password`,
+				method: 'POST',
+				body: {
+					current_password: currentPassword,
+					new_password: newPassword,
+				},
+			}),
+		}),
+	}),
+})
+
+export const {
+	useLazyCheckSessionQuery,
+	useVerifyTokenQuery,
+	useSignUpSessionDataQuery,
+	useSignUpMutation,
+	useUpdateMutation,
+	useVerifyUserMutation,
+	useResendVerifyEmailMutation,
+	useSingInMutation,
+	useForgotPasswordMutation,
+	useResetPasswordMutation,
+	useChangePasswordMutation,
+	useSignOutMutation,
+	util: { getRunningQueriesThunk },
+} = authApiSlice

package/src/store/slice/api/base-domain-api.ts

@@ -0,0 +1,19 @@
+export const baseDomainApi = {
+  activity: '/api/activity',
+  addresses: '/api/addresses',
+  forms: '/api/forms',
+  invoices: '/api/invoices',
+  media: '/api/media',
+  orgs: '/api/orgs',
+  posts: '/api/posts',
+  products: '/api/products',
+  projects: '/api/projects',
+  providers: '/api/providers',
+  purchases: '/api/purchases',
+  sites: '/api/sites',
+  subscriptions: '/api/subscriptions',
+  tags: '/api/tags',
+  tickets: '/api/tickets',
+  usage: '/api/usage',
+  users: '/api/users',
+} as const

package/src/store/slice/api/billingUnitTypesApiSlice.ts

@@ -0,0 +1,45 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { HYDRATE } from '@store/hydrate'
+import { BASE_API_URL } from '@helpers/api'
+import { keysToCamel } from '@helpers/data-transform'
+import type { ProductPlanBillingUnitType } from '@store/model'
+
+type GetParams = {
+  q?: string
+  isActive?: boolean
+}
+
+export const billingUnitTypesApiSlice = createApi({
+  reducerPath: 'api/products/billing-units',
+  baseQuery: fetchBaseQuery({
+    baseUrl: BASE_API_URL,
+    credentials: 'include',
+  }),
+  extractRehydrationInfo(action, { reducerPath }) {
+    if (action.type === HYDRATE) {
+      return (action as any).payload[reducerPath]
+    }
+  },
+  tagTypes: ['ProductPlanBillingUnitType'],
+  endpoints: (builder) => ({
+    getBillingUnitTypes: builder.query<ProductPlanBillingUnitType[], GetParams | void>({
+      query: (params = {}) => {
+        const cleanedParams = Object.fromEntries(
+          Object.entries(params as Record<string, any>).filter(
+            ([, value]) => value !== undefined && value !== null && value !== ''
+          )
+        )
+
+        return {
+          url: '/products/billing-units',
+          params: cleanedParams,
+        }
+      },
+      transformResponse: (res: any) => keysToCamel(res?.billingUnitTypes ?? []),
+      providesTags: ['ProductPlanBillingUnitType'],
+    }),
+  }),
+})
+
+export const { useGetBillingUnitTypesQuery } = billingUnitTypesApiSlice
+export const { getBillingUnitTypes } = billingUnitTypesApiSlice.endpoints

package/src/store/slice/api/bootstrapIconApiSlice.ts

@@ -0,0 +1,36 @@
+// @store/slice/api/bootstrapIconApiSlice.ts
+import { createApi, fakeBaseQuery } from '@reduxjs/toolkit/query/react'
+import { BOOTSTRAP_ICONS, BootstrapIcon } from '@data/bootstrapIcons'
+
+export const bootstrapIconApiSlice = createApi({
+  reducerPath: 'api/bootstrapIcons',
+  baseQuery: fakeBaseQuery(),
+  endpoints: (builder) => ({
+    getIcons: builder.query<BootstrapIcon[], { query?: string; limit?: number }>({
+      queryFn: ({ query, limit }) => {
+        const q = (query ?? '').trim().toLowerCase()
+
+        let icons = BOOTSTRAP_ICONS.filter((icon) => {
+          if (!q) return true
+          const haystack = [
+            icon.id,
+            icon.label,
+            ...(icon.tags || []),
+          ]
+            .join(' ')
+            .toLowerCase()
+
+          return haystack.includes(q)
+        })
+
+        if (limit && limit > 0) {
+          icons = icons.slice(0, limit)
+        }
+
+        return { data: icons }
+      },
+    }),
+  }),
+})
+
+export const { useGetIconsQuery } = bootstrapIconApiSlice

package/src/store/slice/api/categoriesApiSlice.ts

@@ -0,0 +1,101 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { HYDRATE } from '@store/hydrate'
+import { Category, CategoryOption, CategoryPayload } from '@store/model'
+import { BASE_API_URL } from '@helpers/api'
+import { keysToCamel } from '@helpers/data-transform'
+
+export const categoriesApiSlice = createApi({
+	reducerPath: 'api/categories',
+	baseQuery: fetchBaseQuery({
+		baseUrl: BASE_API_URL,
+		credentials: 'include',
+	}),
+	extractRehydrationInfo(action, { reducerPath }) {
+		if (action.type === HYDRATE) {
+			return (action as any).payload[reducerPath]
+		}
+	},
+	tagTypes: ['Categories'],
+	endpoints: (builder) => ({
+		getPostCategories: builder.query<
+			CategoryOption[],
+			{
+				mode?: 'options'
+				nameLike?: string
+				excludeCategoriesWithoutLiveEntities?: boolean
+				entity?: 'post' | 'product'
+			} | void
+		>({
+			query: (options) => ({
+				url: `/categories/post`,
+				params: {
+					nameLike: options?.nameLike,
+					mode: options?.mode,
+					excludeCategoriesWithoutLiveEntities:
+						options?.excludeCategoriesWithoutLiveEntities,
+					entity: options?.entity,
+				},
+			}),
+			providesTags: ['Categories'],
+			transformResponse: ({ categories }: { categories: CategoryOption[] }) =>
+				keysToCamel(categories),
+		}),
+
+		getOnePostCategory: builder.query<Category, { slug: string }>({
+			query: ({ slug }) => `/categories/post/${slug}`,
+			transformResponse: ({ category }: { category: Category }) =>
+				keysToCamel(category),
+		}),
+
+		createCategory: builder.mutation<Category, { payload: CategoryPayload }>({
+			query: ({ payload }) => ({
+				url: `/posts/categories`,
+				method: 'POST',
+				body: payload,
+			}),
+			invalidatesTags: ['Categories'],
+			transformResponse: ({ category }: { category: Category }) =>
+				keysToCamel(category),
+		}),
+
+		updateCategory: builder.mutation<Category, { payload: CategoryPayload }>({
+			query: ({ payload: { id, ...patch } }) => ({
+				url: `/posts/categories/${id}`,
+				method: 'PATCH',
+				body: patch,
+			}),
+			invalidatesTags: ['Categories'],
+			transformResponse: ({ category }: { category: Category }) =>
+				keysToCamel(category),
+		}),
+
+		deleteCategory: builder.mutation<void, { category: Category }>({
+			query: ({ category }) => ({
+				url: `/posts/categories/${category.id}`,
+				method: 'DELETE',
+			}),
+			invalidatesTags: ['Categories'],
+		}),
+
+		checkCategorySlugOrNameAvailability: builder.query<
+			{ value: string; isAvailable: boolean },
+			{ value: string; key: 'name' | 'slug' }
+		>({
+			query: (params) => ({
+				url: '/search/availability/category',
+				params,
+			}),
+			transformResponse: (res) => keysToCamel(res),
+		}),
+	}),
+})
+
+export const {
+	useGetPostCategoriesQuery,
+	useGetOnePostCategoryQuery,
+	useCreateCategoryMutation,
+	useUpdateCategoryMutation,
+	useDeleteCategoryMutation,
+	useLazyCheckCategorySlugOrNameAvailabilityQuery,
+	util: { getRunningQueriesThunk },
+} = categoriesApiSlice

package/src/store/slice/api/fontawesomeApiSlice.ts

@@ -0,0 +1,43 @@
+import { createApi } from '@reduxjs/toolkit/query/react';
+import { gql } from 'graphql-request'
+import { graphqlRequestBaseQuery } from '@rtk-query/graphql-request-base-query';
+
+const FONTAWESOME_VERSION_FOR_WIDGET = '6.4.2'
+
+export interface GetIconsResponse {
+	search: {
+		id: string
+	}[]
+}
+
+export const fontawesomeApiSlice = createApi({
+  reducerPath: 'api/fontawesome',
+  baseQuery: graphqlRequestBaseQuery({
+    url: 'https://api.fontawesome.com',
+  }),
+  endpoints: (builder) => ({
+		getIcons: builder.query<
+			GetIconsResponse['search'],
+			{ query?: string; limit?: number }
+		>({
+			query: ({ query, limit: first = 15 }) => ({
+        document: gql`
+          query GetIcons($version: String = "${FONTAWESOME_VERSION_FOR_WIDGET}", $query: String = "", $first: Int = ${first || 15}) {
+            search(version: $version, query: $query, first: $first) {
+              id
+            }
+          }
+        `,
+				variables: {
+					query,
+					first,
+				},
+			}),
+      transformResponse: (response: GetIconsResponse) => response.search,
+		}),
+	})
+});
+
+export const {
+	useGetIconsQuery,
+} = fontawesomeApiSlice

package/src/store/slice/api/invoiceApiSlice.ts

@@ -0,0 +1,37 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { HYDRATE } from '@store/hydrate'
+import { Invoice } from '@store/model'
+import { BASE_API_URL } from '@helpers/api'
+import { keysToCamel } from '@helpers/data-transform'
+import { ApiPagingResponse } from '@helpers/types'
+
+type GetParams = {
+	limit?: number
+	page?: number
+}
+
+export const invoiceApiSlice = createApi({
+	reducerPath: 'api/invoice',
+	baseQuery: fetchBaseQuery({
+		baseUrl: BASE_API_URL,
+		credentials: 'include',
+	}),
+	extractRehydrationInfo(action, { reducerPath }) {
+		if (action.type === HYDRATE) {
+			return action.payload[reducerPath]
+		}
+	},
+	endpoints: (builder) => ({
+		getInvoices: builder.query<ApiPagingResponse<Invoice>, GetParams>({
+			query: (params) => ({
+				url: `/invoices`,
+				params,
+			}),
+			transformResponse: (res) => keysToCamel(res),
+		}),
+	}),
+})
+
+export const {
+	useGetInvoicesQuery,
+} = invoiceApiSlice

package/src/store/slice/api/leadApiSlice.ts

@@ -0,0 +1,48 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+import { HYDRATE } from '@store/hydrate'
+import { BASE_API_URL } from '@helpers/api'
+
+type ContactFormPayload = {
+	firstName: string
+	lastName: string
+	email: string
+	country: string
+	company: string
+	questions: string
+	captcha: string | null
+}
+
+export const leadApiSlice = createApi({
+	reducerPath: 'api/lead',
+	baseQuery: fetchBaseQuery({
+		baseUrl: BASE_API_URL,
+		credentials: 'include',
+	}),
+	extractRehydrationInfo(action, { reducerPath }) {
+		if (action.type === HYDRATE) {
+			return (action as any).payload[reducerPath]
+		}
+	},
+	endpoints: (builder) => ({
+		submitContactForm: builder.mutation<
+			{ message: string },
+			{ payload: ContactFormPayload }
+		>({
+			query: ({ payload }) => ({
+				url: '/lead/contact',
+				method: 'POST',
+				body: {
+					first_name: payload.firstName,
+					last_name: payload.lastName,
+					email: payload.email,
+					country: payload.country,
+					company: payload.company,
+					questions: payload.questions,
+					captcha: payload.captcha,
+				},
+			}),
+		}),
+	}),
+})
+
+export const { useSubmitContactFormMutation } = leadApiSlice