feat(ui): added new react-query hooks for settings page

frontend/src/hooks/api/subscriptions/index.tsx

@@ -0,0 +1 @@
+export { useGetOrgSubscription } from './queries';

frontend/src/hooks/api/subscriptions/queries.tsx

@@ -0,0 +1,30 @@
+import { useQuery } from '@tanstack/react-query';
+
+import { apiRequest } from '@app/config/request';
+
+import { GetSubscriptionPlan } from './types';
+
+// import { Workspace } from './types';
+
+const subscriptionKeys = {
+  getOrgSubsription: (orgID: string) => ['subscription', { orgID }] as const
+};
+
+const fetchOrgSubscription = async (orgID: string) => {
+  const { data } = await apiRequest.get<{ subscriptions: GetSubscriptionPlan }>(
+    `/api/v1/organization/${orgID}/subscriptions`
+  );
+
+  return data.subscriptions;
+};
+
+type UseGetOrgSubscriptionProps = {
+  orgID: string;
+};
+
+export const useGetOrgSubscription = ({ orgID }: UseGetOrgSubscriptionProps) =>
+  useQuery({
+    queryKey: subscriptionKeys.getOrgSubsription(orgID),
+    queryFn: () => fetchOrgSubscription(orgID),
+    enabled: Boolean(orgID)
+  });

frontend/src/hooks/api/subscriptions/types.ts

@@ -0,0 +1,25 @@
+export type GetSubscriptionPlan = {
+  data: { plan: SubscriptionPlan }[];
+};
+
+export type SubscriptionPlan = {
+  id: string;
+  object: string;
+  active: boolean;
+  aggregate_usage: unknown;
+  amount: 1400;
+  amount_decimal: 1400;
+  billing_scheme: string;
+  created: 1674833546;
+  currency: string;
+  interval: string;
+  interval_count: 1;
+  livemode: false;
+  metadata: {};
+  nickname: null;
+  product: string;
+  tiers_mode: unknown;
+  transform_usage: unknown;
+  trial_period_days: unknown;
+  usage_type: string;
+};