From 8c4e20467a340162b1a390c31e6dde2da47e70f4 Mon Sep 17 00:00:00 2001
From: "meng.zhu@nav.no" <meng.zhu@nav.no>
Date: Fri, 31 May 2024 10:08:48 +0200
Subject: [PATCH 1/2] insight product

---
 .../insightProducts/editInsightProduct.tsx    |  15 +-
 .../insightProducts/newInsightProduct.tsx     |  22 +-
 lib/queries/groupStats/groupStats.ts          |  10 -
 .../insightProducts/createInsightProduct.ts   |   9 -
 .../insightProducts/editInsightProduct.ts     |  31 ---
 lib/queries/insightProducts/insightProduct.ts |  20 --
 lib/rest/insightProducts.ts                   |  42 ++++
 lib/rest/restApi.ts                           |   4 +
 lib/schema/graphql.ts                         | 212 ------------------
 pages/insightProduct/edit.tsx                 |   9 +-
 10 files changed, 66 insertions(+), 308 deletions(-)
 delete mode 100644 lib/queries/groupStats/groupStats.ts
 delete mode 100644 lib/queries/insightProducts/createInsightProduct.ts
 delete mode 100644 lib/queries/insightProducts/editInsightProduct.ts
 delete mode 100644 lib/queries/insightProducts/insightProduct.ts
 create mode 100644 lib/rest/insightProducts.ts

diff --git a/components/insightProducts/editInsightProduct.tsx b/components/insightProducts/editInsightProduct.tsx
index 4ff8face..56087dcb 100644
--- a/components/insightProducts/editInsightProduct.tsx
+++ b/components/insightProducts/editInsightProduct.tsx
@@ -17,7 +17,7 @@ import * as yup from 'yup'
 import { useContext, useState } from 'react'
 import TagsSelector from '../lib/tagsSelector'
 import { UserState } from "../../lib/context";
