diff --git a/dashboard/postcss.config.js b/dashboard/postcss.config.js index 33ad091d2..12a703d90 100644 --- a/dashboard/postcss.config.js +++ b/dashboard/postcss.config.js @@ -3,4 +3,4 @@ module.exports = { tailwindcss: {}, autoprefixer: {}, }, -} +}; diff --git a/dashboard/src/components/TopBar.js b/dashboard/src/components/TopBar.js index b7dfb8dbd..bbd8684f9 100644 --- a/dashboard/src/components/TopBar.js +++ b/dashboard/src/components/TopBar.js @@ -1,13 +1,9 @@ import React, { useState } from 'react'; import { Link } from 'react-router-dom'; -import styled from 'styled-components'; import { ButtonDropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap'; import logo from '../assets/logo-green.png'; -import { UnBugButton } from '../components/header'; import SelectTeam from './SelectTeam'; -import { theme } from '../config'; - import { currentTeamState, organisationState, teamsState, userState } from '../recoil/auth'; import API from '../services/api'; import { useRecoilState, useRecoilValue } from 'recoil'; @@ -15,6 +11,7 @@ import Notification from './Notification'; import { useDataLoader } from './DataLoader'; import OpenNewWindowIcon from './OpenNewWindowIcon'; import ColorHeaderBand from './ColorHeaderBand'; +import UnBugButton from './UnBugButton'; const TopBar = () => { const [dropdownOpen, setDropdownOpen] = useState(false); @@ -23,7 +20,7 @@ const TopBar = () => { const teams = useRecoilValue(teamsState); const [currentTeam, setCurrentTeam] = useRecoilState(currentTeamState); - const { resetCache } = useDataLoader(); + const { resetCache, refresh, isLoading } = useDataLoader(); return (
@@ -45,25 +42,29 @@ const TopBar = () => { )}
-
-
+
setDropdownOpen(!dropdownOpen)}> - - {user?.name} -
+ + {user?.name} +
- + {user?.name} - {user.role} @@ -121,17 +122,4 @@ const TopBar = () => { ); }; -const DropdownToggleStyled = styled(DropdownToggle)` - border-radius: 40px !important; - padding: 4px 16px; - display: flex; - font-size: 12px; - flex: 1; - justify-content: space-between; - align-items: center; - background-color: ${theme.main}; - border-color: ${theme.main}; - margin: 0 0 0 1rem; -`; - export default TopBar; diff --git a/dashboard/src/components/UnBugButton.js b/dashboard/src/components/UnBugButton.js new file mode 100644 index 000000000..1078a6e36 --- /dev/null +++ b/dashboard/src/components/UnBugButton.js @@ -0,0 +1,63 @@ +import React from 'react'; +import { useDataLoader } from './DataLoader'; +import API from '../services/api'; +import { ModalBody, ModalContainer, ModalFooter, ModalHeader } from './tailwind/Modal'; + +export default function UnBugButton() { + const [isModalOpen, setIsModalOpen] = React.useState(false); + const { resetCache } = useDataLoader(); + return ( + <> + + {isModalOpen && ( + setIsModalOpen(false)} size="xl"> + setIsModalOpen(false)} title="Un bug ? 🪲" /> + +

+ Vous ne voyez plus vos données ? C’est peut-être un problème de cache sur votre ordinateur. Nous vous conseillons les étapes + suivantes : +

+
    +
  • + Cliquez{' '} + {' '} + pour réinitialiser le cache et vérifiez si le problème persiste +
    • +
  • + Essayez depuis un autre ordinateur ou un autre compte pour voir si le problème est général ou localisé. Cela aidera les équipes pour + l'étape suivante +
    • +
  • + Si le problème persiste, contactez votre chargé de déploiement : +
      +
    • Yoann - ykittery.mano@gmail.com (06 83 98 29 66)
      • +
    • Melissa - m.saiter.mano@gmail.com (06 13 23 33 45)
      • +
    +
    • +
+ + + + + + )} + + ); +} diff --git a/dashboard/src/components/header/index.js b/dashboard/src/components/header/index.js index 20103bd65..3030501ed 100644 --- a/dashboard/src/components/header/index.js +++ b/dashboard/src/components/header/index.js @@ -1,9 +1,4 @@ -import React from 'react'; import BackButton from '../backButton'; -import { useDataLoader } from '../DataLoader'; -import ButtonCustom from '../ButtonCustom'; -import API from '../../services/api'; -import { ModalBody, ModalContainer, ModalFooter, ModalHeader } from '../tailwind/Modal'; const Header = ({ title, style = {}, titleStyle = {}, className = '' }) => { return ( @@ -13,63 +8,6 @@ const Header = ({ title, style = {}, titleStyle = {}, className = '' }) => { ); }; -export const UnBugButton = () => { - const [isModalOpen, setIsModalOpen] = React.useState(false); - const { resetCache } = useDataLoader(); - return ( - <> - { - setIsModalOpen(true); - }} - /> - {isModalOpen && ( - setIsModalOpen(false)} size="xl"> - setIsModalOpen(false)} title="Un bug ? 🪲" /> - -

- Vous ne voyez plus vos données ? C’est peut-être un problème de cache sur votre ordinateur. Nous vous conseillons les étapes - suivantes : -

-
    -
  • - Cliquez{' '} - {' '} - pour réinitialiser le cache et vérifiez si le problème persiste ; -
    • -
  • - Essayez depuis un autre ordinateur ou un autre compte pour voir si le problème est général ou localisé. Cela aidera les équipes pour - l'étape suivante ; -
    • -
  • - Si le problème persiste, contactez votre chargé de déploiement : -
      -
    • Yoann - ykittery.mano@gmail.com (06 83 98 29 66)
      • -
    • Melissa - m.saiter.mano@gmail.com (06 13 23 33 45)
      • -
    -
    • -
- - - setIsModalOpen(false)} /> - - - )} - - ); -}; - export const SmallHeaderWithBackButton = ({ className, ...props }) => { return
} {...props} />; }; diff --git a/dashboard/src/index.scss b/dashboard/src/index.scss index e7a641568..d684388f5 100644 --- a/dashboard/src/index.scss +++ b/dashboard/src/index.scss @@ -25,7 +25,7 @@ } .button-link { - @apply tw-inline-flex tw-w-full tw-cursor-pointer tw-justify-center tw-rounded-md tw-border tw-border-transparent tw-px-4 tw-py-2 tw-font-normal tw-text-main75 hover:tw-underline focus:tw-underline focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-main25 focus:tw-ring-offset-2 disabled:tw-cursor-not-allowed disabled:tw-opacity-30 sm:tw-ml-3 sm:tw-w-auto; + @apply tw-inline-flex tw-w-full tw-cursor-pointer tw-justify-center tw-rounded-md tw-border tw-border-transparent tw-px-4 tw-py-2 tw-font-semibold tw-text-main hover:tw-underline focus:tw-underline focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-main25 focus:tw-ring-offset-2 disabled:tw-cursor-not-allowed disabled:tw-opacity-30 sm:tw-ml-3 sm:tw-w-auto; } .button-cancel,