apps/containers: Rename services to templates

Signed-off-by: Quentin Guidée <[email protected]>
vertex-center · Jan 21, 2024 · a3520c8 · a3520c8
1 parent e2d726d
commit a3520c8
Show file tree

Hide file tree

Showing 10 changed files with 51 additions and 51 deletions.
diff --git a/src/apps/Containers/backend/api.ts b/src/apps/Containers/backend/api.ts
@@ -7,7 +7,7 @@ import {
     Tags,
 } from "./models";
 import { DockerContainerInfo } from "../../../models/docker";
-import { Service } from "./service";
+import { Template } from "./template";
 
 // @ts-ignore
 const server = createServer(window.api_urls.containers);
@@ -24,8 +24,8 @@ const getAllTags = async () => {
     return data;
 };
 
-const getAllServices = async () => {
-    const { data } = await server.get<Service[]>(`/services`);
+const getAllTemplates = async () => {
+    const { data } = await server.get<Template[]>(`/templates`);
     return data;
 };
 
@@ -34,8 +34,8 @@ const getContainer = async (id: string) => {
     return data;
 };
 
-const createContainer = async (service_id: string) => {
-    const { data } = await server.post(`/containers`, { service_id });
+const createContainer = async (template_id: string) => {
+    const { data } = await server.post(`/containers`, { template_id });
     return data;
 };
 
@@ -109,5 +109,5 @@ export const API = {
     recreateDocker,
     updateService,
     getVersions,
-    getAllServices,
+    getAllTemplates,
 };
diff --git a/src/apps/Containers/backend/models.ts b/src/apps/Containers/backend/models.ts
@@ -34,7 +34,7 @@ export type EnvVariable = {
 export type Containers = Container[];
 export type Container = {
     id: string;
-    service_id: string;
+    template_id: string;
     user_id: string;
     image: string;
     image_tag: string;

diff --git a/src/apps/Containers/backend/service.ts → src/apps/Containers/backend/template.ts b/src/apps/Containers/backend/service.ts → src/apps/Containers/backend/template.ts
@@ -57,7 +57,7 @@ export type DatabaseEnvironment = {
     names?: { [name: string]: string };
 };
 
-export type Service = {
+export type Template = {
     id: string;
     name: string;
     repository: string;

diff --git a/src/apps/Containers/pages/ContainerDatabase/ContainerDetailsDatabase.tsx b/src/apps/Containers/pages/ContainerDatabase/ContainerDetailsDatabase.tsx
@@ -16,7 +16,7 @@ import {
     Title,
 } from "@vertex-center/components";
 import { api } from "../../../../backend/api/backend";
-import { DatabaseEnvironment } from "../../backend/service";
+import { DatabaseEnvironment } from "../../backend/template";
 import { APIError } from "../../../../components/Error/APIError";
 import { ProgressOverlay } from "../../../../components/Progress/Progress";
 import { useMutation, useQueryClient } from "@tanstack/react-query";

diff --git a/src/apps/Containers/pages/ContainersStore/ContainersStore.tsx b/src/apps/Containers/pages/ContainersStore/ContainersStore.tsx
@@ -1,4 +1,4 @@
-import { Service as ServiceModel } from "../../backend/service";
+import { Template as ServiceModel } from "../../backend/template";
 import React, { useState } from "react";
 import styles from "./ContainersStore.module.sass";
 import Service from "../../../../components/Service/Service";
@@ -35,7 +35,7 @@ export default function ContainersStore() {
 
     const queryServices = useQuery({
         queryKey: ["services"],
-        queryFn: API.getAllServices,
+        queryFn: API.getAllTemplates,
     });
     const {
         data: services,
@@ -55,9 +55,9 @@ export default function ContainersStore() {
 
     const mutationCreateContainer = useMutation({
         mutationFn: API.createContainer,
-        onSettled: (data, error, serviceID) => {
+        onSettled: (data, error, templateID) => {
             setDownloading(
-                downloading.filter(({ service: s }) => s.id !== serviceID)
+                downloading.filter(({ service: s }) => s.id !== templateID)
             );
             queryClient.invalidateQueries({
                 queryKey: ["containers"],
@@ -127,17 +127,17 @@ export default function ContainersStore() {
                 <Title variant="h2">From template</Title>
                 <APIError error={error} />
                 <List>
-                    {services?.map((serv) => (
+                    {services?.map((template) => (
                         <Service
-                            key={serv.id}
-                            service={serv}
-                            onInstall={() => openInstallPopup(serv)}
+                            key={template.id}
+                            template={template}
+                            onInstall={() => openInstallPopup(template)}
                             downloading={downloading.some(
-                                ({ service: s }) => s.id === serv.id
+                                ({ service: s }) => s.id === template.id
                             )}
                             installedCount={
                                 containers?.filter(
-                                    (c) => c.service_id === serv.id
+                                    (c) => c.template_id === template.id
                                 )?.length
                             }
                         />

diff --git a/src/apps/Sql/Installer/SqlInstaller.tsx b/src/apps/Sql/Installer/SqlInstaller.tsx
@@ -1,7 +1,7 @@
 import { api } from "../../../backend/api/backend";
 import { ProgressOverlay } from "../../../components/Progress/Progress";
 import Service from "../../../components/Service/Service";
-import { Service as ServiceModel } from "../../Containers/backend/service";
+import { Template as ServiceModel } from "../../Containers/backend/template";
 import ServiceInstallPopup from "../../../components/ServiceInstallPopup/ServiceInstallPopup";
 import { useState } from "react";
 import { APIError } from "../../../components/Error/APIError";
@@ -15,11 +15,11 @@ export default function SqlInstaller() {
     const queryClient = useQueryClient();
 
     const queryServices = useQuery({
-        queryKey: ["services"],
-        queryFn: API.getAllServices,
+        queryKey: ["templates"],
+        queryFn: API.getAllTemplates,
     });
     const {
-        data: services,
+        data: templates,
         isLoading: isServicesLoading,
         error: servicesError,
     } = queryServices;
@@ -49,12 +49,12 @@ export default function SqlInstaller() {
     };
 
     const mutationCreateContainer = useMutation({
-        mutationFn: async (serviceId: string) => {
-            await api.vxSql.dbms(serviceId).install();
+        mutationFn: async (templateID: string) => {
+            await api.vxSql.dbms(templateID).install();
         },
-        onSettled: (data, error, serviceId) => {
+        onSettled: (data, error, templateID) => {
             setDownloading(
-                downloading.filter(({ service: s }) => s.id !== serviceId)
+                downloading.filter(({ service: s }) => s.id !== templateID)
             );
             queryClient.invalidateQueries({
                 queryKey: ["containers"],
@@ -79,30 +79,30 @@ export default function SqlInstaller() {
             <Title variant="h2">Installer</Title>
             <APIError error={error} />
             <List>
-                {services
+                {templates
                     ?.filter((s) => s?.features?.databases?.length >= 1)
                     ?.filter((s) =>
                         s?.features?.databases?.some(
                             (d) => d.category === "sql"
                         )
                     )
-                    ?.map((service) => {
+                    ?.map((template) => {
                         return (
                             <Service
-                                key={service.id}
-                                service={service}
-                                onInstall={() => open(service)}
+                                key={template.id}
+                                template={template}
+                                onInstall={() => open(template)}
                                 downloading={downloading.some(
-                                    ({ service: s }) => s.id === service.id
+                                    ({ service: s }) => s.id === template.id
                                 )}
                                 installedCount={
                                     containers === undefined
                                         ? undefined
                                         : Object.values(
                                               containers ?? []
                                           )?.filter(
-                                              ({ service_id }) =>
-                                                  service_id === service.id
+                                              ({ template_id }) =>
+                                                  template_id === template.id
                                           )?.length
                                 }
                             />

diff --git a/src/backend/api/vxServiceEditor.ts b/src/backend/api/vxServiceEditor.ts
@@ -1,11 +1,11 @@
-import { Service } from "../../apps/Containers/backend/service";
+import { Template } from "../../apps/Containers/backend/template";
 
 import { createServer } from "../server";
 
 // @ts-ignore
 const server = createServer(window.api_urls.devtools_service_editor);
 
-const toYaml = async (service: Service) => {
+const toYaml = async (service: Template) => {
     const { data } = await server.post(`/editor/to-yaml`, service);
     return data;
 };

diff --git a/src/components/Service/Service.tsx b/src/components/Service/Service.tsx
@@ -1,4 +1,4 @@
-import { Service as ServiceModel } from "../../apps/Containers/backend/service";
+import { Template as TemplateModel } from "../../apps/Containers/backend/template";
 
 import styles from "./Service.module.sass";
 import { Caption } from "../Text/Text";
@@ -14,14 +14,14 @@ import {
 } from "@vertex-center/components";
 
 type Props = {
-    service: ServiceModel;
+    template: TemplateModel;
     onInstall: () => void;
     downloading?: boolean;
     installedCount?: number;
 };
 
 export default function Service(props: Readonly<Props>) {
-    const { service, onInstall, downloading, installedCount } = props;
+    const { template, onInstall, downloading, installedCount } = props;
 
     let installedCountText = "";
     if (installedCount === 1) {
@@ -33,11 +33,11 @@ export default function Service(props: Readonly<Props>) {
     return (
         <ListItem onClick={onInstall}>
             <ListIcon>
-                <ServiceLogo service={service} />
+                <ServiceLogo template={template} />
             </ListIcon>
             <ListInfo>
-                <ListTitle>{service?.name}</ListTitle>
-                <Caption>{service?.description}</Caption>
+                <ListTitle>{template?.name}</ListTitle>
+                <Caption>{template?.description}</Caption>
             </ListInfo>
             <ListActions>
                 {installedCountText && (

diff --git a/src/components/ServiceInstallPopup/ServiceInstallPopup.tsx b/src/components/ServiceInstallPopup/ServiceInstallPopup.tsx
@@ -1,7 +1,7 @@
 import { APIError } from "../Error/APIError";
 import { Button, MaterialIcon, Paragraph } from "@vertex-center/components";
 import Popup from "../Popup/Popup";
-import { Service as ServiceModel } from "../../apps/Containers/backend/service";
+import { Template as ServiceModel } from "../../apps/Containers/backend/template";
 import { Fragment, useState } from "react";
 
 type Props = {

diff --git a/src/components/ServiceLogo/ServiceLogo.tsx b/src/components/ServiceLogo/ServiceLogo.tsx
@@ -1,27 +1,27 @@
-import { Service } from "../../apps/Containers/backend/service";
+import { Template } from "../../apps/Containers/backend/template";
 import { MaterialIcon } from "@vertex-center/components";
 
 type Props = {
-    service?: Service;
+    template?: Template;
 };
 
 export default function ServiceLogo(props: Readonly<Props>) {
-    const { service } = props;
+    const { template } = props;
 
     // @ts-ignore
     const iconURL = new URL(window.api_urls.containers);
-    iconURL.pathname = `/api/services/icons/${service?.icon}`;
+    iconURL.pathname = `/api/templates/icons/${template?.icon}`;
 
-    if (!service?.icon) {
+    if (!template?.icon) {
         return <MaterialIcon icon="extension" style={{ opacity: 0.8 }} />;
     }
 
-    if (service?.icon.endsWith(".svg")) {
+    if (template?.icon.endsWith(".svg")) {
         return (
             <span
                 style={{
                     maskImage: `url(${iconURL.href})`,
-                    backgroundColor: service?.color,
+                    backgroundColor: template?.color,
                     width: 24,
                     height: 24,
                 }}