Repository: supabase/supabase
File: apps/studio/components/interfaces/Storage/AnalyticsBuckets/CreateAnalyticsBucketModal.tsx (TypeScript)

Code before:
        if (!open) handleClose()
      }}
    >
      <DialogTrigger asChild>
        <ButtonTooltip
          block
          size={buttonSize}
          type={buttonType}
          className={buttonClassName}
          icon={<Plus size={14} />}
          disabled={
            !canCreateBuckets ||
            !icebergCatalogEnabled ||
            isLoading ||
            buckets.length >= 2 ||
            disabled
          }
          tabIndex={
            !canCreateBuckets ||
            !icebergCatalogEnabled ||
            isLoading ||
            buckets.length >= 2 ||
            disabled
              ? -1
              : 0
          }
          style={{ justifyContent: 'start' }}
          onClick={() => setVisible(true)}
          tooltip={{
            content: {
              side: tooltip?.content?.side || 'bottom',
              className: cn(!icebergCatalogEnabled ? 'w-72 text-center' : ''),
              text: !icebergCatalogEnabled
                ? 'Analytics buckets are not enabled for your project. Please contact support to enable it.'
                : !canCreateBuckets
                  ? 'You need additional permissions to create buckets'
                  : buckets.length >= 2
                    ? 'Bucket limit reached'
                    : tooltip?.content?.text,
            },
          }}
        >
          New bucket
        </ButtonTooltip>
      </DialogTrigger>

      <DialogContent size="large" aria-describedby={undefined}>
        <DialogHeader>
          <DialogTitle>Create {config.singularName} bucket</DialogTitle>
        </DialogHeader>


Review comment (suggestion):
This just repeats the same checks as the `disabled` prop above. We should combine the two into a variable.

Code after:
      open={visible}
      onOpenChange={(open) => {
        if (!open) handleClose()
      }}
    >
      <DialogTrigger asChild>
        <ButtonTooltip
          block
          size={buttonSize}
          type={buttonType}
          className={buttonClassName}
          icon={<Plus size={14} />}
          disabled={isDisabled}
          tabIndex={isDisabled ? -1 : 0}
          style={{ justifyContent: 'start' }}
          onClick={() => setVisible(true)}
          tooltip={{
            content: {
              side: tooltip?.content?.side || 'bottom',
              className: cn(!icebergCatalogEnabled ? 'w-72 text-center' : ''),
              text: !icebergCatalogEnabled
                ? 'Analytics buckets are not enabled for your project. Please contact support to enable it.'
                : !canCreateBuckets
                  ? 'You need additional permissions to create buckets'
                  : buckets.length >= 2
                    ? 'Bucket limit reached'
                    : tooltip?.content?.text,
            },
          }}
        >
          New bucket
        </ButtonTooltip>
      </DialogTrigger>

      <DialogContent size="large" aria-describedby={undefined}>
        <DialogHeader>
          <DialogTitle>Create {config.singularName} bucket</DialogTitle>
        </DialogHeader>

        <DialogSectionSeparator />

        <Form_Shadcn_ {...form}>
          <form id={formId} onSubmit={form.handleSubmit(onSubmit)}>
            <DialogSection className="flex flex-col gap-y-4">
              <FormField_Shadcn_
                key="name"
                name="name"
                control={form.control}
                render={({ field }) => (
                  <FormItemLayout
                    name="name"