Repository: apache/airflow
File: airflow-core/src/airflow/ui/src/pages/Variables/Variables.tsx (TypeScript)

Code before:
          colorPalette="brand"
          onCheckedChange={(event) => onRowSelect(row.original.key, Boolean(event.checked))}
        />
      ),
      enableHiding: false,
      enableSorting: false,
      header: () => (
        <Checkbox
          borderWidth={1}
          checked={allRowsSelected}
          colorPalette="brand"
          onCheckedChange={(event) => onSelectAll(Boolean(event.checked))}
        />
      ),
      meta: {
        skeletonWidth: 10,
      },
    },
    {
      accessorKey: "key",
      cell: ({ row }) => <TrimText isClickable onClickContent={row.original} text={row.original.key}/>,
      header: translate("columns.key"),
    },
    {
      accessorKey: "value",
      cell: ({ row }) => <TrimText showTooltip text={row.original.value} charLimit={open? row.original.value.length : undefined}/>,
      header: translate("columns.value"),
    },
    {
      accessorKey: "description",
      cell: ({ row }) => <TrimText showTooltip text={row.original.description}/>,
      header: translate("columns.description"),
    },
    {
      accessorKey: "is_encrypted",
      header: translate("variables.columns.isEncrypted"),
    },
    ...(multiTeam
      ? [
          {
            accessorKey: "team_name",
            header: translate("columns.team"),
          },
        ]
      : []),
    {
      accessorKey: "actions",
      cell: ({ row: { original } }) => (
        <Flex justifyContent="end">
          <EditVariableButton disabled={selectedRows.size > 0} variable={original} />
          <DeleteVariableButton deleteKey={original.key} disabled={selectedRows.size > 0} />

Review comment (suggestion):
Can you do the same for the 'description', see how it stays collapsed.

<img width="1014" height="708" alt="Image" src="https://github.com/user-attachments/assets/8c5b3c24-f8c1-46ba-9597-a2ecf452ca66" />

Code after:
          colorPalette="brand"
          onCheckedChange={(event) => onRowSelect(row.original.key, Boolean(event.checked))}
        />
      ),
      enableHiding: false,
      enableSorting: false,
      header: () => (
        <Checkbox
          borderWidth={1}
          checked={allRowsSelected}
          colorPalette="brand"
          onCheckedChange={(event) => onSelectAll(Boolean(event.checked))}
        />
      ),
      meta: {
        skeletonWidth: 10,
      },
    },
    {
      accessorKey: "key",
      cell: ({ row }) => <TrimText isClickable onClickContent={row.original} text={row.original.key} />,
      header: translate("columns.key"),
    },
    {
      accessorKey: "value",
      cell: ({ row }) => (
        <TrimText
          charLimit={open ? row.original.value.length : undefined}
          showTooltip
          text={row.original.value}
        />
      ),
      header: translate("columns.value"),
    },
    {
      accessorKey: "description",
      cell: ({ row }) => (
        <TrimText
          charLimit={open ? row.original.description?.length : undefined}
          showTooltip
          text={row.original.description}
        />
      ),
      header: translate("columns.description"),
    },
    {
      accessorKey: "is_encrypted",
      header: translate("variables.columns.isEncrypted"),
    },
    ...(multiTeam
      ? [