Skip to content

Commit

Permalink
feat: adding storybook 7.0 into template (#61)
Browse files Browse the repository at this point in the history
  • Loading branch information
lotyp authored Jan 31, 2023
1 parent e7c2b07 commit 1611944
Show file tree
Hide file tree
Showing 55 changed files with 10,017 additions and 2,252 deletions.
5 changes: 2 additions & 3 deletions .npmrc
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@
strict-peer-dependencies=false
engine-strict=true
engine-strict=false

### https://gist.github.com/belgattitude/838b2eba30c324f1f0033a797bab2e31#recommended-npmrc
# https://pnpm.io/next/npmrc#strict-peer-dependencies
strict-peer-dependencies=false

# https://pnpm.io/npmrc#auto-install-peers
auto-install-peers=false
auto-install-peers=true

store-dir=.pnpm-store/v3
4 changes: 3 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@
<a href="https://codeclimate.com/github/wayofdev/next-starter-tpl"><img alt="Code Climate maintainability" src="https://img.shields.io/codeclimate/maintainability/wayofdev/next-starter-tpl?style=flat-square"></a>
<a href="https://codeclimate.com/github/wayofdev/next-starter-tpl/issues"><img alt="Code Climate issues" src="https://img.shields.io/codeclimate/issues/wayofdev/next-starter-tpl?style=flat-square"></a>
<a href="https://codeclimate.com/github/wayofdev/next-starter-tpl"><img alt="Code Climate technical debt" src="https://img.shields.io/codeclimate/tech-debt/wayofdev/next-starter-tpl?style=flat-square"></a>
<a href="https://codeclimate.com/github/wayofdev/next-starter-tpl"><img alt="Code Climate coverage" src="https://img.shields.io/codeclimate/coverage/wayofdev/next-starter-tpl?style=flat-square"></a>
<a href="https://codeclimate.com/github/wayofdev/next-starter-tpl">
<img alt="Codecov" src="https://img.shields.io/codecov/c/github/wayofdev/next-starter-tpl?flag=web&style=flat-square"></a>
</div>

<br>

# NextJS Starter Template
Expand Down
4 changes: 2 additions & 2 deletions apps/docs/.eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@ module.exports = {
ignorePatterns: [...getDefaultIgnorePatterns(), '.next', '.out'],
extends: [
'@wayofdev/eslint-config-custom/typescript',
'@wayofdev/eslint-config-custom/sonar',
'@wayofdev/eslint-config-custom/regexp',
'@wayofdev/eslint-config-custom/sonar',
'@wayofdev/eslint-config-custom/jest',
'@wayofdev/eslint-config-custom/rtl',
'@wayofdev/eslint-config-custom/react',
'@wayofdev/eslint-config-custom/tailwind',
'@wayofdev/eslint-config-custom/rtl',
'@wayofdev/eslint-config-custom/mdx',
// Add specific rules for nextjs
'plugin:@next/next/core-web-vitals',
Expand Down
11 changes: 6 additions & 5 deletions apps/docs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@
"dependencies": {
"@vercel/analytics": "latest",
"@wayofdev/ui": "workspace:*",
"next": "^13.1.5",
"nextra": "^2.2.13",
"nextra-theme-docs": "^2.2.13",
"next": "^13.1.6",
"nextra": "^2.2.14",
"nextra-theme-docs": "^2.2.14",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
Expand All @@ -26,8 +26,9 @@
"@types/react-dom": "^18.0.10",
"@wayofdev/browserslist-config": "^1.1.0",
"@wayofdev/eslint-config-custom": "workspace:*",
"es-check": "^7.0.1",
"es-check": "^7.1.0",
"eslint": "^8.32.0",
"typescript": "^4.9.4"
"typescript": "^4.9.4",
"sharp": "^0.31.3"
}
}
15 changes: 12 additions & 3 deletions apps/web/.eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,17 @@ module.exports = {
tsconfigRootDir: __dirname,
project: 'tsconfig.json',
},
ignorePatterns: [...getDefaultIgnorePatterns(), '.next', '.out'],
ignorePatterns: [...getDefaultIgnorePatterns(), '.next', '.out', '/storybook-static'],
extends: [
'@wayofdev/eslint-config-custom/typescript',
'@wayofdev/eslint-config-custom/sonar',
'@wayofdev/eslint-config-custom/regexp',
'@wayofdev/eslint-config-custom/sonar',
'@wayofdev/eslint-config-custom/jest',
'@wayofdev/eslint-config-custom/rtl',
'@wayofdev/eslint-config-custom/storybook',
'@wayofdev/eslint-config-custom/react',
'@wayofdev/eslint-config-custom/tailwind',
'@wayofdev/eslint-config-custom/rtl',
'@wayofdev/eslint-config-custom/mdx',
// Add specific rules for nextjs
'plugin:@next/next/core-web-vitals',
// Apply prettier and disable incompatible rules
Expand All @@ -35,6 +37,7 @@ module.exports = {
// For the sake of example
// https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/HEAD/docs/rules/anchor-is-valid.md
'jsx-a11y/anchor-is-valid': 'off',
'@typescript-eslint/no-unused-vars': 'off',
},
overrides: [
{
Expand All @@ -43,5 +46,11 @@ module.exports = {
'react/display-name': 'off',
},
},
{
files: ['src/stories/*.ts'],
rules: {
'@typescript-eslint/naming-convention': 'off',
},
},
],
}
2 changes: 1 addition & 1 deletion apps/web/.secretlintignore
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
# next.js build output
.next
.next/*
10 changes: 5 additions & 5 deletions apps/web/.size-limit.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,15 +10,15 @@ try {
const pages = manifest.pages

const limitCfg = {
defaultSize: '85kb',
defaultSize: '150kb',
pages: {
'/': '120kb',
'/404': '85kb',
'/': '150kb',
'/404': '150kb',
'/_app': '170kb',
'/_error': '90kb',
'/_error': '140kb',
'/_monitor/sentry/csr-page': '85kb',
'/_monitor/sentry/ssr-page': '85kb',
'/auth/login': '120kb',
'/auth/login': '160kb',
'/home': '105kb',
},
}
Expand Down
19 changes: 19 additions & 0 deletions apps/web/.storybook/main.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
const path = require('path');
module.exports = {
"stories": [
"../src/**/*.mdx",
"../src/**/*.stories.@(js|jsx|ts|tsx)"
],
"addons": [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-interactions"
],
"framework": {
"name": "@storybook/nextjs",
"options": {}
},
"docs": {
"autodocs": "tag"
}
}
9 changes: 9 additions & 0 deletions apps/web/.storybook/preview.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export const parameters = {
actions: { argTypesRegex: '^on[A-Z].*' },
controls: {
matchers: {
color: /(background|color)$/i,
date: /Date$/,
},
},
}
21 changes: 21 additions & 0 deletions apps/web/config/tests/AppTestProviders.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import type { Session } from 'next-auth'
import type { FC, PropsWithChildren } from 'react'
import { AppProviders } from '../../src/AppProviders'
import { I18nextTestStubProvider } from './I18nextTestStubProvider'