-import { useUpdateInsightProductMetadataMutation } from '../../lib/schema/graphql'
+import { updateInsightProduct } from '../../lib/rest/insightProducts'
 
 const schema = yup.object().shape({
     name: yup.string().nullable().required('Skriv inn navnet på innsiktsproduktet'),
@@ -50,8 +50,9 @@ export const EditInsightProductMetadataForm = ({ id, name, description, type, li
     const [teamID, setTeamID] = useState<string>('')
     const userInfo = useContext(UserState)
     const [isPrivacyCheckboxChecked, setIsPrivacyCheckboxChecked] = useState(false)
+    const [error, setError] = useState<Error | undefined>(undefined)
+    const [loading, setLoading] = useState(false)
 
-    const [updateInsightProductQuery, { loading, error }] = useUpdateInsightProductMetadataMutation()
     const {
         register,
         handleSubmit,
@@ -95,8 +96,6 @@ export const EditInsightProductMetadataForm = ({ id, name, description, type, li
 
     const onSubmit = async (data: any) => {
         const editInsightProductData = {
-            variables: {
-                id: id,
                 name: data.name,
                 description: data.description,
                 type: data.type,
@@ -106,17 +105,21 @@ export const EditInsightProductMetadataForm = ({ id, name, description, type, li
                 productAreaID: productAreaID,
                 teamID: teamID,
                 group: data.group,
-            },
         }
 
-        updateInsightProductQuery(editInsightProductData).then(() => {
+        setLoading(true)
+        updateInsightProduct(id, editInsightProductData).then(() => {
+            setError(undefined)
             amplitudeLog('skjema fullført', { skjemanavn: 'endre-innsiktsprodukt' })
             router.back()
         }).catch(e => {
             console.log(e)
+            setError(e)
             amplitudeLog('skjemainnsending feilet', {
                 skjemanavn: 'endre-innsiktsprodukt',
             })
+        }).finally(() => {
+            setLoading(false)
         })
     }
 
diff --git a/components/insightProducts/newInsightProduct.tsx b/components/insightProducts/newInsightProduct.tsx
index d92a3154..87c1bb4e 100644
--- a/components/insightProducts/newInsightProduct.tsx
+++ b/components/insightProducts/newInsightProduct.tsx
@@ -17,7 +17,7 @@ import * as yup from 'yup'
 import { ChangeEvent, useContext, useState } from 'react'
 import TagsSelector from '../lib/tagsSelector'
 import { UserState } from "../../lib/context";
-import { CREATE_INSIGHT_PRODUCT } from '../../lib/queries/insightProducts/createInsightProduct'
+import { createInsightProduct } from '../../lib/rest/insightProducts'
 
 const schema = yup.object().shape({
     name: yup.string().nullable().required('Skriv inn navnet på innsiktsproduktet'),
@@ -28,7 +28,7 @@ const schema = yup.object().shape({
     link: yup
         .string()
         .required('Du må legge til en lenke til innsiktsproduktet')
-        .url('Lenken må være en gyldig URL'), // Add this line to validate the link as a URL    type: yup.string().required('Du må velge en type for innsiktsproduktet'),
+        .url('Lenken må være en gyldig URL, fks. https://valid.url.to.page'), // Add this line to validate the link as a URL    type: yup.string().required('Du må velge en type for innsiktsproduktet'),
     group: yup.string().required('Du må skrive inn en gruppe for innsiktsproduktet')
 })
 
@@ -48,6 +48,7 @@ export const NewInsightProductForm = () => {
     const [teamID, setTeamID] = useState<string>('')
     const userData = useContext(UserState)
     const [isPrivacyCheckboxChecked, setIsPrivacyCheckboxChecked] = useState(false)
+    const [backendError, setBackendError] = useState<Error | undefined>(undefined)
 
     const handlePrivacyCheckboxChange = () => {
         setIsPrivacyCheckboxChecked(!isPrivacyCheckboxChecked)
@@ -93,8 +94,6 @@ export const NewInsightProductForm = () => {
 
     const onSubmit = async (data: any) => {
         const inputData = {
-            variables: {
-                input: {
                     name: data.name,
                     description: valueOrNull(data.description),
                     keywords: data.keywords,
@@ -104,15 +103,15 @@ export const NewInsightProductForm = () => {
                     link: data.link,
                     type: data.type,
                     group: data.group,
-                },
-            },
-            refetchQueries: ['searchContent'],
         }
 
         try {
             await createInsightProduct(inputData)
+            setBackendError(undefined)
             amplitudeLog('skjema fullført', { skjemanavn: 'ny-innsiktsprodukt' })
+            router.push('/user/insightProducts')
         } catch (e) {
+            setBackendError(new Error('Internal server error'))
             amplitudeLog('skjemainnsending feilet', {
                 skjemanavn: 'ny-innsiktsprodukt',
             })
@@ -121,15 +120,6 @@ export const NewInsightProductForm = () => {
 
     }
 
-    const [createInsightProduct, { loading, error: backendError }] = useMutation(
-        CREATE_INSIGHT_PRODUCT,
-        {
-            onCompleted: (data) => {
-                router.push("/")
-            },
-        }
-    )
-
     const onCancel = () => {
         amplitudeLog(
             'Klikker på: Avbryt',
diff --git a/lib/queries/groupStats/groupStats.ts b/lib/queries/groupStats/groupStats.ts
deleted file mode 100644
index 44c5e5c9..00000000
--- a/lib/queries/groupStats/groupStats.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const GET_GROUPSTATS = gql`
-  query groupStats {
-    groupStats {
-      email
-      dataproducts
-    }
-  }
-`
diff --git a/lib/queries/insightProducts/createInsightProduct.ts b/lib/queries/insightProducts/createInsightProduct.ts
deleted file mode 100644
index 2a3fce3e..00000000
--- a/lib/queries/insightProducts/createInsightProduct.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const CREATE_INSIGHT_PRODUCT = gql`
-  mutation createInsightProduct($input: NewInsightProduct!) {
-    createInsightProduct(input: $input) {
-      id
-    }
-  }
-`
\ No newline at end of file
diff --git a/lib/queries/insightProducts/editInsightProduct.ts b/lib/queries/insightProducts/editInsightProduct.ts
deleted file mode 100644
index 4862c618..00000000
--- a/lib/queries/insightProducts/editInsightProduct.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import gql from "graphql-tag";
-
-export const UPDATE_INSIGHT_PRODUCT_METADATA = gql`
-  mutation updateInsightProductMetadata(
-    $id: ID!
-    $name: String!
-    $description: String!
-    $type: String!
-    $link: String!
-    $keywords: [String!]!
-    $teamkatalogenURL: String
-    $productAreaID: String
-    $teamID: String
-    $group: String!
-  ) {
-    updateInsightProductMetadata(
-      id: $id
-      name: $name
-      description: $description
-      type: $type
-      link: $link
-      keywords: $keywords
-      teamkatalogenURL: $teamkatalogenURL
-      productAreaID: $productAreaID
-      teamID: $teamID
-      group: $group
-    ) {
-      id
-    }
-  }
-`
\ No newline at end of file
diff --git a/lib/queries/insightProducts/insightProduct.ts b/lib/queries/insightProducts/insightProduct.ts
deleted file mode 100644
index 4c232fef..00000000
--- a/lib/queries/insightProducts/insightProduct.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import gql from "graphql-tag";
-
-export const GET_INSIGHT_PRODUCT = gql`
-  query insightProduct($id: ID!) {
-    insightProduct(id: $id) {
-      id
-      name
-      description
-      created
-      lastModified
-      type
-      link
-      keywords
-      group
-      teamkatalogenURL
-      productAreaID
-      teamID
-    }
-  }
-`
\ No newline at end of file
diff --git a/lib/rest/insightProducts.ts b/lib/rest/insightProducts.ts
new file mode 100644
index 00000000..7c5506c9
--- /dev/null
+++ b/lib/rest/insightProducts.ts
@@ -0,0 +1,42 @@
+import { useEffect, useState } from "react"
+import { createInsightProductUrl, fetchTemplate, getInsightProductUrl, postTemplate, putTemplate, updateInsightProductUrl } from "./restApi"
+
+const getInsightProduct = async (id: string) => {
+    const url = getInsightProductUrl(id)
+    return fetchTemplate(url)
+}
+
+export const useGetInsightProduct = (id: string)=>{
+    const [insightProduct, setInsightProduct] = useState<any>(null)
+    const [loading, setLoading] = useState(false)
+    const [error, setError] = useState<Error| undefined>(undefined)
+
+
+    useEffect(()=>{
+        if(!id) return
+        getInsightProduct(id).then((res)=> res.json())
+        .then((data)=>
+        {
+            setError(undefined)
+            setInsightProduct(data)
+        })
+        .catch((err)=>{
+            setError(err)
+            setInsightProduct(null)            
+        }).finally(()=>{
+            setLoading(false)
+        })
+    }, [id])
+
+    return {insightProduct, loading, error}
+}
+
+export const createInsightProduct = async (insp: any) => {
+    const url = createInsightProductUrl()
+    return postTemplate(url, insp).then((res)=>res.json())
+}
+
+export const updateInsightProduct = async (id: string, insp: any) => {
+    const url = updateInsightProductUrl(id)
+    return putTemplate(url, insp).then((res)=>res.json())
+}
\ No newline at end of file
diff --git a/lib/rest/restApi.ts b/lib/rest/restApi.ts
index 26704e32..91a3a196 100644
--- a/lib/rest/restApi.ts
+++ b/lib/rest/restApi.ts
@@ -25,6 +25,10 @@ export const getProductAreasUrl = () => `${apiUrl()}/productareas`
 export const getProductAreaUrl = (id: string) => `${apiUrl()}/productareas/${id}`
 export const fetchUserDataUrl = () => `${apiUrl()}/userData`
 
+export const getInsightProductUrl = (id: string) => `${apiUrl()}/insightProducts/${id}`
+export const createInsightProductUrl = () => `${apiUrl()}/insightProducts/new`
+export const updateInsightProductUrl = (id: string) => `${apiUrl()}/insightProducts/${id}`
+
 export const fetchKeywordsUrl = () => `${apiUrl()}/keywords`
 export const updateKeywordsUrl = () => `${apiUrl()}/keywords`
 
diff --git a/lib/schema/graphql.ts b/lib/schema/graphql.ts
index 65b26ad6..b7bc8e47 100644
--- a/lib/schema/graphql.ts
+++ b/lib/schema/graphql.ts
@@ -1180,41 +1180,6 @@ export type UserInfo = {
   stories: Array<Story>;
 };
 
-export type GroupStatsQueryVariables = Exact<{ [key: string]: never; }>;
-
-
-export type GroupStatsQuery = { __typename?: 'Query', groupStats: Array<{ __typename?: 'GroupStats', email: string, dataproducts: number }> };
-
-export type CreateInsightProductMutationVariables = Exact<{
-  input: NewInsightProduct;
-}>;
-
-
-export type CreateInsightProductMutation = { __typename?: 'Mutation', createInsightProduct: { __typename?: 'InsightProduct', id: string } };
-
-export type UpdateInsightProductMetadataMutationVariables = Exact<{
-  id: Scalars['ID']['input'];
-  name: Scalars['String']['input'];
-  description: Scalars['String']['input'];
-  type: Scalars['String']['input'];
-  link: Scalars['String']['input'];
-  keywords: Array<Scalars['String']['input']> | Scalars['String']['input'];
-  teamkatalogenURL?: InputMaybe<Scalars['String']['input']>;
-  productAreaID?: InputMaybe<Scalars['String']['input']>;
-  teamID?: InputMaybe<Scalars['String']['input']>;
-  group: Scalars['String']['input'];
-}>;
-
-
-export type UpdateInsightProductMetadataMutation = { __typename?: 'Mutation', updateInsightProductMetadata: { __typename?: 'InsightProduct', id: string } };
-
-export type InsightProductQueryVariables = Exact<{
-  id: Scalars['ID']['input'];
-}>;
-
-
-export type InsightProductQuery = { __typename?: 'Query', insightProduct: { __typename?: 'InsightProduct', id: string, name: string, description: string, created: any, lastModified?: any | null, type: string, link: string, keywords: Array<string>, group: string, teamkatalogenURL?: string | null, productAreaID?: string | null, teamID?: string | null } };
-
 export type JoinableViewQueryVariables = Exact<{
   id: Scalars['ID']['input'];
 }>;
@@ -1290,183 +1255,6 @@ export type UserInfoAccessableDataproductQueryVariables = Exact<{ [key: string]:
 export type UserInfoAccessableDataproductQuery = { __typename?: 'Query', userInfo: { __typename?: 'UserInfo', accessable: { __typename?: 'AccessibleDatasets', owned: Array<{ __typename: 'Dataset', id: string, name: string, description: string, created: any, lastModified: any, owner: { __typename?: 'Owner', group: string, teamkatalogenURL?: string | null } }>, granted: Array<{ __typename: 'Dataset', id: string, name: string, description: string, created: any, lastModified: any, owner: { __typename?: 'Owner', group: string, teamkatalogenURL?: string | null } }> } } };
 
 
-export const GroupStatsDocument = gql`
-    query groupStats {
-  groupStats {
-    email
-    dataproducts
-  }
-}
-    `;
-
-/**
- * __useGroupStatsQuery__
- *
- * To run a query within a React component, call `useGroupStatsQuery` and pass it any options that fit your needs.
- * When your component renders, `useGroupStatsQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useGroupStatsQuery({
- *   variables: {
- *   },
- * });
- */
-export function useGroupStatsQuery(baseOptions?: Apollo.QueryHookOptions<GroupStatsQuery, GroupStatsQueryVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<GroupStatsQuery, GroupStatsQueryVariables>(GroupStatsDocument, options);
-      }
-export function useGroupStatsLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<GroupStatsQuery, GroupStatsQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<GroupStatsQuery, GroupStatsQueryVariables>(GroupStatsDocument, options);
-        }
-export function useGroupStatsSuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions<GroupStatsQuery, GroupStatsQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useSuspenseQuery<GroupStatsQuery, GroupStatsQueryVariables>(GroupStatsDocument, options);
-        }
-export type GroupStatsQueryHookResult = ReturnType<typeof useGroupStatsQuery>;
-export type GroupStatsLazyQueryHookResult = ReturnType<typeof useGroupStatsLazyQuery>;
-export type GroupStatsSuspenseQueryHookResult = ReturnType<typeof useGroupStatsSuspenseQuery>;
-export type GroupStatsQueryResult = Apollo.QueryResult<GroupStatsQuery, GroupStatsQueryVariables>;
-export const CreateInsightProductDocument = gql`
-    mutation createInsightProduct($input: NewInsightProduct!) {
-  createInsightProduct(input: $input) {
-    id
-  }
-}
-    `;
-export type CreateInsightProductMutationFn = Apollo.MutationFunction<CreateInsightProductMutation, CreateInsightProductMutationVariables>;
-
-/**
- * __useCreateInsightProductMutation__
- *
- * To run a mutation, you first call `useCreateInsightProductMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useCreateInsightProductMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [createInsightProductMutation, { data, loading, error }] = useCreateInsightProductMutation({
- *   variables: {
- *      input: // value for 'input'
- *   },
- * });
- */
-export function useCreateInsightProductMutation(baseOptions?: Apollo.MutationHookOptions<CreateInsightProductMutation, CreateInsightProductMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<CreateInsightProductMutation, CreateInsightProductMutationVariables>(CreateInsightProductDocument, options);
-      }
-export type CreateInsightProductMutationHookResult = ReturnType<typeof useCreateInsightProductMutation>;
-export type CreateInsightProductMutationResult = Apollo.MutationResult<CreateInsightProductMutation>;
-export type CreateInsightProductMutationOptions = Apollo.BaseMutationOptions<CreateInsightProductMutation, CreateInsightProductMutationVariables>;
-export const UpdateInsightProductMetadataDocument = gql`
-    mutation updateInsightProductMetadata($id: ID!, $name: String!, $description: String!, $type: String!, $link: String!, $keywords: [String!]!, $teamkatalogenURL: String, $productAreaID: String, $teamID: String, $group: String!) {
-  updateInsightProductMetadata(
-    id: $id
-    name: $name
-    description: $description
-    type: $type
-    link: $link
-    keywords: $keywords
-    teamkatalogenURL: $teamkatalogenURL
-    productAreaID: $productAreaID
-    teamID: $teamID
-    group: $group
-  ) {
-    id
-  }
-}
-    `;
-export type UpdateInsightProductMetadataMutationFn = Apollo.MutationFunction<UpdateInsightProductMetadataMutation, UpdateInsightProductMetadataMutationVariables>;
-
-/**
- * __useUpdateInsightProductMetadataMutation__
- *
- * To run a mutation, you first call `useUpdateInsightProductMetadataMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useUpdateInsightProductMetadataMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [updateInsightProductMetadataMutation, { data, loading, error }] = useUpdateInsightProductMetadataMutation({
- *   variables: {
- *      id: // value for 'id'
- *      name: // value for 'name'
- *      description: // value for 'description'
- *      type: // value for 'type'
- *      link: // value for 'link'
- *      keywords: // value for 'keywords'
- *      teamkatalogenURL: // value for 'teamkatalogenURL'
- *      productAreaID: // value for 'productAreaID'
- *      teamID: // value for 'teamID'
- *      group: // value for 'group'
- *   },
- * });
- */
-export function useUpdateInsightProductMetadataMutation(baseOptions?: Apollo.MutationHookOptions<UpdateInsightProductMetadataMutation, UpdateInsightProductMetadataMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<UpdateInsightProductMetadataMutation, UpdateInsightProductMetadataMutationVariables>(UpdateInsightProductMetadataDocument, options);
-      }
-export type UpdateInsightProductMetadataMutationHookResult = ReturnType<typeof useUpdateInsightProductMetadataMutation>;
-export type UpdateInsightProductMetadataMutationResult = Apollo.MutationResult<UpdateInsightProductMetadataMutation>;
-export type UpdateInsightProductMetadataMutationOptions = Apollo.BaseMutationOptions<UpdateInsightProductMetadataMutation, UpdateInsightProductMetadataMutationVariables>;
-export const InsightProductDocument = gql`
-    query insightProduct($id: ID!) {
-  insightProduct(id: $id) {
-    id
-    name
-    description
-    created
-    lastModified
-    type
-    link
-    keywords
-    group
-    teamkatalogenURL
-    productAreaID
-    teamID
-  }
-}
-    `;
-
-/**
- * __useInsightProductQuery__
- *
- * To run a query within a React component, call `useInsightProductQuery` and pass it any options that fit your needs.
- * When your component renders, `useInsightProductQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useInsightProductQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useInsightProductQuery(baseOptions: Apollo.QueryHookOptions<InsightProductQuery, InsightProductQueryVariables> & ({ variables: InsightProductQueryVariables; skip?: boolean; } | { skip: boolean; }) ) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<InsightProductQuery, InsightProductQueryVariables>(InsightProductDocument, options);
-      }
-export function useInsightProductLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<InsightProductQuery, InsightProductQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<InsightProductQuery, InsightProductQueryVariables>(InsightProductDocument, options);
-        }
-export function useInsightProductSuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions<InsightProductQuery, InsightProductQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useSuspenseQuery<InsightProductQuery, InsightProductQueryVariables>(InsightProductDocument, options);
-        }
-export type InsightProductQueryHookResult = ReturnType<typeof useInsightProductQuery>;
-export type InsightProductLazyQueryHookResult = ReturnType<typeof useInsightProductLazyQuery>;
-export type InsightProductSuspenseQueryHookResult = ReturnType<typeof useInsightProductSuspenseQuery>;
-export type InsightProductQueryResult = Apollo.QueryResult<InsightProductQuery, InsightProductQueryVariables>;
 export const JoinableViewDocument = gql`
     query JoinableView($id: ID!) {
   joinableView(id: $id) {
diff --git a/pages/insightProduct/edit.tsx b/pages/insightProduct/edit.tsx
index 92516f63..1371eea6 100644
--- a/pages/insightProduct/edit.tsx
+++ b/pages/insightProduct/edit.tsx
@@ -1,22 +1,23 @@
 import { Loader } from "@navikt/ds-react";
 import { useRouter } from "next/router";
 import { EditInsightProductMetadataFields, EditInsightProductMetadataForm } from "../../components/insightProducts/editInsightProduct";
-import { useInsightProductQuery } from "../../lib/schema/graphql";
+import { use } from "react";
+import { useGetInsightProduct } from "../../lib/rest/insightProducts";
 
 const EditInsightProductPage = () => {
     const router = useRouter();
     const id = router.query.id;
-    const insightProductQuery = useInsightProductQuery({ variables: { id: id as string } });
+    const insightProductQuery = useGetInsightProduct(id as string);
 
     if (insightProductQuery.error) {
         return <div>{insightProductQuery.error.message}</div>;
     }
 
-    if (insightProductQuery.loading || !insightProductQuery.data) {
+    if (insightProductQuery.loading || !insightProductQuery.insightProduct) {
         return <Loader></Loader>;
     }
 
-    const insightProduct = insightProductQuery.data.insightProduct;
+    const insightProduct = insightProductQuery.insightProduct;
 
     const formFields: EditInsightProductMetadataFields = {
         id: id as string,

From b595f77dece59da8552023f0b387e78d23276ca9 Mon Sep 17 00:00:00 2001
From: "meng.zhu@nav.no" <meng.zhu@nav.no>
Date: Fri, 31 May 2024 23:35:34 +0200
Subject: [PATCH 2/2] client

---
 components/search/resultList.tsx          |  10 +-
 components/search/searchResultLink.tsx    |  11 +-
 components/stories/editStoryMetadata.tsx  |  15 +-
 components/stories/newStory.tsx           |  34 ++--
 lib/queries/story/createStory.ts          |   9 -
 lib/queries/story/deleteInsightProduct.ts |   7 -
 lib/queries/story/deleteStory.ts          |   7 -
 lib/queries/story/story.ts                |  18 --
 lib/queries/story/updateStory.ts          |  27 ---
 lib/rest/insightProducts.ts               |   7 +-
 lib/rest/restApi.ts                       |   5 +
 lib/rest/stories.ts                       |  21 ++
 lib/schema/graphql.ts                     | 237 ----------------------
 13 files changed, 57 insertions(+), 351 deletions(-)
 delete mode 100644 lib/queries/story/createStory.ts
 delete mode 100644 lib/queries/story/deleteInsightProduct.ts
 delete mode 100644 lib/queries/story/deleteStory.ts
 delete mode 100644 lib/queries/story/story.ts
 delete mode 100644 lib/queries/story/updateStory.ts
 create mode 100644 lib/rest/stories.ts

diff --git a/components/search/resultList.tsx b/components/search/resultList.tsx
index 8bb64987..b46f7e90 100644
--- a/components/search/resultList.tsx
+++ b/components/search/resultList.tsx
@@ -8,7 +8,7 @@ import { UserState } from '../../lib/context'
 import { useSearchTeamKatalogen } from '../../lib/rest/teamkatalogen'
 import { useGetProductAreas } from '../../lib/rest/productAreas'
 import { SearchResult } from '../../lib/rest/search'
-import { useDeleteStoryMutation } from '../../lib/schema/graphql'
+import { deleteStory } from '../../lib/rest/stories'
 
 const Results = ({ children }: { children: React.ReactNode }) => (
   <div className="results">{children}</div>
@@ -58,15 +58,9 @@ const ResultList = ({
   searchParam,
   updateQuery,
 }: ResultListInterface) => {
-  const [deleteStoryQuery] = useDeleteStoryMutation()
   const userInfo = useContext(UserState)
   const { searchResult: teamkatalogen } = useSearchTeamKatalogen()
   const { productAreas } = useGetProductAreas()
-  const deleteStory = (id: string) => deleteStoryQuery({
-    variables: {
-      id: id
-    },
-  })
 
   const isDataProduct = (item: any) => !!item.datasets
 
@@ -197,7 +191,7 @@ const ResultList = ({
               keywords={s.keywords}
               editable={true}
               description={s.description}
-              deleteResource={deleteStory}
+              deleteResource={()=> deleteStory(s.id)}
             />
           ))}
         </Results>
diff --git a/components/search/searchResultLink.tsx b/components/search/searchResultLink.tsx
index b2d29f8c..f21275e4 100644
--- a/components/search/searchResultLink.tsx
+++ b/components/search/searchResultLink.tsx
@@ -4,12 +4,12 @@ import ReactMarkdown from 'react-markdown'
 import { PluggableList } from 'react-markdown/lib'
 import remarkGfm from 'remark-gfm'
 import { CoApplicant, Table } from '@navikt/ds-icons'
-import { useDeleteInsightProductMutation, useDeleteStoryMutation } from '../../lib/schema/graphql'
 import humanizeDate from '../../lib/humanizeDate'
 import DeleteModal from '../lib/deleteModal'
 import { useState } from 'react'
 import { useRouter } from 'next/router'
 import TagPill from '../lib/tagPill'
+import { deleteInsightProduct } from '../../lib/rest/insightProducts'
 
 export interface SearchResultProps {
   resourceType?: string
@@ -55,7 +55,6 @@ export const SearchResultLink = ({
   const owner = teamkatalogenTeam || group?.group
   const router = useRouter();
   const [error, setError] = useState<string | undefined>(undefined)
-  const [deleteInsightProductMutation] = useDeleteInsightProductMutation();
 
   const editResource = () => {
     if (resourceType == 'datafortelling') {
@@ -66,14 +65,6 @@ export const SearchResultLink = ({
   }
   const openDeleteModal = () => setModal(true)
 
-  const deleteInsightProduct = (id: string)=>{
-    return deleteInsightProductMutation({
-      variables:{
-        id: id
-      },
-    })
-  }
-
   const confirmDelete = () => {
     const deletePromise = resourceType == "innsiktsprodukt"?
       deleteInsightProduct(id || ''):
diff --git a/components/stories/editStoryMetadata.tsx b/components/stories/editStoryMetadata.tsx
index 0b580eda..3d79dd9c 100644
--- a/components/stories/editStoryMetadata.tsx
+++ b/components/stories/editStoryMetadata.tsx
@@ -15,7 +15,7 @@ import * as yup from 'yup'
 import { useContext, useState } from 'react'
 import TagsSelector from '../lib/tagsSelector'
 import {UserState} from "../../lib/context";
-import { useUpdateStoryMetadataMutation } from '../../lib/schema/graphql'
+import { updateStory } from '../../lib/rest/stories'
 
 const schema = yup.object().shape({
   name: yup.string().nullable().required('Skriv inn navnet på datafortellingen'),
@@ -40,7 +40,8 @@ export const EditStoryMetadataForm = ({id, name, description, keywords, teamkata
   const [productAreaID, setProductAreaID] = useState<string>('')
   const [teamID, setTeamID] = useState<string>('')
   const userInfo = useContext(UserState)
-  const [updateStoryQuery, {loading, error}] = useUpdateStoryMetadataMutation()
+  const [error, setError] = useState<Error | undefined>(undefined)
+  const [loading, setLoading] = useState(false)
   const {
     register,
     handleSubmit,
@@ -77,8 +78,6 @@ export const EditStoryMetadataForm = ({id, name, description, keywords, teamkata
 
   const onSubmit = async (data: any) => {
     const editStoryData = {
-      variables: {
-        id: id,
         name: data.name,
         description: data.description,
         keywords: data.keywords,
@@ -86,17 +85,21 @@ export const EditStoryMetadataForm = ({id, name, description, keywords, teamkata
         productAreaID: productAreaID,
         teamID: teamID,
         group: data.group,
-        },
     }
 
-    updateStoryQuery(editStoryData).then(()=>{
+    setLoading(true)
+    updateStory(id, editStoryData).then(()=>{
+      setError(undefined)
       amplitudeLog('skjema fullført', { skjemanavn: 'endre-datafortelling' })
       router.push("/user/stories")
     }).catch(e=>{
+      setError(e)
       console.log(e)
       amplitudeLog('skjemainnsending feilet', {
         skjemanavn: 'endre-datafortelling',
       })
+    }).finally(()=>{
+      setLoading(false)
     })
   }
 
diff --git a/components/stories/newStory.tsx b/components/stories/newStory.tsx
index 75c9b177..53247d16 100644
--- a/components/stories/newStory.tsx
+++ b/components/stories/newStory.tsx
@@ -11,11 +11,12 @@ import * as yup from 'yup';
 import { ChangeEvent, useContext, useRef, useState } from 'react';
 import TagsSelector from '../lib/tagsSelector';
 import { UserState } from '../../lib/context';
-import { CREATE_STORY } from '../../lib/queries/story/createStory';
 import { TreeItem } from '@mui/x-tree-view/TreeItem';
 import { SimpleTreeView } from '@mui/x-tree-view/SimpleTreeView';
 import { FileTextFillIcon, FolderFillIcon, TrashIcon } from '@navikt/aksel-icons';
 import { UploadFile } from '../../lib/schema/graphql';
+import { createStory } from '../../lib/rest/stories';
+import { set } from 'lodash';
 
 const schema = yup.object().shape({
   name: yup.string().nullable().required('Skriv inn navnet på datafortellingen'),
@@ -41,6 +42,7 @@ export const NewStoryForm = () => {
   const [storyFiles, setStoryFiles] = useState<File[]>([]);
   const singleFileInputRef = useRef(null);
   const folderFileInputRef = useRef(null);
+  const [error, setError] = useState<Error | undefined>(undefined);
 
   const handleSingleFileClick = () => {
     /* @ts-expect-error */
@@ -88,13 +90,11 @@ export const NewStoryForm = () => {
   const valueOrNull = (val: string) => (val == '' ? null : val);
 
   const onSubmit = async (data: any) => {
-    const uploadData = {
-      variables: {
-        files: storyFiles.map<UploadFile>(it=>({
+        const files= storyFiles.map<UploadFile>(it=>({
           path: fixRelativePath(it),
           file: it,
-        })),
-        input: {
+        }))
+        const storyInput= {
           name: data.name,
           description: valueOrNull(data.description),
           keywords: data.keywords,
@@ -102,30 +102,22 @@ export const NewStoryForm = () => {
           productAreaID: productAreaID,
           teamID: teamID,
           group: data.group,
-        },
-      },
-      refetchQueries: ['searchContent', 'userInfoDetails'],
-    };
+        }
 
     try {
-      await createStory(uploadData);
+      const data = await createStory(storyInput, files);
+      setError(undefined);
       amplitudeLog('skjema fullført', { skjemanavn: 'ny-datafortelling' });
+      router.push(`/story/${data.id}`);
     } catch (e) {
+      setError(e as Error);
       amplitudeLog('skjemainnsending feilet', {
         skjemanavn: 'ny-datafortelling',
       })
       console.log(e)
     }
   }
-
-  const [createStory, { loading, error: backendError }] = useMutation(
-    CREATE_STORY,
-    {
-      onCompleted: (data) => {
-        router.push(`/story/${data.createStory.id}`);
-      },
-    },
-  )
+  
 
   const onCancel = () => {
     amplitudeLog(
@@ -316,7 +308,7 @@ export const NewStoryForm = () => {
             {renderTree(generateFileTree(storyFiles))}
           </SimpleTreeView>
         )}
-        {backendError && <ErrorMessage error={backendError} />}
+        {error && <ErrorMessage error={error} />}
         <div className="flex flex-row gap-4 mb-16">
           <Button type="button" variant="secondary" onClick={onCancel}>
             Avbryt
diff --git a/lib/queries/story/createStory.ts b/lib/queries/story/createStory.ts
deleted file mode 100644
index bee02c55..00000000
--- a/lib/queries/story/createStory.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const CREATE_STORY = gql`
-  mutation createStory($files: [UploadFile!]!, $input: NewStory!) {
-    createStory(files: $files, input: $input) {
-      id
-    }
-  }
-`
diff --git a/lib/queries/story/deleteInsightProduct.ts b/lib/queries/story/deleteInsightProduct.ts
deleted file mode 100644
index e50461c1..00000000
--- a/lib/queries/story/deleteInsightProduct.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import gql from "graphql-tag";
-
-export const DELETE_INSIGHT_PRODUCT = gql`
-  mutation deleteInsightProduct($id: ID!) {
-    deleteInsightProduct(id: $id)
-  }
-`
\ No newline at end of file
diff --git a/lib/queries/story/deleteStory.ts b/lib/queries/story/deleteStory.ts
deleted file mode 100644
index ca68421c..00000000
--- a/lib/queries/story/deleteStory.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const DELETE_STORY = gql`
-  mutation deleteStory($id: ID!) {
-    deleteStory(id: $id)
-  }
-`
\ No newline at end of file
diff --git a/lib/queries/story/story.ts b/lib/queries/story/story.ts
deleted file mode 100644
index ba225ffd..00000000
--- a/lib/queries/story/story.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const GET_STORY = gql`
-  query dataStory($id: ID!) {
-    dataStory(id: $id) {
-      id
-      name
-      description
-      created
-      lastModified
-      keywords
-      group
-      teamkatalogenURL
-      productAreaID
-      teamID
-    }
-  }
-`
\ No newline at end of file
diff --git a/lib/queries/story/updateStory.ts b/lib/queries/story/updateStory.ts
deleted file mode 100644
index 5eafedf1..00000000
--- a/lib/queries/story/updateStory.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { gql } from 'graphql-tag'
-
-export const UPDATE_STORY_METADATA = gql`
-  mutation updateStoryMetadata(
-    $id: ID!
-    $name: String!
-    $description: String!
-    $keywords: [String!]!
-    $teamkatalogenURL: String
-    $productAreaID: String
-    $teamID: String
-    $group: String!
-  ) {
-    updateStoryMetadata(
-      id: $id
-      name: $name
-      description: $description
-      keywords: $keywords
-      teamkatalogenURL: $teamkatalogenURL
-      productAreaID: $productAreaID
-      teamID: $teamID
-      group: $group
-    ) {
-      id
-    }
-  }
-`
\ No newline at end of file
diff --git a/lib/rest/insightProducts.ts b/lib/rest/insightProducts.ts
index 7c5506c9..7ffdd134 100644
--- a/lib/rest/insightProducts.ts
+++ b/lib/rest/insightProducts.ts
@@ -1,5 +1,5 @@
 import { useEffect, useState } from "react"
-import { createInsightProductUrl, fetchTemplate, getInsightProductUrl, postTemplate, putTemplate, updateInsightProductUrl } from "./restApi"
+import { createInsightProductUrl, deleteTemplate, fetchTemplate, getInsightProductUrl, postTemplate, putTemplate, updateInsightProductUrl } from "./restApi"
 
 const getInsightProduct = async (id: string) => {
     const url = getInsightProductUrl(id)
@@ -39,4 +39,9 @@ export const createInsightProduct = async (insp: any) => {
 export const updateInsightProduct = async (id: string, insp: any) => {
     const url = updateInsightProductUrl(id)
     return putTemplate(url, insp).then((res)=>res.json())
+}
+
+export const deleteInsightProduct= async (id: string) => {
+    const url = updateInsightProductUrl(id)
+    return deleteTemplate(url).then((res)=>res.json())
 }
\ No newline at end of file
diff --git a/lib/rest/restApi.ts b/lib/rest/restApi.ts
index 91a3a196..b2671485 100644
--- a/lib/rest/restApi.ts
+++ b/lib/rest/restApi.ts
@@ -21,6 +21,10 @@ export const deleteDatasetUrl = (id: string) => `${apiUrl()}/datasets/${id}`
 export const updateDatasetUrl = (id: string) => `${apiUrl()}/datasets/${id}`
 export const getAccessiblePseudoDatasetsUrl = () => `${apiUrl()}/datasets/pseudo/accessible`
 
+export const createStoryUrl = () => `${apiUrl()}/stories/new`
+export const updateStoryUrl = (id: string) => `${apiUrl()}/stories/${id}`
+export const deleteStoryUrl = (id: string) => `${apiUrl()}/stories/${id}`
+
 export const getProductAreasUrl = () => `${apiUrl()}/productareas`
 export const getProductAreaUrl = (id: string) => `${apiUrl()}/productareas/${id}`
 export const fetchUserDataUrl = () => `${apiUrl()}/userData`
@@ -28,6 +32,7 @@ export const fetchUserDataUrl = () => `${apiUrl()}/userData`
 export const getInsightProductUrl = (id: string) => `${apiUrl()}/insightProducts/${id}`
 export const createInsightProductUrl = () => `${apiUrl()}/insightProducts/new`
 export const updateInsightProductUrl = (id: string) => `${apiUrl()}/insightProducts/${id}`
+export const deleteInsightProductUrl = (id: string) => `${apiUrl()}/insightProducts/${id}`
 
 export const fetchKeywordsUrl = () => `${apiUrl()}/keywords`
 export const updateKeywordsUrl = () => `${apiUrl()}/keywords`
diff --git a/lib/rest/stories.ts b/lib/rest/stories.ts
new file mode 100644
index 00000000..60287b8c
--- /dev/null
+++ b/lib/rest/stories.ts
@@ -0,0 +1,21 @@
+import { th } from "date-fns/locale"
+import { createStoryUrl, deleteTemplate, postTemplate, putTemplate, updateStoryUrl } from "./restApi"
+import { isThenable } from "next/dist/client/components/router-reducer/router-reducer-types"
+
+export const createStory = (newStory: any, files: any[]) => {
+    const formData = new FormData()
+    files.forEach((file, idx) => {
+        formData.append(`files[${idx}][path]`, file.path)
+        formData.append(`files[${idx}[file]`, file.file)
+    })
+    formData.append('story', JSON.stringify(newStory))
+    return postTemplate(createStoryUrl(), formData).then((res) => res.json())
+}
+
+export const updateStory =(storyId: string, updatedStory: any) => {
+    return putTemplate(updateStoryUrl(storyId), updatedStory).then((res) => res.json())
+}
+
+export const deleteStory = (storyId: string) => {
+    return deleteTemplate(updateStoryUrl(storyId), {isDeleted: true}).then((res) => res.json())
+}
\ No newline at end of file
diff --git a/lib/schema/graphql.ts b/lib/schema/graphql.ts
index b7bc8e47..c5dbd66b 100644
--- a/lib/schema/graphql.ts
+++ b/lib/schema/graphql.ts
@@ -1206,49 +1206,6 @@ export type SlackQueryVariables = Exact<{
 
 export type SlackQuery = { __typename?: 'Query', IsValidSlackChannel: boolean };
 
-export type CreateStoryMutationVariables = Exact<{
-  files: Array<UploadFile> | UploadFile;
-  input: NewStory;
-}>;
-
-
-export type CreateStoryMutation = { __typename?: 'Mutation', createStory: { __typename?: 'Story', id: string } };
-
-export type DeleteInsightProductMutationVariables = Exact<{
-  id: Scalars['ID']['input'];
-}>;
-
-
-export type DeleteInsightProductMutation = { __typename?: 'Mutation', deleteInsightProduct: boolean };
-
-export type DeleteStoryMutationVariables = Exact<{
-  id: Scalars['ID']['input'];
-}>;
-
-
-export type DeleteStoryMutation = { __typename?: 'Mutation', deleteStory: boolean };
-
-export type DataStoryQueryVariables = Exact<{
-  id: Scalars['ID']['input'];
-}>;
-
-
-export type DataStoryQuery = { __typename?: 'Query', dataStory: { __typename?: 'Story', id: string, name: string, description: string, created: any, lastModified?: any | null, keywords: Array<string>, group: string, teamkatalogenURL?: string | null, productAreaID?: string | null, teamID?: string | null } };
-
-export type UpdateStoryMetadataMutationVariables = Exact<{
-  id: Scalars['ID']['input'];
-  name: Scalars['String']['input'];
-  description: Scalars['String']['input'];
-  keywords: Array<Scalars['String']['input']> | Scalars['String']['input'];
-  teamkatalogenURL?: InputMaybe<Scalars['String']['input']>;
-  productAreaID?: InputMaybe<Scalars['String']['input']>;
-  teamID?: InputMaybe<Scalars['String']['input']>;
-  group: Scalars['String']['input'];
-}>;
-
-
-export type UpdateStoryMetadataMutation = { __typename?: 'Mutation', updateStoryMetadata: { __typename?: 'Story', id: string } };
-
 export type UserInfoAccessableDataproductQueryVariables = Exact<{ [key: string]: never; }>;
 
 
@@ -1413,200 +1370,6 @@ export type SlackQueryHookResult = ReturnType<typeof useSlackQuery>;
 export type SlackLazyQueryHookResult = ReturnType<typeof useSlackLazyQuery>;
 export type SlackSuspenseQueryHookResult = ReturnType<typeof useSlackSuspenseQuery>;
 export type SlackQueryResult = Apollo.QueryResult<SlackQuery, SlackQueryVariables>;
-export const CreateStoryDocument = gql`
-    mutation createStory($files: [UploadFile!]!, $input: NewStory!) {
-  createStory(files: $files, input: $input) {
-    id
-  }
-}
-    `;
-export type CreateStoryMutationFn = Apollo.MutationFunction<CreateStoryMutation, CreateStoryMutationVariables>;
-
-/**
- * __useCreateStoryMutation__
- *
- * To run a mutation, you first call `useCreateStoryMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useCreateStoryMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [createStoryMutation, { data, loading, error }] = useCreateStoryMutation({
- *   variables: {
- *      files: // value for 'files'
- *      input: // value for 'input'
- *   },
- * });
- */
-export function useCreateStoryMutation(baseOptions?: Apollo.MutationHookOptions<CreateStoryMutation, CreateStoryMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<CreateStoryMutation, CreateStoryMutationVariables>(CreateStoryDocument, options);
-      }
-export type CreateStoryMutationHookResult = ReturnType<typeof useCreateStoryMutation>;
-export type CreateStoryMutationResult = Apollo.MutationResult<CreateStoryMutation>;
-export type CreateStoryMutationOptions = Apollo.BaseMutationOptions<CreateStoryMutation, CreateStoryMutationVariables>;
-export const DeleteInsightProductDocument = gql`
-    mutation deleteInsightProduct($id: ID!) {
-  deleteInsightProduct(id: $id)
-}
-    `;
-export type DeleteInsightProductMutationFn = Apollo.MutationFunction<DeleteInsightProductMutation, DeleteInsightProductMutationVariables>;
-
-/**
- * __useDeleteInsightProductMutation__
- *
- * To run a mutation, you first call `useDeleteInsightProductMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useDeleteInsightProductMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [deleteInsightProductMutation, { data, loading, error }] = useDeleteInsightProductMutation({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useDeleteInsightProductMutation(baseOptions?: Apollo.MutationHookOptions<DeleteInsightProductMutation, DeleteInsightProductMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<DeleteInsightProductMutation, DeleteInsightProductMutationVariables>(DeleteInsightProductDocument, options);
-      }
-export type DeleteInsightProductMutationHookResult = ReturnType<typeof useDeleteInsightProductMutation>;
-export type DeleteInsightProductMutationResult = Apollo.MutationResult<DeleteInsightProductMutation>;
-export type DeleteInsightProductMutationOptions = Apollo.BaseMutationOptions<DeleteInsightProductMutation, DeleteInsightProductMutationVariables>;
-export const DeleteStoryDocument = gql`
-    mutation deleteStory($id: ID!) {
-  deleteStory(id: $id)
-}
-    `;
-export type DeleteStoryMutationFn = Apollo.MutationFunction<DeleteStoryMutation, DeleteStoryMutationVariables>;
-
-/**
- * __useDeleteStoryMutation__
- *
- * To run a mutation, you first call `useDeleteStoryMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useDeleteStoryMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [deleteStoryMutation, { data, loading, error }] = useDeleteStoryMutation({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useDeleteStoryMutation(baseOptions?: Apollo.MutationHookOptions<DeleteStoryMutation, DeleteStoryMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<DeleteStoryMutation, DeleteStoryMutationVariables>(DeleteStoryDocument, options);
-      }
-export type DeleteStoryMutationHookResult = ReturnType<typeof useDeleteStoryMutation>;
-export type DeleteStoryMutationResult = Apollo.MutationResult<DeleteStoryMutation>;
-export type DeleteStoryMutationOptions = Apollo.BaseMutationOptions<DeleteStoryMutation, DeleteStoryMutationVariables>;
-export const DataStoryDocument = gql`
-    query dataStory($id: ID!) {
-  dataStory(id: $id) {
-    id
-    name
-    description
-    created
-    lastModified
-    keywords
-    group
-    teamkatalogenURL
-    productAreaID
-    teamID
-  }
-}
-    `;
-
-/**
- * __useDataStoryQuery__
- *
- * To run a query within a React component, call `useDataStoryQuery` and pass it any options that fit your needs.
- * When your component renders, `useDataStoryQuery` returns an object from Apollo Client that contains loading, error, and data properties
- * you can use to render your UI.
- *
- * @param baseOptions options that will be passed into the query, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options;
- *
- * @example
- * const { data, loading, error } = useDataStoryQuery({
- *   variables: {
- *      id: // value for 'id'
- *   },
- * });
- */
-export function useDataStoryQuery(baseOptions: Apollo.QueryHookOptions<DataStoryQuery, DataStoryQueryVariables> & ({ variables: DataStoryQueryVariables; skip?: boolean; } | { skip: boolean; }) ) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useQuery<DataStoryQuery, DataStoryQueryVariables>(DataStoryDocument, options);
-      }
-export function useDataStoryLazyQuery(baseOptions?: Apollo.LazyQueryHookOptions<DataStoryQuery, DataStoryQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useLazyQuery<DataStoryQuery, DataStoryQueryVariables>(DataStoryDocument, options);
-        }
-export function useDataStorySuspenseQuery(baseOptions?: Apollo.SuspenseQueryHookOptions<DataStoryQuery, DataStoryQueryVariables>) {
-          const options = {...defaultOptions, ...baseOptions}
-          return Apollo.useSuspenseQuery<DataStoryQuery, DataStoryQueryVariables>(DataStoryDocument, options);
-        }
-export type DataStoryQueryHookResult = ReturnType<typeof useDataStoryQuery>;
-export type DataStoryLazyQueryHookResult = ReturnType<typeof useDataStoryLazyQuery>;
-export type DataStorySuspenseQueryHookResult = ReturnType<typeof useDataStorySuspenseQuery>;
-export type DataStoryQueryResult = Apollo.QueryResult<DataStoryQuery, DataStoryQueryVariables>;
-export const UpdateStoryMetadataDocument = gql`
-    mutation updateStoryMetadata($id: ID!, $name: String!, $description: String!, $keywords: [String!]!, $teamkatalogenURL: String, $productAreaID: String, $teamID: String, $group: String!) {
-  updateStoryMetadata(
-    id: $id
-    name: $name
-    description: $description
-    keywords: $keywords
-    teamkatalogenURL: $teamkatalogenURL
-    productAreaID: $productAreaID
-    teamID: $teamID
-    group: $group
-  ) {
-    id
-  }
-}
-    `;
-export type UpdateStoryMetadataMutationFn = Apollo.MutationFunction<UpdateStoryMetadataMutation, UpdateStoryMetadataMutationVariables>;
-
-/**
- * __useUpdateStoryMetadataMutation__
- *
- * To run a mutation, you first call `useUpdateStoryMetadataMutation` within a React component and pass it any options that fit your needs.
- * When your component renders, `useUpdateStoryMetadataMutation` returns a tuple that includes:
- * - A mutate function that you can call at any time to execute the mutation
- * - An object with fields that represent the current status of the mutation's execution
- *
- * @param baseOptions options that will be passed into the mutation, supported options are listed on: https://www.apollographql.com/docs/react/api/react-hooks/#options-2;
- *
- * @example
- * const [updateStoryMetadataMutation, { data, loading, error }] = useUpdateStoryMetadataMutation({
- *   variables: {
- *      id: // value for 'id'
- *      name: // value for 'name'
- *      description: // value for 'description'
- *      keywords: // value for 'keywords'
- *      teamkatalogenURL: // value for 'teamkatalogenURL'
- *      productAreaID: // value for 'productAreaID'
- *      teamID: // value for 'teamID'
- *      group: // value for 'group'
- *   },
- * });
- */
-export function useUpdateStoryMetadataMutation(baseOptions?: Apollo.MutationHookOptions<UpdateStoryMetadataMutation, UpdateStoryMetadataMutationVariables>) {
-        const options = {...defaultOptions, ...baseOptions}
-        return Apollo.useMutation<UpdateStoryMetadataMutation, UpdateStoryMetadataMutationVariables>(UpdateStoryMetadataDocument, options);
-      }
-export type UpdateStoryMetadataMutationHookResult = ReturnType<typeof useUpdateStoryMetadataMutation>;
-export type UpdateStoryMetadataMutationResult = Apollo.MutationResult<UpdateStoryMetadataMutation>;
-export type UpdateStoryMetadataMutationOptions = Apollo.BaseMutationOptions<UpdateStoryMetadataMutation, UpdateStoryMetadataMutationVariables>;
 export const UserInfoAccessableDataproductDocument = gql`
     query userInfoAccessableDataproduct {
   userInfo {