refactor(docker/containers): migrate commands tab to react [EE-5208] (#10085)

app/react/docker/proxy/queries/useInfo.ts

@@ -0,0 +1,43 @@
+import { useQuery } from 'react-query';
+import { SystemInfo } from 'docker-types/generated/1.41';
+
+import axios, { parseAxiosError } from '@/portainer/services/axios';
+import { EnvironmentId } from '@/react/portainer/environments/types';
+
+import { buildUrl } from './build-url';
+
+export async function getInfo(environmentId: EnvironmentId) {
+  try {
+    const { data } = await axios.get<SystemInfo>(
+      buildUrl(environmentId, 'info')
+    );
+    return data;
+  } catch (err) {
+    throw parseAxiosError(err as Error, 'Unable to retrieve version');
+  }
+}
+
+export function useInfo<TSelect = SystemInfo>(
+  environmentId: EnvironmentId,
+  select?: (info: SystemInfo) => TSelect
+) {
+  return useQuery(
+    ['environment', environmentId, 'docker', 'info'],
+    () => getInfo(environmentId),
+    {
+      select,
+    }
+  );
+}
+
+export function useIsStandAlone(environmentId: EnvironmentId) {
+  const query = useInfo(environmentId, (info) => !info.Swarm?.NodeID);
+
+  return !!query.data;
+}
+
+export function useIsSwarm(environmentId: EnvironmentId) {
+  const query = useInfo(environmentId, (info) => !!info.Swarm?.NodeID);
+
+  return !!query.data;
+}

app/react/docker/proxy/queries/useServicePlugins.ts

@@ -0,0 +1,114 @@
+import { useQuery } from 'react-query';
+import {
+  Plugin,
+  PluginInterfaceType,
+  PluginsInfo,
+} from 'docker-types/generated/1.41';
+
+import axios, { parseAxiosError } from '@/portainer/services/axios';
+import { EnvironmentId } from '@/react/portainer/environments/types';
+
+import { queryKeys } from '../../queries/utils/root';
+
+import { buildUrl } from './build-url';
+import { useInfo } from './useInfo';
+
+export async function getPlugins(environmentId: EnvironmentId) {
+  try {
+    const { data } = await axios.get<Array<Plugin>>(
+      buildUrl(environmentId, 'plugins')
+    );
+    return data;
+  } catch (e) {
+    throw parseAxiosError(e as Error, 'Unable to retrieve plugins');
+  }
+}
+
+function usePlugins(
+  environmentId: EnvironmentId,
+  { enabled }: { enabled?: boolean } = {}
+) {
+  return useQuery(
+    queryKeys.plugins(environmentId),
+    () => getPlugins(environmentId),
+    { enabled }
+  );
+}
+
+export function useServicePlugins(
+  environmentId: EnvironmentId,
+  systemOnly: boolean,
+  pluginType: keyof PluginsInfo,
+  pluginVersion: string
+) {
+  const systemPluginsQuery = useInfo(environmentId, (info) => info.Plugins);
+  const pluginsQuery = usePlugins(environmentId, { enabled: !systemOnly });
+
+  return {
+    data: aggregateData(),
+    isLoading: systemPluginsQuery.isLoading || pluginsQuery.isLoading,
+  };
+
+  function aggregateData() {
+    if (!systemPluginsQuery.data) {
+      return null;
+    }
+
+    const systemPlugins = systemPluginsQuery.data[pluginType] || [];
+
+    if (systemOnly) {
+      return systemPlugins;
+    }
+
+    const plugins =
+      pluginsQuery.data
+        ?.filter(
+          (plugin) =>
+            plugin.Enabled &&
+            // docker has an error in their types, so we need to cast to unknown first
+            // see https://docs.docker.com/engine/api/v1.41/#tag/Plugin/operation/PluginList
+            plugin.Config.Interface.Types.includes(
+              pluginVersion as unknown as PluginInterfaceType
+            )
+        )
+        .map((plugin) => plugin.Name) || [];
+
+    return [...systemPlugins, ...plugins];
+  }
+}
+
+export function useLoggingPlugins(
+  environmentId: EnvironmentId,
+  systemOnly: boolean
+) {
+  return useServicePlugins(
+    environmentId,
+    systemOnly,
+    'Log',
+    'docker.logdriver/1.0'
+  );
+}
+
+export function useVolumePlugins(
+  environmentId: EnvironmentId,
+  systemOnly: boolean
+) {
+  return useServicePlugins(
+    environmentId,
+    systemOnly,
+    'Volume',
+    'docker.volumedriver/1.0'
+  );
+}
+
+export function useNetworkPlugins(
+  environmentId: EnvironmentId,
+  systemOnly: boolean
+) {
+  return useServicePlugins(
+    environmentId,
+    systemOnly,
+    'Network',
+    'docker.networkdriver/1.0'
+  );
+}

app/react/docker/proxy/queries/useVersion.ts

@@ -0,0 +1,34 @@
+import { useQuery } from 'react-query';
+
+import axios, { parseAxiosError } from '@/portainer/services/axios';
+import { EnvironmentId } from '@/react/portainer/environments/types';
+
+import { buildUrl } from './build-url';
+
+export interface VersionResponse {
+  ApiVersion: string;
+}
+
+export async function getVersion(environmentId: EnvironmentId) {
+  try {
+    const { data } = await axios.get<VersionResponse>(
+      buildUrl(environmentId, 'version')
+    );
+    return data;
+  } catch (err) {
+    throw parseAxiosError(err as Error, 'Unable to retrieve version');
+  }
+}
+
+export function useVersion<TSelect = VersionResponse>(
+  environmentId: EnvironmentId,
+  select?: (info: VersionResponse) => TSelect
+) {
+  return useQuery(
+    ['environment', environmentId, 'docker', 'version'],
+    () => getVersion(environmentId),
+    {
+      select,
+    }
+  );
+}