diff --git a/README.md b/README.md index 1435ad7..a943a5d 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ -# browserstack-demo-app -A shopping application to demonstrate real-world usage of BrowserStack testing methods, patterns, and workflows. +# Shopflow-demo-app +A shopping application to demonstrate real-world usage of Shopflow testing methods, patterns, and workflows. ## Features 🛠 Built with [React](https://reactjs.org/), [Next](https://nextjs.org/) @@ -10,7 +10,7 @@ A shopping application to demonstrate real-world usage of BrowserStack testing m ## Getting Started -BrowserStack Demo App is a full-stack Next/React application. +Shopflow Demo App is a full-stack Next/React application. The app is bundled with [offers data](./src/constants/offers.json), [orders data](./src/constants/orders.json) and [products data](./src/constants/products.json) that contains everything you need to start using the app and run tests out-of-the-box. diff --git a/next.config.js b/next.config.js index 9e983f0..a3f8fc3 100644 --- a/next.config.js +++ b/next.config.js @@ -1,13 +1,7 @@ const optimizedImages = require('next-optimized-images'); -const withStyles = require('@webdeb/next-styles') const withPlugins = require('next-compose-plugins'); const webpack = require('webpack'); -const sassConfig = { - sass: true, // use .scss files - modules: true // style.(m|module).css & style.(m|module).scss for module files -} - const optimizedImagesConfig = { inlineImageLimit: 8192, imagesFolder: 'images', @@ -45,6 +39,5 @@ const nextConfiguration = { }; module.exports = withPlugins([ - [withStyles, sassConfig], [optimizedImages, optimizedImagesConfig], ], nextConfiguration); diff --git a/package.json b/package.json index 91d3d64..9a9b43c 100644 --- a/package.json +++ b/package.json @@ -3,15 +3,13 @@ "version": "0.1.0", "private": true, "scripts": { - "dev": "next dev", - "build": "next build", - "start": "next start" + "dev": "NODE_OPTIONS=--openssl-legacy-provider next dev", + "build": "NODE_OPTIONS=--openssl-legacy-provider next build", + "start": "NODE_OPTIONS=--openssl-legacy-provider next start" }, "dependencies": { - "@material-ui/core": "^4.11.0", - "@material-ui/icons": "^4.9.1", - "@webdeb/next-styles": "^1.1.1", - "@zeit/next-sass": "^1.0.1", + "@material-ui/core": "^4.11.0", + "@material-ui/icons": "^4.9.1", "autoprefixer": "^10.0.2", "axios": "^0.18.0", "concurrently": "^4.0.1", @@ -28,6 +26,7 @@ "postcss-import": "^13.0.0", "postcss-preset-env": "^6.7.0", "prop-types": "15.7.2", + "sass": "^1.29.0", "react": "17.0.1", "react-device-detect": "^1.14.0", "react-dom": "17.0.1", @@ -35,7 +34,6 @@ "react-select": "^3.1.1", "redux": "^4.0.1", "redux-thunk": "^2.3.0", - "sass": "^1.29.0", "store2": "^2.12.0", "swagger-ui-react": "^3.52.3", "tailwindcss": "^1.9.6", diff --git a/pages/_app.js b/pages/_app.js index 5487f09..861efc9 100644 --- a/pages/_app.js +++ b/pages/_app.js @@ -1,6 +1,16 @@ import { useEffect } from "react"; import Root from "../src/Root"; import "../styles/globals.scss"; +import "./style.scss"; +// Component-level global styles (Next.js requires global styles to be imported from _app.js) +import "../src/components/Footer/style.scss"; +import "../src/components/Spinner/style.scss"; +import "../src/components/Header/style.scss"; +import "../src/components/Newsletter/style.scss"; +import "../src/components/Shelf/style.scss"; +import "../src/components/Shelf/Filter/style.scss"; +import "../src/components/Clearfix/style.scss"; +import "../src/components/FloatChart/style.scss"; function MyApp({ Component, pageProps }) { return ( diff --git a/pages/api/doc.js b/pages/api/doc.js index a839a6b..bf8b0d9 100644 --- a/pages/api/doc.js +++ b/pages/api/doc.js @@ -2,7 +2,7 @@ import { withSwagger } from 'next-swagger-doc'; const swaggerHandler = withSwagger({ openApiVersion: '3.0.0', - title: 'BrowserStack Demo API', + title: 'Shopflow Demo API', version: '1.0.0', apiFolder: 'pages/api', diff --git a/pages/checkout/index.jsx b/pages/checkout/index.jsx index c9afd53..30f2d59 100644 --- a/pages/checkout/index.jsx +++ b/pages/checkout/index.jsx @@ -7,7 +7,7 @@ import Router from 'next/router'; import axios from '../../src/services/axios'; import { emptyCart } from '../../src/services/cart/actions'; import { resetCartTotal } from '../../src/services/total/actions'; -import './style.scss'; + const CheckOut = ({ cartTotal, cartProducts, emptyCart, resetCartTotal }) => { let userName = store2.session.get('username'); @@ -68,7 +68,7 @@ const CheckOut = ({ cartTotal, cartProducts, emptyCart, resetCartTotal }) => { return ( <> - StackDemo + ShopFlowDemo @@ -76,7 +76,7 @@ const CheckOut = ({ cartTotal, cartProducts, emptyCart, resetCartTotal }) => {

- StackDemo + ShopFlowDemo

diff --git a/pages/confirmation/index.jsx b/pages/confirmation/index.jsx index 6b69b86..81c7335 100644 --- a/pages/confirmation/index.jsx +++ b/pages/confirmation/index.jsx @@ -27,7 +27,7 @@ const CheckOut = ({ cartTotal }) => { function generatePDF() { const doc = new jsPDF() - doc.text('BrowserStack Demo', 14, 20) + doc.text('Shopflow Demo', 14, 20) doc.autoTable({ head: [['Brand', 'Type', 'Quantity', 'Price']], body: @@ -48,7 +48,7 @@ const CheckOut = ({ cartTotal }) => { return ( <> - StackDemo + ShopFlowDemo @@ -56,7 +56,7 @@ const CheckOut = ({ cartTotal }) => {

- StackDemo + ShopFlowDemo

diff --git a/pages/favourites/index.jsx b/pages/favourites/index.jsx index 9c2c75a..bbe8577 100644 --- a/pages/favourites/index.jsx +++ b/pages/favourites/index.jsx @@ -22,7 +22,7 @@ const Favourites = () => { return (
- StackDemo + ShopFlowDemo diff --git a/pages/index.jsx b/pages/index.jsx index 16b9575..8d5c4d0 100644 --- a/pages/index.jsx +++ b/pages/index.jsx @@ -1,15 +1,14 @@ import Head from 'next/head'; import App from '../src/components/App'; -import './style.scss'; export default function Home() { return (
- StackDemo - + ShopFlowDemo + - +