Fix all playlist actions

src/renderer/features/playlists/components/update-playlist-form.tsx

@@ -1,8 +1,22 @@
 import { Group, Stack } from '@mantine/core';
 import { useForm } from '@mantine/form';
-import { ServerType, UpdatePlaylistBody, UpdatePlaylistQuery, User } from '/@/renderer/api/types';
+import { openModal, closeAllModals } from '@mantine/modals';
+import { api } from '/@/renderer/api';
+import { queryKeys } from '/@/renderer/api/query-keys';
+import {
+  PlaylistDetailResponse,
+  ServerListItem,
+  ServerType,
+  SortOrder,
+  UpdatePlaylistBody,
+  UpdatePlaylistQuery,
+  User,
+  UserListQuery,
+  UserListSort,
+} from '/@/renderer/api/types';
 import { Button, Select, Switch, TextInput, toast } from '/@/renderer/components';
 import { useUpdatePlaylist } from '/@/renderer/features/playlists/mutations/update-playlist-mutation';
+import { queryClient } from '/@/renderer/lib/react-query';
 import { useCurrentServer } from '/@/renderer/store';
 
 interface UpdatePlaylistFormProps {
@@ -103,3 +117,49 @@ export const UpdatePlaylistForm = ({ users, query, body, onCancel }: UpdatePlayl
     </form>
   );
 };
+
+export const openUpdatePlaylistModal = async (args: {
+  playlist: PlaylistDetailResponse;
+  server: ServerListItem;
+}) => {
+  const { playlist, server } = args;
+
+  const query: UserListQuery = {
+    sortBy: UserListSort.NAME,
+    sortOrder: SortOrder.ASC,
+    startIndex: 0,
+  };
+
+  if (!server) return;
+
+  const users = await queryClient.fetchQuery({
+    queryFn: ({ signal }) =>
+      api.controller.getUserList({ apiClientProps: { server, signal }, query }),
+    queryKey: queryKeys.users.list(server?.id || '', query),
+  });
+
+  openModal({
+    children: (
+      <UpdatePlaylistForm
+        body={{
+          _custom: {
+            navidrome: {
+              owner: playlist?.owner || undefined,
+              ownerId: playlist?.ownerId || undefined,
+              public: playlist?.public || false,
+              rules: playlist?.rules || undefined,
+              sync: playlist?.sync || undefined,
+            },
+          },
+          comment: playlist?.description || undefined,
+          genres: playlist?.genres,
+          name: playlist?.name,
+        }}
+        query={{ id: playlist?.id }}
+        users={users?.items}
+        onCancel={closeAllModals}
+      />
+    ),
+    title: 'Edit playlist',
+  });
+};