Re-wire the `Snippets` entity to use RTK Query under the hood (#41656)

* Throw for `Snippets.api.delete`

* Add boilerplate `snippet` RTK API

* Add boilerplate RTK-compatibility layer for main `Snippets.api` endpoints

* Add types

* Add cache invalidation

frontend/src/metabase-types/api/snippets.ts

@@ -16,3 +16,23 @@ export interface NativeQuerySnippet {
   created_at: string;
   updated_at: string;
 }
+
+export interface ListSnippetsParams {
+  archived?: boolean;
+}
+
+export interface CreateSnippetRequest {
+  content: string;
+  name: string;
+  description?: string;
+  collection_id?: RegularCollectionId | null;
+}
+
+export interface UpdateSnippetRequest {
+  id: NativeQuerySnippetId;
+  archived?: boolean;
+  content?: string | null;
+  name?: string | null;
+  description?: string | null;
+  collection_id?: RegularCollectionId | null;
+}

frontend/src/metabase/api/index.ts

@@ -17,6 +17,7 @@ export * from "./revision";
 export * from "./search";
 export * from "./segment";
 export * from "./session";
+export * from "./snippet";
 export * from "./table";
 export * from "./task";
 export * from "./timeline";

frontend/src/metabase/api/snippet.ts

+import type {
+  CreateSnippetRequest,
+  ListSnippetsParams,
+  NativeQuerySnippet,
+  NativeQuerySnippetId,
+  UpdateSnippetRequest,
+} from "metabase-types/api";
+
+import { Api } from "./api";
+import {
+  idTag,
+  listTag,
+  invalidateTags,
+  provideSnippetTags,
+  provideSnippetListTags,
+} from "./tags";
+
+export const snippetApi = Api.injectEndpoints({
+  endpoints: builder => ({
+    listSnippets: builder.query<
+      NativeQuerySnippet[],
+      ListSnippetsParams | void
+    >({
+      query: params => ({
+        method: "GET",
+        url: "/api/native-query-snippet",
+        params,
+      }),
+      providesTags: (snippets = []) => provideSnippetListTags(snippets),
+    }),
+    getSnippet: builder.query<NativeQuerySnippet, NativeQuerySnippetId>({
+      query: id => ({
+        method: "GET",
+        url: `/api/native-query-snippet/${id}`,
+      }),
+      providesTags: snippet => (snippet ? provideSnippetTags(snippet) : []),
+    }),
+    createSnippet: builder.mutation<NativeQuerySnippet, CreateSnippetRequest>({
+      query: body => ({
+        method: "POST",
+        url: "/api/native-query-snippet",
+        body,
+      }),
+      invalidatesTags: (_, error) =>
+        invalidateTags(error, [listTag("snippet")]),
+    }),
+    updateSnippet: builder.mutation<unknown, UpdateSnippetRequest>({
+      query: ({ id, ...body }) => ({
+        method: "PUT",
+        url: `/api/native-query-snippet/${id}`,
+        body,
+      }),
+      invalidatesTags: (_, error, { id }) =>
+        invalidateTags(error, [listTag("snippet"), idTag("snippet", id)]),
+    }),
+  }),
+});
+
+export const {
+  useListSnippetsQuery,
+  useGetSnippetQuery,
+  useCreateSnippetMutation,
+  useUpdateSnippetMutation,
+} = snippetApi;

frontend/src/metabase/api/tags/utils.ts

@@ -19,6 +19,7 @@ import type {
   GroupListQuery,
   ListDashboardsResponse,
   Metric,
+  NativeQuerySnippet,
   PopularItem,
   RecentItem,
   Revision,
@@ -334,6 +335,18 @@ export function provideSegmentTags(
   ];
 }
 
+export function provideSnippetListTags(
+  snippets: NativeQuerySnippet[],
+): TagDescription<TagType>[] {
+  return [listTag("snippet"), ...snippets.flatMap(provideSnippetTags)];
+}
+
+export function provideSnippetTags(
+  snippet: NativeQuerySnippet,
+): TagDescription<TagType>[] {
+  return [idTag("snippet", snippet.id)];
+}
+
 export function provideTableListTags(
   tables: Table[],
 ): TagDescription<TagType>[] {

frontend/src/metabase/entities/snippets.js

-import { createEntity } from "metabase/lib/entities";
+import { snippetApi } from "metabase/api";
+import { createEntity, entityCompatibleQuery } from "metabase/lib/entities";
 
 /**
  * @deprecated use "metabase/api" instead
@@ -11,6 +12,36 @@ const Snippets = createEntity({
     getFetched: (state, props) =>
       getFetched(state, props) || getObject(state, props),
   }),
+
+  api: {
+    list: (entityQuery, dispatch) =>
+      entityCompatibleQuery(
+        entityQuery,
+        dispatch,
+        snippetApi.endpoints.listSnippets,
+      ),
+    get: (entityQuery, options, dispatch) =>
+      entityCompatibleQuery(
+        entityQuery.id,
+        dispatch,
+        snippetApi.endpoints.getSnippet,
+      ),
+    create: (entityQuery, dispatch) =>
+      entityCompatibleQuery(
+        entityQuery,
+        dispatch,
+        snippetApi.endpoints.createSnippet,
+      ),
+    update: (entityQuery, dispatch) =>
+      entityCompatibleQuery(
+        entityQuery,
+        dispatch,
+        snippetApi.endpoints.updateSnippet,
+      ),
+    delete: () => {
+      throw new TypeError("Snippets.api.delete is not supported");
+    },
+  },
 });
 
 export default Snippets;