Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update node version and NPM packages #78

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .nvmrc
Original file line number Diff line number Diff line change
@@ -1 +1 @@
14.15.0
16.17.0
31 changes: 8 additions & 23 deletions next.config.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,5 @@
const withCss = require('@zeit/next-css');
const path = require('path');

const withOffline = require('next-offline');
const withSass = require('@zeit/next-sass');

const workBoxOptions = {
workboxOpts: {
swSrc: 'service-worker.js',
Expand All @@ -14,22 +10,11 @@ const workBoxOptions = {

const backend_hostname = new URL(process.env.NEXT_PUBLIC_WOO_SITE_URL).hostname;

module.exports = withOffline(
withCss(
withSass({
workboxOpts: workBoxOptions.workboxOpts,
generateInDevMode: true,
dontAutoRegisterSw: true,
generateSw: false,
globPatterns: ['static/**/*'],
globDirectory: '.',
target: 'serverless',
images: {
domains: [
backend_hostname,
'https://via.placeholder.com'
],
},
})
)
);
module.exports = {
images: {
domains: [backend_hostname, 'https://via.placeholder.com']
},
sassOptions: {
includePaths: [path.join(__dirname, 'src', 'styles', 'sass')]
}
};
30,882 changes: 23,556 additions & 7,326 deletions package-lock.json

Large diffs are not rendered by default.

65 changes: 32 additions & 33 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -33,42 +33,41 @@
},
"homepage": "https://github.com/rtCamp/wp-decoupled#readme",
"dependencies": {
"@apollo/client": "^3.3.6",
"@zeit/next-css": "^1.0.1",
"cookie-parser": "^1.4.5",
"dompurify": "^2.2.6",
"dotenv": "^8.2.0",
"express": "^4.17.1",
"graphql": "^14.7.0",
"graphql-tag": "^2.11.0",
"idb-keyval": "^3.2.0",
"isomorphic-unfetch": "^3.1.0",
"next": "^10.0.5",
"next-offline": "^4.0.6",
"node-fetch": "^2.6.1",
"@apollo/client": "^3.7.6",
"cookie-parser": "^1.4.6",
"dompurify": "^2.4.3",
"dotenv": "^16.0.3",
"express": "^4.18.2",
"graphql": "^16.6.0",
"graphql-tag": "^2.12.6",
"idb-keyval": "^6.2.0",
"isomorphic-unfetch": "^4.0.2",
"next": "^13.1.6",
"next-offline": "^5.0.5",
"node-fetch": "^3.3.0",
"nprogress": "^0.2.0",
"prop-types": "^15.7.2",
"react": "^17.0.1",
"react-bootstrap": "^1.4.3",
"react-dom": "^17.0.1",
"url-loader": "^2.3.0",
"validator": "^11.1.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-bootstrap": "^2.7.0",
"react-dom": "^18.2.0",
"url-loader": "^4.1.1",
"validator": "^13.9.0",
"woocommerce-api": "^1.5.0"
},
"devDependencies": {
"@zeit/next-sass": "^1.0.1",
"cypress": "^6.3.0",
"eslint": "^7.17.0",
"eslint-config-airbnb": "^18.2.1",
"eslint-config-prettier": "^7.1.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-react": "^7.22.0",
"eslint-plugin-react-hooks": "^4.2.0",
"cypress": "^12.5.1",
"eslint": "^8.33.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-prettier": "^8.6.0",
"eslint-plugin-import": "^2.27.5",
"eslint-plugin-jsx-a11y": "^6.7.1",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-react": "^7.32.2",
"eslint-plugin-react-hooks": "^4.6.0",
"next-compose-plugins": "^2.2.1",
"node-sass": "^4.14.1",
"prettier": "^2.2.1",
"serialize-javascript": "^2.1.2"
"node-sass": "^7.0.3",
"prettier": "^2.8.3",
"sass": "^1.58.0",
"serialize-javascript": "^6.0.1"
}
}
}
6 changes: 6 additions & 0 deletions pages/_app.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import '../src/styles/sass/styles.scss';
import '../src/styles/vendor/bootstrap.min.css';

export default function App({ Component, pageProps }) {
return <Component {...pageProps} />;
}
2 changes: 1 addition & 1 deletion pages/cart.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import Layout from '../src/components/layouts/Layout';
import CartBlocks from '../src/components/cart/cart-page/CartBlocks';
import Layout from '../src/components/layouts/Layout';

