Graphql erabiltzen du (#5)

* feat: graphql erabiltzen du

* node bertsioa jeisten du

* feat: netlify deployments sartzen du

* feat: token-a sortzen du

* chore: Gatsbyren aldagaiak berreskuratzen ditu

* fix: query-a konpontzen du

.nvmrc

@@ -1 +1 @@
-v16
+v14

back/.env.example

@@ -1,3 +1,4 @@
 HOST=0.0.0.0
 PORT=1337
 DATABASE_FILENAME=database/migrations/development.db
+NETLIFY_DEPLOYMENTS_PLUGIN_ACCESS_TOKEN="<netlify access token>"

back/config/plugins.js

@@ -0,0 +1,29 @@
+module.exports = {
+  graphql: {
+    config: {
+      endpoint: "/graphql",
+      shadowCRUD: true,
+      playgroundAlways: false,
+      depthLimit: 7,
+      amountLimit: 100,
+      apolloServer: {
+        introspection: true,
+      },
+    },
+  },
+  "netlify-deployments": {
+    enabled: true,
+    config: {
+      accessToken: process.env.NETLIFY_DEPLOYMENTS_PLUGIN_ACCESS_TOKEN,
+      sites: [
+        {
+          name: "laba-webgunea",
+          id: "3e9ed70d-2f4b-4152-9aaf-1129570d01b4",
+          buildHook:
+            "https://api.netlify.com/build_hooks/61e338c09f4ef3bf644f86db",
+          branch: "main", // optional
+        },
+      ],
+    },
+  },
+};

back/package.json

@@ -9,14 +9,15 @@
     "build": "strapi build",
     "strapi": "strapi"
   },
