From 27379b1b013d884ccc1d7a6ef326a4918f72f1dd Mon Sep 17 00:00:00 2001 From: xaralis <filip.varecha@fragaria.cz> Date: Thu, 7 Jan 2021 10:09:38 +0100 Subject: [PATCH] feat: handle 429 when adding new posts --- src/containers/AddPostForm.jsx | 23 ++++++++++++++++------- src/pages/Home.jsx | 18 ++++++++++++++++++ 2 files changed, 34 insertions(+), 7 deletions(-) diff --git a/src/containers/AddPostForm.jsx b/src/containers/AddPostForm.jsx index 36a3108..7ed1e66 100644 --- a/src/containers/AddPostForm.jsx +++ b/src/containers/AddPostForm.jsx @@ -21,10 +21,15 @@ const AddPostForm = ({ className }) => { const [addingPost, addingPostError] = useActionState(addPost, { content: text, }); - const [addingProposal, addingProposalError] = useActionState(addPost, { + const [addingProposal, addingProposalError] = useActionState(addProposal, { content: text, }); + const apiError = addingPostError || addingProposalError; + const is429ApiError = + apiError && + apiError.toString().indexOf("Unexpected status code 429") !== -1; + const onOutsideClick = useCallback(() => { setExpanded(false); }, [setExpanded]); @@ -113,14 +118,18 @@ const AddPostForm = ({ className }) => { } > <div className="space-y-4"> - {addingPostError && ( - <ErrorMessage> - PĹ™i pĹ™idávánĂ pĹ™ĂspÄ›vku došlo k problĂ©mu: {addingPostError}. - </ErrorMessage> + {apiError && is429ApiError && ( + <div className="alert alert--warning"> + <i className="alert__icon ico--clock text-lg" /> + <span> + <strong>Zpomal!</strong> Dalšà pĹ™ĂspÄ›vek mĹŻĹľeš pĹ™idat nejdĹ™Ăve + po 1 minutÄ› od pĹ™idánĂ poslednĂho. + </span> + </div> )} - {addingProposalError && ( + {apiError && !is429ApiError && ( <ErrorMessage> - PĹ™i pĹ™idávánĂ pĹ™ĂspÄ›vku došlo k problĂ©mu: {addingProposalError}. + PĹ™i pĹ™idávánĂ pĹ™ĂspÄ›vku došlo k problĂ©mu: {apiError}. </ErrorMessage> )} diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx index 262c8c6..fdf8f2c 100644 --- a/src/pages/Home.jsx +++ b/src/pages/Home.jsx @@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; import Joyride, { EVENTS } from "react-joyride"; import ReactPlayer from "react-player/lazy"; +import { useKeycloak } from "@react-keycloak/web"; import useWindowSize from "@rooks/use-window-size"; import { @@ -66,6 +67,11 @@ const Home = () => { onEndProgramPointConfirm, onEndProgramPointCancel, ] = useActionConfirm(endProgramPoint, programEntry); + const { keycloak } = useKeycloak(); + + const login = useCallback(() => { + keycloak.login(); + }, [keycloak]); useEffect(() => { if (isLg && !localStorage.getItem(tourLSKey)) { @@ -303,6 +309,18 @@ const Home = () => { Rozprava je uzavĹ™ena - pĹ™ĂspÄ›vky teÄŹ nelze pĹ™idávat. </p> )} + {programEntry.discussionOpened && !isAuthenticated && ( + <p className="alert alert--light items-center mb-4"> + <i className="alert__icon ico--info text-lg" /> + <span> + Pokud chceš pĹ™idat novĂ˝ pĹ™ĂspÄ›vek,{" "} + <button onClick={login} className="underline cursor-pointer"> + pĹ™ihlaš se pomocĂ PirátskĂ© identity + </button> + . + </span> + </p> + )} {programEntry.discussionOpened && isAuthenticated && user.isBanned && ( <p className="alert alert--error items-center mb-4"> <i className="alert__icon ico--warning text-lg" /> -- GitLab