const Cart = () => {
return (
Expand Down
25 changes: 13 additions & 12 deletions pages/index.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,12 @@
import Layout from '../src/components/layouts/Layout';
// External.
import Link from 'next/link';

// Internal.
import client from '../src/apollo/ApolloClient';
import AddToCartButton from '../src/components/cart/AddToCartButton';
import Hero from '../src/components/home/Hero';
import Image from '../src/components/Image';
import Layout from '../src/components/layouts/Layout';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Souptik2001 Let's segregate these with comments, Internal dependencies and external dependencies resp. Lets do that where applicable.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@imranhsayed Just to be once confirmed you meant like this right? -

// External.
import Link from 'next/link';

// Internal.
import client from '../src/apollo/ApolloClient';
import AddToCartButton from '../src/components/cart/AddToCartButton';
import Hero from '../src/components/home/Hero';
import Image from '../src/components/Image';
import Layout from '../src/components/layouts/Layout';

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exactly @Souptik2001 Looks more organised.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Resolved.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Souptik2001 When we assign the issue back for review, it's the reviewer who will mark the comments resolved after checking.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Souptik2001 Let's rename the comments to Internal Dependencies and External Dependencies respectively.

import { PRODUCTS_QUERY } from '../src/queries';

const NewProducts = ({ products }) => {
Expand All @@ -19,16 +22,14 @@ const NewProducts = ({ products }) => {
<div className="product-container col-md-3 mb-5" key={item.id}>
{/* @TODO need to get rid of using databseId here. */}
<Link href={`/product/${item.slug}`}>
<a>
<span className="product-link">
<Image
src={item?.image?.sourceUrl}
alt={item?.image?.altText || item?.name}
/>
<h5 className="product-name">{item.name}</h5>
<p className="product-price">{item.price}</p>
</span>
</a>
<span className="product-link">
<Image
src={item?.image?.sourceUrl}
alt={item?.image?.altText || item?.name}
/>
<h5 className="product-name">{item.name}</h5>
<p className="product-price">{item.price}</p>
</span>
</Link>
<AddToCartButton product={item} />
</div>
Expand Down Expand Up @@ -67,6 +68,6 @@ export async function getStaticProps() {
},
revalidate: 1
};
};
}

export default Index;
48 changes: 23 additions & 25 deletions pages/login.js
Original file line number Diff line number Diff line change
@@ -1,15 +1,18 @@
import Layout from '../src/components/layouts/Layout';
// External.
import { useMutation } from '@apollo/client';
import Link from 'next/link';
import Router from 'next/router';
import { useState } from 'react';

// Internal.
import client from '../src/apollo/ApolloClient';
import { useMutation } from '@apollo/client'
import MessageAlert from '../src/components/message-alert/MessageAlert';
import Layout from '../src/components/layouts/Layout';
import Loading from '../src/components/message-alert/Loading';
import Router from 'next/router';
import MessageAlert from '../src/components/message-alert/MessageAlert';
import { LOGIN_USER } from '../src/queries';
import { isUserValidated } from '../src/utils/auth-functions';
import isEmpty from '../src/validator/isEmpty';
import Link from 'next/link';
import validateAndSanitizeLoginForm from '../src/validator/login';
import { LOGIN_USER } from '../src/queries';
/**
* Login functional component.
*
Expand Down Expand Up @@ -145,14 +148,9 @@ const Login = () => {
}
};

const [
login,
{
data: data,
loading: loading,
error: error,
},
] = useMutation(LOGIN_USER, { client })
const [login, { loading: loading }] = useMutation(LOGIN_USER, {
client
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Souptik2001 Let's break it into multiple lines to make it more readable

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@imranhsayed As per the current prettier configuration, as this line doesn't exceed a threshold line length limit, that's why it is showing error if we are breaking this line.

So, should we change that configuration, because otherwise there will be linting error.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes please. let's update the configuration to make it look more readable @Souptik2001


return (
<Layout>
Expand All @@ -163,12 +161,12 @@ const Login = () => {
{/* Error Message */}
{'' !== errorMessage
? showAlertBar && (
<MessageAlert
message={errorMessage}
success={false}
onCloseButtonClick={onCloseButtonClick}
/>
)
<MessageAlert
message={errorMessage}
success={false}
onCloseButtonClick={onCloseButtonClick}
/>
)
: ''}

{/* Login Form */}
Expand All @@ -177,7 +175,7 @@ const Login = () => {
<div className="form-group">
<label className="lead mt-1" htmlFor="username-or-email">
Username or email
</label>
</label>
<input
type="text"
className="form-control"
Expand All @@ -192,7 +190,7 @@ const Login = () => {
<div className="form-group">
<label className="lead mt-1" htmlFor="password">
Password
</label>
</label>
<input
type="password"
className="form-control"
Expand All @@ -210,9 +208,9 @@ const Login = () => {
disabled={loading ? 'disabled' : ''}
type="submit">
Login
</button>
<Link href="/register">
<a className="btn btn-secondary ml-2">Register</a>
</button>
<Link className="btn btn-secondary ml-2" href="/register">
Register
</Link>
</div>

Expand Down
5 changes: 4 additions & 1 deletion pages/my-account.js
Original file line number Diff line number Diff line change
@@ -1,8 +1,11 @@
// Internal.
import Layout from '../src/components/layouts/Layout';
import { useState, useEffect } from 'react';
import { isUserValidated } from '../src/utils/auth-functions';
import isEmpty from '../src/validator/isEmpty';

// External.
import Router from 'next/router';
import { useEffect, useState } from 'react';

/**
* MyAccount functional component.
Expand Down
23 changes: 8 additions & 15 deletions pages/product/[slug].js
Original file line number Diff line number Diff line change
@@ -1,16 +1,12 @@
import Layout from '../../src/components/layouts/Layout';
import AddToCartButton from '../../src/components/cart/AddToCartButton';
import client from '../../src/apollo/ApolloClient';
import Image from '../../src/components/Image';
import {
PRODUCT_QUERY,
PRODUCT_SLUGS
} from '../../src/queries';
import AddToCartButton from '../../src/components/cart/AddToCartButton';
import Gallery from '../../src/components/gallery';
import Image from '../../src/components/Image';
import Layout from '../../src/components/layouts/Layout';
import { PRODUCT_QUERY, PRODUCT_SLUGS } from '../../src/queries';

const Product = ({data}) => {

const { product } = data || {}
const Product = ({ data }) => {
const { product } = data || {};

return (
<Layout>
Expand Down Expand Up @@ -39,11 +35,9 @@ const Product = ({data}) => {
dangerouslySetInnerHTML={{ __html: product?.description }}
/>
</div>
<Gallery {...product?.galleryImages}/>
<Gallery {...product?.galleryImages} />
</div>
) : (
null
)}
) : null}
</Layout>
);
};
Expand All @@ -66,7 +60,6 @@ export async function getStaticProps({ params }) {
}

export async function getStaticPaths() {

const { data } = await client.query({
query: PRODUCT_SLUGS
});
Expand Down
Loading