const fakeNextAuthSession: Session = {
user: {
email: '[email protected]',
role: 'guest',
name: 'AppTestProvider',
},
expires: '2050-01-01T00:00:00.000Z',
}

export const AppTestProviders: FC<PropsWithChildren> = ({ children }) => {
return (
<AppProviders session={fakeNextAuthSession}>
<I18nextTestStubProvider>{children}</I18nextTestStubProvider>
</AppProviders>
)
}
31 changes: 31 additions & 0 deletions apps/web/config/tests/I18nextTestStubProvider.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import i18next from 'i18next'
import type { FC, ReactNode } from 'react'
import { initReactI18next, I18nextProvider } from 'react-i18next'
import type { I18nNamespace } from '@/lib/i18n'

/**
* Fully wrapped strategy for i18next, you can use stub/mocks as well
* @link {https://react.i18next.com/misc/testing}
*/
// eslint-disable-next-line import/no-named-as-default-member
i18next.use(initReactI18next).init({
lng: 'en',
fallbackLng: 'en',
ns: ['common'],
defaultNS: 'common',
debug: false,
interpolation: {
escapeValue: false, // not needed for react!!
},
// Let empty, so you can test on translation keys rather than translated strings
resources: {
en: { common: {}, demo: {}, home: {}, system: {} } as Record<
I18nNamespace,
Record<string, never>
>,
},
})

