Skip to content

Commit

Permalink
refactor services (#4)
Browse files Browse the repository at this point in the history
  • Loading branch information
huseyindeniz authored Sep 23, 2023
1 parent 36b20bf commit 50ecdcd
Show file tree
Hide file tree
Showing 65 changed files with 508 additions and 412 deletions.
38 changes: 37 additions & 1 deletion .eslintrc.cjs
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,47 @@ module.exports = {
extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'plugin:react-hooks/recommended', 'plugin:storybook/recommended'],
ignorePatterns: ['dist', '.eslintrc.cjs'],
parser: '@typescript-eslint/parser',
plugins: ['react-refresh'],
plugins: ['react-refresh', "import"],
rules: {
"@typescript-eslint/no-explicit-any": "off",
'no-unused-vars': "off",
"@typescript-eslint/no-unused-vars": "off",
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
"import/order": [
"warn",
{
"newlines-between": "always",
"groups": [
"builtin",
"external",
"internal",
"parent",
"sibling",
"index"
],
"pathGroups": [
{
"pattern": "**/*.stories.ts?",
"group": "external",
"position": "before"
},
{
"pattern": "**/*.test.ts?",
"group": "external",
"position": "before"
}
],
"pathGroupsExcludedImportTypes": [
"builtin"
],
"alphabetize": {
"order": "asc",
"caseInsensitive": true
}
}
]
},
}
22 changes: 11 additions & 11 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

32 changes: 27 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
{
"name": "vitedapp",
"private": true,
"version": "0.0.2",
"version": "0.1.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "tsc && vite build",
"lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
"lint": "eslint . --ext ts,tsx --max-warnings 0",
"preview": "vite preview",
"test": "jest --no-cache",
"coverage": "jest --coverage --no-cache",
"storybook": "storybook dev -p 6006",
"build-storybook": "storybook build",
"extract": "i18next 'src/**/*.{ts,tsx}'"
Expand All @@ -18,7 +19,6 @@
"@emotion/react": "^11.11.1",
"@emotion/styled": "^11.11.0",
"@metamask/jazzicon": "^2.0.0",
"@react-icons/all-files": "^4.1.0",
"@reduxjs/toolkit": "^1.9.5",
"ethers": "^5.7.2",
"framer-motion": "^10.16.4",
Expand All @@ -31,6 +31,7 @@
"react-error-boundary": "^4.0.11",
"react-helmet-async": "^1.3.0",
"react-i18next": "^13.2.2",
"react-icons": "^4.11.0",
"react-redux": "^8.1.2",
"react-router-dom": "^6.15.0",
"redux-saga": "^1.2.3"
Expand Down Expand Up @@ -86,7 +87,28 @@
"react-i18next": "<rootDir>/src/__mocks__/i18nextMock.tsx"
},
"setupFilesAfterEnv": [
"<rootDir>/src/jest.setup.ts"
]
"<rootDir>/src/setupTests.ts"
],
"collectCoverageFrom": [
"src/**/*.{js,jsx,ts,tsx}",
"!src/reportWebVitals.ts",
"!src/serviceWorker.ts",
"!src/serviceWorkerRegistration.ts",
"!src/test-utils.tsx",
"!src/index.tsx",
"!src/App.tsx",
"!src/**/*.stories.{js,jsx,ts,tsx}",
"!<rootDir>/node_modules/",
"!<rootDir>/template/"
],
"coveragePathIgnorePatterns": [],
"coverageThreshold": {
"global": {
"branches": 30,
"functions": 40,
"lines": 40,
"statements": 40
}
}
}
}
58 changes: 7 additions & 51 deletions src/App.tsx
Original file line number Diff line number Diff line change
@@ -1,68 +1,24 @@
import { EnhancedStore } from '@reduxjs/toolkit';
import log from 'loglevel';
import React, { useEffect, useState } from 'react';
import React from 'react';
import { Provider } from 'react-redux';

import './features/i18n/i18n';

import { theme } from './features/ui/components/Layout/Theme/theme';
import { Router } from './pages/Router';
import store from './store/store';

import './features/i18n/i18n';

log.setDefaultLevel('silent');

