Add readme for auth

README.md

@@ -2,15 +2,21 @@
 
 [![Build Status](https://flatstack.semaphoreci.com/badges/react-ts-next-base/branches/master.svg?style=shields&key=96052622-7942-4693-8763-afb25b9ecc2b)](https://flatstack.semaphoreci.com/projects/react-ts-next-base)
 
-### Install dependencies:
+### Install dependencies
 
 Run `yarn`
 
+> **Note**: you must have the required version of Node.js installed, as specified in the [package.json](package.json) file
+
 #
 
-### Setup environment for development:
+### Setup environment for development
+
+Create `.env` file at the root of project with the necessary variables that are specified in the file [.env.example](.env.example)
 
-Create `.env` file using `.env.example` example
+Request the values for the variables from the admin
+
+> **Note**: If you create new variables, don't forget to add them to the [next.config.mjs](next.config.mjs) and [.env.example](.env.example) files
 
 ###
 
@@ -22,7 +28,8 @@ Ask for token and key from admin
 
 - Run `yarn server` for a dev server.
 - Open `localhost:8080`.
-- The app will automatically reload if you change any of the source files.
+
+> The app will automatically reload if you change any of the source files.
 
 ### Yarn tasks
 
@@ -41,12 +48,13 @@ Ask for token and key from admin
 #
 
 ### Useful links
+#### For project:
+- [Best practices for working with styled components](./public/styles/bestPractiseForStyledComponents.md)
+- [How auth process works](./lib/AuthProcess.md)
 
-###
-
-[Apollo Client Developer Tools](https://chrome.google.com/webstore/detail/apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm)
+#### To work more efficiently:
 
-###
+- [Apollo Client Developer Tools](https://chrome.google.com/webstore/detail/apollo-client-developer-t/jdkknkkbebbapilgoeccciglkfbmbnfm)
 
 #
 

lib/AuthProcess.md

@@ -0,0 +1,43 @@
+## Short description
+> **TODO**
+#
+
+## Available HOCs
+
+### Main:
+### [**withAccessTokenManager**](./auth/withAccessTokenManager.tsx):
+Creates object containing access and refresh tokens.
+> **TODO:** why we need this object?
+
+Adds accessTokenManager (access and refresh tokens object) to every page, that will be wrapped with this hoc.
+Used in `withApolloClient` hoc
+
+### [**withApolloClient**](./withApolloClient.tsx):
+Uses internally `withAccessTokenManager` hoc.
+Adds apollo client and accessTokenManager (access and refresh tokens object) to application.
+> Use once as a wrapper for your application
+
+### [**withAuthSyncEvents**](./auth/withAuthSyncEvents.tsx):
+Listens storage event, if one of global events (`SIGN_OUT_EVENT`/`SIGN_IN_EVENT`) occurs, it reloads the page
+
+### [**withTokensUpdate**](./auth/withTokensUpdate.tsx):
+Gets new pair of tokens (access and refresh) and sets the refresh token in the cookie
+
+### [**withAuth**](./auth/withAuth.tsx):
+Just combines two auth HOC's - `withTokensUpdate`
+and `withAuthSyncEvents`
+
+#
+
+### Additional:
+### [**withAuthSecurity**](./auth/withAuthSecurity.tsx):
+Adds to page the ability to redirect from private content, if the user is not logged in
+
+> **Briefly**: For not logged in user and private content
+
+### [**withNotAuthSecurity**](./auth/withNotAuthSecurity.tsx):
+> **TODO**
+
+Adds to page the ability to redirect from specific page, if the user is logged in, but the content of that page should not be accessible
+
+> **Briefly**: For logged in user and private content