export const I18nextTestStubProvider: FC<{ children: ReactNode }> = ({ children }) => {
return <I18nextProvider i18n={i18next}>{children}</I18nextProvider>
}
19 changes: 19 additions & 0 deletions apps/web/config/tests/test-utils.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
/**
* Automatically add app-providers
* @see https://testing-library.com/docs/react-testing-library/setup#configuring-jest-with-test-utils
*/
import { render } from '@testing-library/react'
import type { ReactElement } from 'react'
import type {} from '@testing-library/dom/types'
import { AppTestProviders } from './AppTestProviders'

// eslint-disable-next-line @typescript-eslint/no-explicit-any
const customRender = (ui: ReactElement, options?: any) =>
render(ui, { wrapper: AppTestProviders, ...options })

// re-export everything
export * from '@testing-library/react'
export { default as userEvent } from '@testing-library/user-event'

// override render method
export { customRender as render }
7 changes: 6 additions & 1 deletion apps/web/jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,12 @@ const config = {
// false by default, overrides in cli, ie: yarn test:unit --collect-coverage=true
collectCoverage: false,
coverageDirectory: '<rootDir>/coverage',
collectCoverageFrom: ['<rootDir>/**/*.{ts,tsx,js,jsx}', '!**/*.test.{js,ts}', '!**/__mock__/*'],
collectCoverageFrom: [
'<rootDir>/**/*.{ts,tsx,js,jsx}',
'!**/*.test.{js,ts}',
'!**/__mock__/*',
'!**/stories/*',
],
}

