feat: discover slider editing

overseerr-api.yml

@@ -3123,6 +3123,35 @@ paths:
                 items:
                   $ref: '#/components/schemas/DiscoverSlider'
   /settings/discover/{sliderId}:
+    put:
+      summary: Update a single slider
+      description: |
+        Updates a single slider and return the newly updated slider. Requires the `ADMIN` permission.
+      tags:
+        - settings
+      requestBody:
+        required: true
+        content:
+          application/json:
+            schema:
+              type: object
+              properties:
+                title:
+                  type: string
+                  example: 'Slider Title'
+                type:
+                  type: number
+                  example: 1
+                data:
+                  type: string
+                  example: '1'
+      responses:
+        '200':
+          description: Returns newly added discovery slider
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/DiscoverSlider'
     delete:
       summary: Delete slider by ID
       description: Deletes the slider with the provided sliderId. Requires the `ADMIN` permission.

server/routes/settings/discover.ts

@@ -77,6 +77,37 @@ discoverSettingRoutes.get('/reset', async (_req, res) => {
   return res.status(204).send();
 });
 
+discoverSettingRoutes.put('/:sliderId', async (req, res, next) => {
+  const sliderRepository = getRepository(DiscoverSlider);
+
+  const slider = req.body as DiscoverSlider;
+
+  try {
+    const existingSlider = await sliderRepository.findOneOrFail({
+      where: {
+        id: Number(req.params.sliderId),
+      },
+    });
+
+    // Only allow changes to the following when the slider is not built in
+    if (!existingSlider.isBuiltIn) {
+      existingSlider.title = slider.title;
+      existingSlider.data = slider.data;
+      existingSlider.type = slider.type;
+    }
+
+    await sliderRepository.save(existingSlider);
+
+    return res.status(200).json(existingSlider);
+  } catch (e) {
+    logger.error('Something went wrong updating a slider.', {
+      label: 'API',
+      errorMessage: e.message,
+    });
+    next({ status: 404, message: 'Slider not found or cannot be updated.' });
+  }
+});
+
 discoverSettingRoutes.delete('/:sliderId', async (req, res, next) => {
   const sliderRepository = getRepository(DiscoverSlider);
 

src/components/Common/Tag/index.tsx

@@ -1,13 +1,21 @@
 import { TagIcon } from '@heroicons/react/24/outline';
+import React from 'react';
 
 type TagProps = {
   children: React.ReactNode;
+  iconSvg?: JSX.Element;
 };
 
-const Tag = ({ children }: TagProps) => {
+const Tag = ({ children, iconSvg }: TagProps) => {
   return (
     <div className="inline-flex cursor-pointer items-center rounded-full bg-gray-800 px-2 py-1 text-sm text-gray-200 ring-1 ring-gray-600 transition hover:bg-gray-700">
-      <TagIcon className="mr-1 h-4 w-4" />
+      {iconSvg ? (
+        React.cloneElement(iconSvg, {
+          className: 'mr-1 h-4 w-4',
+        })
+      ) : (
+        <TagIcon className="mr-1 h-4 w-4" />
+      )}
       <span>{children}</span>
     </div>
   );

src/components/CompanyTag/index.tsx

@@ -0,0 +1,28 @@
+import Spinner from '@app/assets/spinner.svg';
+import Tag from '@app/components/Common/Tag';
+import { BuildingOffice2Icon } from '@heroicons/react/24/outline';
+import type { ProductionCompany, TvNetwork } from '@server/models/common';
+import useSWR from 'swr';
+
+type CompanyTagProps = {
+  type: 'studio' | 'network';
+  companyId: number;
+};
+
+const CompanyTag = ({ companyId, type }: CompanyTagProps) => {
+  const { data, error } = useSWR<TvNetwork | ProductionCompany>(
+    `/api/v1/${type}/${companyId}`
+  );
+
+  if (!data && !error) {
+    return (
+      <Tag>
+        <Spinner className="h-4 w-4" />
+      </Tag>
+    );
+  }
+
+  return <Tag iconSvg={<BuildingOffice2Icon />}>{data?.name}</Tag>;
+};
+
+export default CompanyTag;