-  "devDependencies": {},
   "dependencies": {
+    "@strapi/plugin-graphql": "^4.11.2",
     "@strapi/plugin-i18n": "4.11.2",
     "@strapi/plugin-users-permissions": "4.11.2",
     "@strapi/strapi": "4.11.2",
     "pg": "^8.11.0",
     "pg-connection-string": "^2.6.0",
-    "sqlite3": "5.1.6"
+    "sqlite3": "5.1.6",
+    "strapi-plugin-netlify-deployments": "^2.0.0"
   },
   "author": {
     "name": "Laba Sarea"

front/gatsby-config.js

@@ -2,43 +2,6 @@ require('dotenv').config({
   path: `.env.${process.env.NODE_ENV}`,
 });
 
-const qs = require('qs');
-const query = qs.stringify(
-  {
-    populate: {
-      edariBeroak: {
-        populate: ['alergenoak'],
-      },
-      infusioEkologikoak: {
-        populate: ['alergenoak'],
-      },
-      edariHotzak: {
-        populate: ['alergenoak'],
-      },
-      pikatzekoak: {
-        populate: ['alergenoak'],
-      },
-      gozoak: {
-        populate: ['alergenoak'],
-      },
-      anizkoJogurta: {
-        populate: ['alergenoak'],
-      },
-      tostadak: {
-        populate: ['alergenoak'],
-      },
-      konboak: {
-        populate: ['alergenoak'],
-      },
-    },
-  },
-  {
-    encodeValuesOnly: true,
-  },
-);
-
-const apiUrl = process.env.API_URL || 'http://localhost:1337/api';
-
 module.exports = {
   plugins: [
     'gatsby-plugin-react-helmet',
@@ -50,35 +13,28 @@ module.exports = {
       },
     },
     {
-      resolve: 'gatsby-source-custom-api',
+      resolve: 'gatsby-source-strapi-graphql',
       options: {
-        rootKey: 'kafetegia',
+        apiURL: 'http://localhost:1337',
-        url: `${apiUrl}/kafetegia?${query}`,
+        collectionTypes: [],
-      },
-    },
-    {
-      resolve: 'gatsby-source-strapi',
-      options: {
-        apiURL: apiUrl,
         singleTypes: [
           'hasiera',
-          {
+          'kafetegia',
-            name: 'kafetegia',
-            queryParams: {
-              populate: '*',
-            },
-          },
           'lege-oharra',
           'pribatutasun-politika',
         ],
-        queryLimit: 1000,
+        contentTypes: [],
+        // Enable/disable cache.
+        cache: false,
+        token:
+          '307442ef6911b9692d6946bf6aac5d910795b56d92063e8a58ace14e31c8ac6ad7b64480ba591689abbad02758da9562e423e1ef1af8b9f303612ffb63f94f567060ea9f690d9d14bce676bdcf985a2a8c95643963ffd6f593490bb4b4ccae51572cbf315e7c823d0f368de2fe113b113986e9943df1a81e6e4228b82cc7cead',
       },
     },
     'gatsby-transformer-sharp',
     'gatsby-plugin-sharp',
     'gatsby-plugin-styled-components',
     {
-      resolve: `gatsby-plugin-manifest`,
+      resolve: 'gatsby-plugin-manifest',
       options: {
         name: 'Laba',
         short_name: 'Laba',
@@ -90,7 +46,6 @@ module.exports = {
       },
     },
     'gatsby-plugin-offline',
-    // 'gatsby-plugin-sitemap',
     {
       resolve: 'gatsby-plugin-react-svg',
       options: {
@@ -100,7 +55,7 @@ module.exports = {
       },
     },
     {
-      resolve: `gatsby-plugin-webfonts`,
+      resolve: 'gatsby-plugin-webfonts',
       options: {
         fonts: {
           google: [

front/package.json

@@ -30,9 +30,8 @@
     "gatsby-plugin-sitemap": "^5.5.0",
     "gatsby-plugin-styled-components": "^5.5.0",
     "gatsby-plugin-webfonts": "^2.2.1",
-    "gatsby-source-custom-api": "^2.3.5",
     "gatsby-source-filesystem": "^4.5.1",
-    "gatsby-source-strapi": "^1.0.2",
+    "gatsby-source-strapi-graphql": "^4.6.2",
     "gatsby-transformer-sharp": "^4.5.0",
     "polished": "^4.1.3",
     "raw-loader": "^4.0.2",

front/src/pages/index.tsx

@@ -14,49 +14,38 @@ import { Oina } from '../components/Oina';
 
 interface DataProps {
   strapiHasiera: {
-    data: {
-      attributes: {
     deskribapena: string;
     izenburua: string;
     bazkidetza: string;
   };
-    };
-  };
 }
 
 const IndexPage: React.VFC<PageProps> = () => {
   const { strapiHasiera } = useStaticQuery<DataProps>(graphql`
     {
       strapiHasiera {
-        data {
-          attributes {
         deskribapena
         izenburua
         bazkidetza
       }
     }
-      }
-    }
   `);
 
   return (
     <>
       <Helmet
-        title={`${strapiHasiera.data.attributes.izenburua} | Laba`}
+        title={`${strapiHasiera.izenburua} | Laba`}
         htmlAttributes={{ lang: 'eu' }}
       >
-        <meta
+        <meta name="description" content={strapiHasiera.deskribapena} />
-          name="description"
-          content={strapiHasiera.data.attributes.deskribapena}
-        />
       </Helmet>
 
       <GlobalStyles />
 
       <Gainburua
         atala="hasiera"
-        izenburua={strapiHasiera.data.attributes.izenburua}
+        izenburua={strapiHasiera.izenburua}
-        deskribapena={strapiHasiera.data.attributes.deskribapena}
+        deskribapena={strapiHasiera.deskribapena}
         onClick={() => {
           window.location.replace('/#labazkidetza');
         }}
@@ -64,9 +53,7 @@ const IndexPage: React.VFC<PageProps> = () => {
 
       <ContentWrapper id="labazkidetza">
         <Container>
-          <Deskribapena>
+          <Deskribapena>{strapiHasiera.bazkidetza}</Deskribapena>
-            {strapiHasiera.data.attributes.bazkidetza}
-          </Deskribapena>
 
           <IzanLabaWrapper>
             <Botoia href="https://forms.gle/wV41CVkRX1JtHsAu9">

front/src/pages/lege-oharra.tsx

@@ -13,33 +13,25 @@ import { Oina } from '../components/Oina';
 
 interface DataProps {
   strapiLegeOharra: {
-    data: {
-      attributes: {
     izenburua: string;
     edukia: string;
   };
-    };
-  };
 }
 
 const LegeOharra: React.VFC<PageProps> = () => {
   const { strapiLegeOharra } = useStaticQuery<DataProps>(graphql`
     {
       strapiLegeOharra {
-        data {
-          attributes {
         izenburua
         edukia
       }
     }
-      }
-    }
   `);
 
   return (
     <>
       <Helmet
-        title={`${strapiLegeOharra.data.attributes.izenburua} | Laba`}
+        title={`${strapiLegeOharra.izenburua} | Laba`}
         htmlAttributes={{ lang: 'eu' }}
       />
 
@@ -49,7 +41,7 @@ const LegeOharra: React.VFC<PageProps> = () => {
 
       <Container>
         <Atala>
-          <Edukia>{strapiLegeOharra.data.attributes.edukia}</Edukia>
+          <Edukia>{strapiLegeOharra.edukia}</Edukia>
         </Atala>
       </Container>
 

front/src/pages/pribatutasun-politika.tsx

@@ -14,33 +14,25 @@ import { Oina } from '../components/Oina';
 
 interface DataProps {
   strapiPribatutasunPolitika: {
-    data: {
-      attributes: {
     izenburua: string;
     edukia: string;
   };
-    };
-  };
 }
 
 const PribatutasunPolitika: React.VFC<PageProps> = () => {
   const { strapiPribatutasunPolitika } = useStaticQuery<DataProps>(graphql`
     {
       strapiPribatutasunPolitika {
-        data {
-          attributes {
         izenburua
         edukia
       }
     }
-      }
-    }
   `);
 
   return (
     <>
       <Helmet
-        title={`${strapiPribatutasunPolitika.data.attributes.izenburua} | Laba`}
+        title={`${strapiPribatutasunPolitika.izenburua} | Laba`}
         htmlAttributes={{ lang: 'eu' }}
       />
 
@@ -50,7 +42,7 @@ const PribatutasunPolitika: React.VFC<PageProps> = () => {
 
       <Container>
         <Atala>
-          <Edukia>{strapiPribatutasunPolitika.data.attributes.edukia}</Edukia>
+          <Edukia>{strapiPribatutasunPolitika.edukia}</Edukia>
         </Atala>
       </Container>
 

front/src/viewQueries/useKafetegiaData.ts

@@ -4,9 +4,7 @@ import { produktuaFactory } from '../domain/factories/produktuaFactory';
 import { KafetegiaData } from './KafetegiaData';
 
 interface DataProps {
-  kafetegia: {
+  strapiKafetegia: {
-    data: {
-      attributes: {
     deskribapena: string;
     izenburua: string;
     edariBeroak: ProduktuaDTO[];
@@ -18,15 +16,11 @@ interface DataProps {
     tostadak: ProduktuaDTO[];
     konboak: ProduktuaDTO[];
   };
-    };
-  };
 }
 
 export function useKafetegiaData(): KafetegiaData {
   const {
-    kafetegia: {
+    strapiKafetegia: {
-      data: {
-        attributes: {
       izenburua,
       deskribapena,
       anizkoJogurta,
@@ -38,13 +32,9 @@ export function useKafetegiaData(): KafetegiaData {
       tostadak,
       konboak,
     },
-      },
-    },
   } = useStaticQuery<DataProps>(graphql`
     {
-      kafetegia {
+      strapiKafetegia {
-        data {
-          attributes {
         izenburua
         deskribapena
         anizkoJogurta {
@@ -68,7 +58,6 @@ export function useKafetegiaData(): KafetegiaData {
           ekologikoa
           izena
           prezioa
-              id__normalized
         }
         edariBeroak {
           id
@@ -233,8 +222,6 @@ export function useKafetegiaData(): KafetegiaData {
         }
       }
     }
-      }
-    }
   `);
 
   return {