module.exports = config
40 changes: 30 additions & 10 deletions apps/web/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,27 +5,30 @@
"scripts": {
"analyze": "next build",
"build": "next build",
"build-storybook": "storybook build",
"dev": "next dev",
"lint": "eslint . --ext .ts,.tsx,.js,.jsx,.cjs,.mjs,.mdx --cache --cache-location ../../.cache/eslint/web.eslintcache",
"lint:dist": "es-check -v",
"lint:fix": "eslint . --ext .ts,.tsx,.js,.jsx,.cjs,.mjs,.mdx --fix",
"lint:size": "size-limit --highlight-less",
"lint:types": "tsc --project ./tsconfig.json --noEmit",
"start": "next start",
"storybook": "storybook dev -p 6006",
"test": "jest --config ./jest.config.js --verbose --coverage --collect-coverage=true",
"test:watch": "jest --config ./jest.config.js --watch"
},
"dependencies": {
"@fontsource/inter": "^4.5.15",
"@heroicons/react": "^2.0.13",
"@headlessui/react": "^1.7.8",
"@heroicons/react": "^2.0.14",
"@hookform/resolvers": "^2.9.10",
"@httpx/exception": "^1.7.1",
"@vercel/analytics": "latest",
"@wayofdev/ui": "workspace:*",
"clsx": "^1.2.1",
"i18next": "^22.4.9",
"next": "^13.1.5",
"next-auth": "^4.18.10",
"next": "^13.1.6",
"next-auth": "^4.19.0",
"next-i18next": "^13.0.3",
"next-seo": "^5.15.0",
"react": "^18.2.0",
Expand All @@ -36,43 +39,60 @@
"zod": "^3.20.2"
},
"devDependencies": {
"@next/bundle-analyzer": "13.1.5",
"@sentry/nextjs": "^7.33.0",
"@next/bundle-analyzer": "13.1.6",
"@sentry/nextjs": "^7.34.0",
"@size-limit/file": "^8.1.2",
"@storybook/addon-essentials": "^7.0.0-beta.36",
"@storybook/addon-interactions": "^7.0.0-beta.36",
"@storybook/addon-links": "^7.0.0-beta.36",
"@storybook/blocks": "^7.0.0-beta.36",
"@storybook/nextjs": "^7.0.0-beta.36",
"@storybook/react": "^7.0.0-beta.36",
"@storybook/testing-library": "^0.0.13",
"@tailwindcss/aspect-ratio": "^0.4.2",
"@tailwindcss/forms": "^0.5.3",
"@testing-library/dom": "^8.20.0",
"@testing-library/jest-dom": "5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^14.4.3",
"@types/hoist-non-react-statics": "^3.3.1",
"@types/jest": "29.4.0",
"@types/node": "^18.11.18",
"@types/react": "^18.0.27",
"@types/react-dom": "^18.0.10",
"@types/react-test-renderer": "^18.0.0",
"@types/testing-library__jest-dom": "^5.14.5",
"@wayofdev/browserslist-config": "^1.1.0",
"@wayofdev/common-i18n": "workspace:*",
"@wayofdev/eslint-config-custom": "workspace:*",
"autoprefixer": "^10.4.13",
"browserslist": "^4.21.4",
"es-check": "^7.0.1",
"css-loader": "6.7.3",
"cssnano": "^5.1.14",
"es-check": "^7.1.0",
"eslint": "^8.32.0",
"eslint-config-next": "^13.1.5",
"eslint-config-next": "^13.1.6",
"get-tsconfig": "^4.3.0",
"jest": "^29.4.0",
"jest": "^29.4.1",
"jest-css-modules-transform": "4.4.2",
"jest-environment-jsdom": "^29.4.0",
"jest-environment-jsdom": "^29.4.1",
"picocolors": "1.0.0",
"postcss": "^8.4.21",
"postcss-100vh-fix": "^1.0.2",
"postcss-cli": "^10.1.0",
"postcss-flexbugs-fixes": "^5.0.2",
"postcss-loader": "^7.0.2",
"postcss-normalize": "^10.0.1",
"postcss-preset-env": "^8.0.0",
"postcss-preset-env": "^8.0.1",
"postcss-reporter": "^7.0.5",
"react-test-renderer": "^18.2.0",
"sanitize.css": "^13.0.0",
"size-limit": "^8.1.2",
"storybook": "^7.0.0-beta.36",
"style-loader": "^3.3.1",
"tailwindcss": "^3.2.4",
"ts-jest": "29.0.5",
"tslib": "^2.5.0",
"typescript": "^4.9.4"
}
}
1 change: 1 addition & 0 deletions apps/web/postcss.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ module.exports = {
'custom-properties': supportsIE11,
},
},
cssnano: {},
}
: {}),
},
Expand Down
27 changes: 27 additions & 0 deletions apps/web/sentry.edge.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
// This file configures the initialization of Sentry on the server.
// The config you add here will be used whenever the server handles a request.
// https://docs.sentry.io/platforms/javascript/guides/nextjs/

import { init as sentryInit } from '@sentry/nextjs'

sentryInit({
dsn: process.env.SENTRY_DSN || process.env.NEXT_SENTRY_DSN,

// Adjust this value in production, or use tracesSampler for greater control
// @see https://develop.sentry.dev/sdk/performance/
// To turn it off, remove the line
// @see https://github.com/getsentry/sentry-javascript/discussions/4503#discussioncomment-2143116
tracesSampleRate: ['false', '0'].includes(process.env.NEXT_SENTRY_TRACING ?? '') ? undefined : 1,

// ...
// Note: if you want to override the automatic release value, do not set a
// `release` value here - use the environment variable `SENTRY_RELEASE`, so
// that it will also get attached to your source maps
beforeSend: async (event, hint) => {
if (process.env.NODE_ENV === 'development') {
console.log('Sentry event', event)
console.log('Sentry hint', hint)
}
return event
},
})
3 changes: 3 additions & 0 deletions apps/web/sentry.properties
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
defaults.url=https://sentry.io/
defaults.org=wayofdev
defaults.project=next-starter-tpl
Loading

2 comments on commit 1611944

@vercel
Copy link

@vercel vercel bot commented on 1611944 Jan 31, 2023

Choose a reason for hiding this comment

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

@vercel
Copy link

@vercel vercel bot commented on 1611944 Jan 31, 2023

Choose a reason for hiding this comment

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

Please sign in to comment.