chore: format all files in monorepo (#3054)

* chore: format all files in the project

* fix: removing @types/react from dependencies

* fix: adding prettier and eslint config

* chore: format files

* fix: upgrading turbo version

* chore: ignoring warnings and adding todos

* fix: updated the type of bubble menu item in the document editor

* chore: format files

---------

Co-authored-by: Aaryan Khandelwal <aaryankhandu123@gmail.com>

packages/ui/src/button/button.tsx

@@ -1,14 +1,8 @@
 import * as React from "react";
 
-import {
-  getIconStyling,
-  getButtonStyling,
-  TButtonVariant,
-  TButtonSizes,
-} from "./helper";
+import { getIconStyling, getButtonStyling, TButtonVariant, TButtonSizes } from "./helper";
 
-export interface ButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
   variant?: TButtonVariant;
   size?: TButtonSizes;
   className?: string;
@@ -19,47 +13,31 @@ export interface ButtonProps
   children: React.ReactNode;
 }
 
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
-  (props, ref) => {
-    const {
-      variant = "primary",
-      size = "md",
-      className = "",
-      type = "button",
-      loading = false,
-      disabled = false,
-      prependIcon = null,
-      appendIcon = null,
-      children,
-      ...rest
-    } = props;
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>((props, ref) => {
+  const {
+    variant = "primary",
+    size = "md",
+    className = "",
+    type = "button",
+    loading = false,
+    disabled = false,
+    prependIcon = null,
+    appendIcon = null,
+    children,
+    ...rest
+  } = props;
 
-    const buttonStyle = getButtonStyling(variant, size, disabled || loading);
-    const buttonIconStyle = getIconStyling(size);
+  const buttonStyle = getButtonStyling(variant, size, disabled || loading);
+  const buttonIconStyle = getIconStyling(size);
 
-    return (
-      <button
-        ref={ref}
-        type={type}
-        className={`${buttonStyle} ${className}`}
-        disabled={disabled || loading}
-        {...rest}
-      >
-        {prependIcon && (
-          <div className={buttonIconStyle}>
-            {React.cloneElement(prependIcon, { strokeWidth: 2 })}
-          </div>
-        )}
-        {children}
-        {appendIcon && (
-          <div className={buttonIconStyle}>
-            {React.cloneElement(appendIcon, { strokeWidth: 2 })}
-          </div>
-        )}
-      </button>
-    );
-  },
-);
+  return (
+    <button ref={ref} type={type} className={`${buttonStyle} ${className}`} disabled={disabled || loading} {...rest}>
+      {prependIcon && <div className={buttonIconStyle}>{React.cloneElement(prependIcon, { strokeWidth: 2 })}</div>}
+      {children}
+      {appendIcon && <div className={buttonIconStyle}>{React.cloneElement(appendIcon, { strokeWidth: 2 })}</div>}
+    </button>
+  );
+});
 
 Button.displayName = "plane-ui-button";
 

packages/ui/src/button/helper.tsx

@@ -99,17 +99,13 @@ export const buttonStyling: IButtonStyling = {
   },
 };
 
-export const getButtonStyling = (
-  variant: TButtonVariant,
-  size: TButtonSizes,
-  disabled: boolean = false,
-): string => {
+export const getButtonStyling = (variant: TButtonVariant, size: TButtonSizes, disabled: boolean = false): string => {
   let _variant: string = ``;
   const currentVariant = buttonStyling[variant];
 
-  _variant = `${currentVariant.default} ${
-    disabled ? currentVariant.disabled : currentVariant.hover
-  } ${currentVariant.pressed}`;
+  _variant = `${currentVariant.default} ${disabled ? currentVariant.disabled : currentVariant.hover} ${
+    currentVariant.pressed
+  }`;
 
   let _size: string = ``;
   if (size) _size = buttonSizeStyling[size];

packages/ui/src/button/toggle-switch.tsx

@@ -19,7 +19,7 @@ const ToggleSwitch: React.FC<IToggleSwitchProps> = (props) => {
       checked={value}
       disabled={disabled}
       onChange={onChange}
-      className={`relative flex-shrink-0 inline-flex ${
+      className={`relative inline-flex flex-shrink-0 ${
         size === "sm" ? "h-4 w-6" : size === "md" ? "h-5 w-8" : "h-6 w-10"
       } flex-shrink-0 cursor-pointer rounded-full border border-custom-border-200 transition-colors duration-200 ease-in-out focus:outline-none ${
         value ? "bg-custom-primary-100" : "bg-gray-700"
@@ -28,15 +28,11 @@ const ToggleSwitch: React.FC<IToggleSwitchProps> = (props) => {
       <span className="sr-only">{label}</span>
       <span
         aria-hidden="true"
-        className={`self-center inline-block ${
+        className={`inline-block self-center ${
           size === "sm" ? "h-2 w-2" : size === "md" ? "h-3 w-3" : "h-4 w-4"
         } transform rounded-full shadow ring-0 transition duration-200 ease-in-out ${
           value
-            ? (size === "sm"
-                ? "translate-x-3"
-                : size === "md"
-                ? "translate-x-4"
-                : "translate-x-5") + " bg-white"
+            ? (size === "sm" ? "translate-x-3" : size === "md" ? "translate-x-4" : "translate-x-5") + " bg-white"
             : "translate-x-0.5 bg-custom-background-90"
         } ${disabled ? "cursor-not-allowed" : ""}`}
       />