feat(policies): docker cleanup policy [c9s-87] (#2681)

api/docker/images/registry.go

@@ -26,7 +26,12 @@ func NewRegistryClient(dataStore dataservices.DataStore) *RegistryClient {
 func (c *RegistryClient) RegistryAuth(image Image) (string, string, error) {
 	registry, err := cachedRegistry(image.Opts.Name)
 	if err != nil {
-		registries, err := c.dataStore.Registry().ReadAll()
+		var registries []portainer.Registry
+		err = c.dataStore.ViewTx(func(tx dataservices.DataStoreTx) error {
+			var err error
+			registries, err = tx.Registry().ReadAll()
+			return err
+		})
 		if err != nil {
 			return "", "", err
 		}
@@ -59,7 +64,12 @@ func (c *RegistryClient) CertainRegistryAuth(registry *portainer.Registry) (stri
 func (c *RegistryClient) EncodedRegistryAuth(image Image) (string, error) {
 	registry, err := cachedRegistry(image.Opts.Name)
 	if err != nil {
-		registries, err := c.dataStore.Registry().ReadAll()
+		var registries []portainer.Registry
+		err = c.dataStore.ViewTx(func(tx dataservices.DataStoreTx) error {
+			var err error
+			registries, err = tx.Registry().ReadAll()
+			return err
+		})
 		if err != nil {
 			return "", err
 		}

api/portainer.go

@@ -2640,6 +2640,7 @@ const (
 	SetupDocker        PolicyType = "setup-docker"
 	RegistryDocker     PolicyType = "registry-docker"
 	ChangeConfirmation PolicyType = "change-confirmation"
+	CleanupDocker      PolicyType = "cleanup-docker"
 )
 
 type HelmInstallStatus string

app/react/components/StatusSummaryBar/StatusSummaryBar.tsx

@@ -1,3 +1,5 @@
+import clsx from 'clsx';
+
 import { FilterBarButton, Color } from './FilterBarButton';
 import { FilterBarActiveIndicator } from './FilterBarActiveIndicator';
 
@@ -38,7 +40,13 @@ export function StatusSummaryBar<TValue extends string = string>({
 
   return (
     <div
-      className="relative flex items-stretch overflow-x-auto overflow-y-hidden rounded-lg border border-solid border-[var(--border-widget)] bg-[var(--bg-widget-color)]"
+      className={clsx(
+        'relative flex flex-wrap items-stretch',
+        'border border-solid',
+        'border-gray-5 th-highcontrast:border-white th-dark:border-gray-8',
+        'overflow-y-hidden rounded-lg',
+        'bg-white th-highcontrast:bg-transparent th-dark:bg-graphite-800'
+      )}
       data-cy={dataCy}
       role="radiogroup"
       aria-label={ariaLabel}

app/react/components/form-components/InputList/ActionButtons.tsx

@@ -49,7 +49,7 @@ export function InputListActionButtons<T = DefaultType>({
             size="medium"
             disabled={disabled || index === 0}
             onClick={onMoveUp}
-            className="vertical-center btn-only-icon"
+            className="vertical-center btn-only-icon h-[34px]"
             icon={ArrowUpIcon}
             data-cy={`${dataCy}-move-up_${index}`}
           />
@@ -58,7 +58,7 @@ export function InputListActionButtons<T = DefaultType>({
             type="button"
             disabled={disabled || index === count - 1}
             onClick={onMoveDown}
-            className="vertical-center btn-only-icon"
+            className="vertical-center btn-only-icon h-[34px]"
             icon={ArrowDownIcon}
             data-cy={`${dataCy}-move-down_${index}`}
           />
@@ -85,7 +85,7 @@ export function InputListActionButtons<T = DefaultType>({
               color="dangerlight"
               size="medium"
               onClick={onDelete}
-              className="vertical-center btn-only-icon"
+              className="vertical-center btn-only-icon h-[34px]"
               data-cy={`${dataCy}RemoveButton_${index}`}
               icon={Trash2Icon}
               disabled={disabled}
@@ -136,7 +136,7 @@ function CanUndoDeleteButton<T>({
           color="dangerlight"
           size="medium"
           onClick={handleDeleteClick}
-          className="vertical-center btn-only-icon"
+          className="vertical-center btn-only-icon h-[34px]"
           icon={Trash2Icon}
           data-cy={`${dataCy}_delete`}
           disabled={disabled}
@@ -147,7 +147,7 @@ function CanUndoDeleteButton<T>({
           color="default"
           size="medium"
           onClick={handleDeleteClick}
-          className="vertical-center btn-only-icon"
+          className="vertical-center btn-only-icon h-[34px]"
           icon={RotateCwIcon}
           data-cy={`${dataCy}_undo_delete`}
           disabled={disabled}

app/react/components/form-components/InputList/InputList.tsx

@@ -136,7 +136,7 @@ export function InputList<T = DefaultType>({
               typeof errors === 'object' ? errors[index] : undefined;
 
             return (
-              <div key={key} className="flex">
+              <div key={key} className="flex gap-1">
                 {Item ? (
                   <Item
                     item={item}

app/react/portainer/environments/environment-groups/ListView/ListView.tsx

@@ -1,14 +1,9 @@
-import { useRouter } from '@uirouter/react';
-import { Plus } from 'lucide-react';
-
-import { Button } from '@@/buttons';
 import { PageHeader } from '@@/PageHeader';
+import { AddButton } from '@@/buttons';
 
 import { EnvironmentGroupsTable } from './EnvironmentGroupsTable/EnvironmentGroupsTable';
 
 export function ListView() {
-  const router = useRouter();
-
   return (
     <>
       <PageHeader
@@ -16,15 +11,9 @@ export function ListView() {
         breadcrumbs="Environment group management"
         reload
       >
-        <Button
-          onClick={() => router.stateService.go('portainer.groups.new')}
-          icon={Plus}
-          color="primary"
-          size="small"
-          data-cy="add-environment-group-button"
-        >
-          Add Group
-        </Button>
+        <AddButton to=".new" data-cy="add-environment-group-button">
+          Add group
+        </AddButton>
       </PageHeader>
 
       <div className="mx-5">