48 add yearly monthly sub switch (#4577)

packages/twenty-front/src/modules/billing/graphql/updateBillingSubscription.ts

@@ -0,0 +1,9 @@
+import { gql } from '@apollo/client';
+
+export const UPDATE_BILLING_SUBSCRIPTION = gql`
+  mutation UpdateBillingSubscription {
+    updateBillingSubscription {
+      success
+    }
+  }
+`;

packages/twenty-front/src/modules/ui/display/icon/index.ts

@@ -37,6 +37,7 @@ export {
   IconChevronUp,
   IconCircleDot,
   IconCircleOff,
+  IconCircleX,
   IconClick,
   IconCode,
   IconCoins,

packages/twenty-front/src/modules/ui/layout/modal/components/ConfirmationModal.tsx

@@ -7,7 +7,7 @@ import {
   H1Title,
   H1TitleFontColor,
 } from '@/ui/display/typography/components/H1Title';
-import { Button } from '@/ui/input/button/components/Button';
+import { Button, ButtonAccent } from '@/ui/input/button/components/Button';
 import { TextInput } from '@/ui/input/components/TextInput';
 import { Modal } from '@/ui/layout/modal/components/Modal';
 import {
@@ -25,6 +25,7 @@ export type ConfirmationModalProps = {
   deleteButtonText?: string;
   confirmationPlaceholder?: string;
   confirmationValue?: string;
+  confirmButtonAccent?: ButtonAccent;
 };
 
 const StyledConfirmationModal = styled(Modal)`
@@ -66,6 +67,7 @@ export const ConfirmationModal = ({
   deleteButtonText = 'Delete',
   confirmationValue,
   confirmationPlaceholder,
+  confirmButtonAccent = 'danger',
 }: ConfirmationModalProps) => {
   const [inputConfirmationValue, setInputConfirmationValue] =
     useState<string>('');
@@ -127,7 +129,7 @@ export const ConfirmationModal = ({
               setIsOpen(false);
             }}
             variant="secondary"
-            accent="danger"
+            accent={confirmButtonAccent}
             title={deleteButtonText}
             disabled={!isValidValue}
             fullWidth

packages/twenty-front/src/modules/users/graphql/queries/getCurrentUser.ts

@@ -37,6 +37,7 @@ export const GET_CURRENT_USER = gql`
         }
         currentBillingSubscription {
           status
+          interval
         }
       }
       workspaces {