webpack-bootstrap-ui-kit/src/mocks/handlers.js

95 lines
8.4 KiB
JavaScript

// src/mocks/handlers.js
import { graphql } from 'msw'
export const handlers = [
// Handles a "Login" mutation
/* graphql.mutation('Login', (req, res, ctx) => {
const { username } = req.variables;
sessionStorage.setItem('is-authenticated', username);
return res(
ctx.data({
login: {
username,
},
}),
);
}), */
// Handles a "Pages" query
graphql.query('Pages11', (req, res, ctx) => {
const apiKey = req.headers.map.apikey
if (
!req.headers.map.apikey ||
req.headers.map.apikey !== `${GRAPHQL_API_KEY}`
) {
// When not authenticated, respond with an error
return res(
ctx.errors([
{
message: 'Not authenticated',
errorType: 'AuthenticationError',
},
])
)
}
// When authenticated, respond with a query payload
return res(
ctx.data({
readPages: {
edges: [
{
node: {
ID: '1',
Title: 'Home-Mocked',
ClassName: 'Site\\Pages\\HomePage',
CSSClass: 'Site-Pages-HomePage',
Summary:
"That's my personal website, I'm full-stack developer mostly specializing on SilverStipe backend projects and share some of my hobbies at this website.",
Link: '/en/',
URLSegment: 'home',
Elements: {
edges: [
{
node: {
ID: '3',
Title: 'Slider',
Render:
'<div\nid="e3"\nclass="element site__elements__sliderelement\n\t\n\t"\n>\n\t<div class="element-container container">\n\t\t\n\n\n <div id="Carousel3" class="carousel slide js-carousel">\n <div class="carousel-inner">\n \n <div class="carousel-item carousel-item-Video carousel-item-nocontrols active">\n <div class="carousel-slide">\n \n \n <div class="video">\n <iframe width="200" height="113" src="https://www.youtube.com/embed/IF1F_es1SaU?feature=oembed&wmode=transparent&enablejsapi=1&disablekb=1&iv_load_policy=3&modestbranding=1&rel=0&showinfo=0&autoplay=1&mute=1&loop=1&playlist=IF1F_es1SaU" allow="autoplay" allow="autoplay" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>\n </div>\n \n\n\n\n\n </div>\n </div>\n \n </div>\n </div>\n\n\n\t</div>\n</div>\n',
},
},
{
node: {
ID: '7',
Title: 'Categories List',
Render:
'<div\nid="e7"\nclass="element dnadesign__elementallist__model__elementlist\n\t\n\t"\n>\n\t<div class="element-container container">\n\t\t\n<div class="list-element__container row" data-listelement-count="3">\n \n \n\t <div\nid="e9"\nclass="element dynamic__elements__image__elements__elementimage\n\t\n\t col-block col-md"\n>\n\t<div class="element-container">\n\t\t\n <div class="image-element__image height400 width400">\n <img\n src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"\n data-lazy-src="/assets/Uploads/ElementImage/1609765749853__FillWzQwMCw0MDBd.jpg" class="img-responsive" alt="Aquascaping"\n />\n </div>\n\n\n\n<div class="image-element__caption img-content">\n <h3 class="image-element__title title">Aquascaping</h3>\n\n \n</div>\n\n\n\n <a href="/en/aquascaping/" class="stretched-link">\n <b class="sr-only">Aquascaping</b>\n </a>\n\n\n\t</div>\n</div>\n\n \n\t <div\nid="e10"\nclass="element dynamic__elements__image__elements__elementimage\n\t\n\t col-block col-md"\n>\n\t<div class="element-container">\n\t\t\n <div class="image-element__image height400 width400">\n <img\n src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"\n data-lazy-src="/assets/Uploads/ElementImage/1609766816754__FillWzQwMCw0MDBd.jpg" class="img-responsive" alt="Car Projects"\n />\n </div>\n\n\n\n<div class="image-element__caption img-content">\n <h3 class="image-element__title title">Car Projects</h3>\n\n \n</div>\n\n\n\n <a href="/en/car/" class="stretched-link">\n <b class="sr-only">Car Projects</b>\n </a>\n\n\n\t</div>\n</div>\n\n \n\t <div\nid="e12"\nclass="element dynamic__elements__image__elements__elementimage\n\t\n\t col-block col-md"\n>\n\t<div class="element-container">\n\t\t\n <div class="image-element__image height400 width400">\n <img\n src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"\n data-lazy-src="/assets/Uploads/ElementImage/Screenshot-from-2021-01-04-20-30-19__FillWzQwMCw0MDBd.png" class="img-responsive" alt="Programming"\n />\n </div>\n\n\n\n<div class="image-element__caption img-content">\n <h3 class="image-element__title title">Programming</h3>\n\n \n</div>\n\n\n\n <a href="/en/development/" class="stretched-link">\n <b class="sr-only">Programming</b>\n </a>\n\n\n\t</div>\n</div>\n\n \n\n\n</div>\n\n\t</div>\n</div>\n',
},
},
{
node: {
ID: '4',
Title: "Hello, I'm Tony Air",
Render:
'<div\nid="e4"\nclass="element dnadesign__elemental__models__elementcontent\n\t\n\t"\n>\n\t<div class="element-container container">\n\t\t<div\nclass="content-element__content"\n>\n \n\t\n <h2 class="content-element__title">Hello, I'm Tony Air</h2>\n \n\n <div class="typography">\n <p>That's my personal website, I'm full-stack developer mostly specializing on SilverStipe backend projects and share some of my hobbies at this website.<br><br>As for the things I do for work:<br><br>Here's front-end UI kit: <a rel="noopener" href="https://github.com/a2nt/webpack-bootstrap-ui-kit" target="_blank">https://github.com/a2nt/webpack-bootstrap-ui-kit</a><br>Here's SilverStipe quick start template: <a rel="noopener" href="https://github.com/a2nt/silverstripe-webpack" target="_blank">https://github.com/a2nt/silverstripe-webpack</a><br><br>More at my github: <a rel="noopener" href="https://github.com/a2nt" target="_blank">https://github.com/a2nt</a></p>\n </div>\n\n \n</div>\n\n\t</div>\n</div>\n',
},
},
],
pageInfo: {
hasNextPage: false,
hasPreviousPage: false,
totalCount: 3,
},
},
},
},
],
pageInfo: {
hasNextPage: false,
hasPreviousPage: false,
totalCount: 1,
},
},
})
)
}),
]