if (process.env.NODE_ENV !== 'production') {
if (import.meta.env.MODE !== 'production') {
log.enableAll();
} else {
log.disableAll();
}

const Provider = React.lazy(() =>
import(/* webpackChunkName: "Redux" */ 'react-redux').then(module => ({
default: module.Provider,
}))
);

const StoreLoader = React.lazy(() =>
import(/* webpackChunkName: "Store" */ './store/StoreLoader').then(
module => ({
default: module.StoreLoader,
})
)
);

const ChakraProvider = React.lazy(() =>
import(/* webpackChunkName: "ChakraUI" */ '@chakra-ui/react').then(
module => ({
default: module.ChakraProvider,
})
)
);

export const App: React.FC = () => {
const [store, setStore] = useState<EnhancedStore>();

useEffect(() => {
if (!store) {
return;
}
// Use lazy loaded module store
}, [store]);

const handleStoreLoaded = (module: EnhancedStore) => {
// Careful, always do it using a function,
// else the module itself will be initialized!
setStore(() => module);
};

if (!store) {
// Lazy load it
return <StoreLoader onLoaded={handleStoreLoaded} />;
}

return (
<Provider store={store}>
<ChakraProvider theme={theme}>
<Router />
</ChakraProvider>
<Router />
</Provider>
);
};
5 changes: 3 additions & 2 deletions src/__mocks__/customRender.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,11 @@
import { ChakraProvider } from '@chakra-ui/react';
import { render, RenderOptions } from '@testing-library/react';
import * as React from 'react';
import { I18nextProvider } from 'react-i18next';

import { theme } from '../features/ui/components/Layout/Theme/theme';

import { theme } from '../features/ui/components/Layout/Theme/theme';
import i18n from './i18nextMock';
import { I18nextProvider } from 'react-i18next';

const AllProviders = ({ children }: { children?: React.ReactNode }) => (
<ChakraProvider theme={theme}>
Expand Down
1 change: 0 additions & 1 deletion src/features/i18n/translations/en-US/Layout.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
"Accept all cookies": "Accept all cookies",
"Refuse non-essential cookies": "Refuse non-essential cookies",
"This website uses cookies to enhance the user experience.": "This website uses cookies to enhance the user experience.",
"An error occured!": "An error occured!",
"Open Menu": "Open Menu",
"SITE_NAME": "My Awesome dApp",
"SITE_DESCRIPTION": "dApp demonstration website that created with React dApp Template (Vite)",
Expand Down
1 change: 0 additions & 1 deletion src/features/i18n/translations/tr-TR/Layout.json
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
"Accept all cookies": "Tüm çerezleri kabul et",
"Refuse non-essential cookies": "Zorunlu olmayan çerezleri reddet",
"This website uses cookies to enhance the user experience.": "Bu web sitesi, kullanıcı deneyimini geliştirmek için tanımlama tarayıcı çerezleri kullanır.",
"An error occured!": "Bir hata oluştu!",
"Open Menu": "Menüyü Aç",
"SITE_NAME": "Harika Merkeziyetsiz Uygulamam",
"SITE_DESCRIPTION": "React dApp Template (Vite) ile oluşturulmuş örnek dApp sitesi",
Expand Down

This file was deleted.

Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
// ConnectButton.stories.ts|tsx
import type { Meta, StoryObj } from '@storybook/react';

import { CookieConsentMessage } from './CookieConsentMessage';

const meta: Meta<typeof CookieConsentMessage> = {
component: CookieConsentMessage,
};
export default meta;

type Story = StoryObj<typeof CookieConsentMessage>;

export const Default: Story = {
args: {
debug: true,
},
};
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { render } from '@testing-library/react';

import { CookieConsent } from './CookieConsent';
import { CookieConsentMessage } from './CookieConsentMessage';

describe('Feature: UI', () => {
describe('Component: Layout/CookieConsent', () => {
describe('Component: Layout/CookieConsentMessage', () => {
it('should render with default props', () => {
const { asFragment } = render(<CookieConsent />);
const { asFragment } = render(<CookieConsentMessage />);
expect(asFragment()).toMatchSnapshot();
});

it('should render with debug enabled', () => {
const { asFragment } = render(<CookieConsent debug />);
const { asFragment } = render(<CookieConsentMessage debug />);
expect(asFragment()).toMatchSnapshot();
});
});
Expand Down
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
import { Button, Text } from '@chakra-ui/react';
import { CookieConsent as CookieConsetMessage } from 'react-cookie-consent';
import { CookieConsent } from 'react-cookie-consent';
import { useTranslation } from 'react-i18next';

export interface CookieConsentProps {
export interface CookieConsentMessageProps {
debug?: boolean;
expires?: number;
}

export const CookieConsent: React.FC<CookieConsentProps> = ({
export const CookieConsentMessage: React.FC<CookieConsentMessageProps> = ({
debug = false,
expires = 365,
}) => {
const { t } = useTranslation('Layout');
return (
<CookieConsetMessage
<CookieConsent
location="bottom"
enableDeclineButton
ButtonComponent={Button}
Expand All @@ -29,6 +29,6 @@ export const CookieConsent: React.FC<CookieConsentProps> = ({
<Text>
{t('This website uses cookies to enhance the user experience.')}
</Text>
</CookieConsetMessage>
</CookieConsent>
);
};
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Feature: UI Component: Layout/CookieConsent should render with debug enabled 1`] = `
exports[`Feature: UI Component: Layout/CookieConsentMessage should render with debug enabled 1`] = `
<DocumentFragment>
<div
class="CookieConsent"
Expand Down Expand Up @@ -42,7 +42,7 @@ exports[`Feature: UI Component: Layout/CookieConsent should render with debug en
</DocumentFragment>
`;

exports[`Feature: UI Component: Layout/CookieConsent should render with default props 1`] = `
exports[`Feature: UI Component: Layout/CookieConsentMessage should render with default props 1`] = `
<DocumentFragment>
<div
class="CookieConsent"
Expand Down
2 changes: 1 addition & 1 deletion src/features/ui/components/Layout/Copyright/Copyright.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import reactDappTemplateLogo from '../../../assets/images/react-dapp-template-lo
export const Copyright: React.FC = React.memo(() => {
return (
<Box>
<Tooltip label="Powered by React dApp Template (Vite) v0.0.2">
<Tooltip label="Powered by React dApp Template (Vite) v0.1.0">
<Button
as={Link}
href="https://github.com/huseyindeniz/vite-react-dapp-template"
Expand Down
Loading

0 comments on commit 50ecdcd

Please sign in to comment.