Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix rigobot chat button #1650

Merged
merged 9 commits into from
Oct 22, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions public/locales/en/syllabus.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
"solution-video": "Solution video",
"watch-intro": "Watch intro",
"get-help": "Get help from Rigobot",
"connect-rigobot-message": "You must connect your account to Github and to Rigobot",
"connect-rigobot": "Connect with Rigobot",
"contribute": "Contribute to this lesson",
"show-menu": "Show menu",
"hide-menu": "Hide menu",
Expand Down
2 changes: 2 additions & 0 deletions public/locales/es/syllabus.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@
"solution-video": "Ver solución",
"watch-intro": "Ver introducción",
"get-help": "Pide ayuda a Rigobot",
"connect-rigobot-message": "Debes conectar tu cuenta con Github y Rigobot",
"connect-rigobot": "Conectar con Rigobot",
"contribute": "Contribuye a esta lección",
"show-menu": "Abrir menú",
"hide-menu": "Cerrar menú",
Expand Down
4 changes: 1 addition & 3 deletions src/common/components/CodeViewer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import useTranslation from 'next-translate/useTranslation';
import PropTypes from 'prop-types';
import Editor from '@monaco-editor/react';
import { setStorageItem, getStorageItem, isWindow } from '../../utils';
import modifyEnv from '../../../modifyEnv';
import { RIGOBOT_HOST, BREATHECODE_HOST } from '../../utils/variables';
import ModalInfo from '../../js_modules/moduleMap/modalInfo';
import useAuth from '../hooks/useAuth';
import useStyle from '../hooks/useStyle';
Expand Down Expand Up @@ -71,8 +71,6 @@ function CodeViewer({ languagesData, allowNotLogged, fileContext, ...rest }) {
const [tabIndex, setTabIndex] = useState(0);
const [showModal, setShowModal] = useState(false);
const [languages, setLanguages] = useState(languagesData);
const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
const RIGOBOT_HOST = modifyEnv({ queryString: 'rigo-host', env: process.env.RIGOBOT_HOST });
const defaultPlan = process.env.BASE_PLAN || 'basic';

const handleTouchStart = (event) => {
Expand Down
201 changes: 201 additions & 0 deletions src/common/components/ConnectGithubRigobot.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,201 @@
/* eslint-disable no-unused-vars */
import useTranslation from 'next-translate/useTranslation';
import {
Box, Button, Heading,
InputGroup, InputLeftAddon, Modal, ModalBody, ModalCloseButton, ModalContent,
ModalHeader, ModalOverlay, Stack, Text, Tooltip, useToast,
} from '@chakra-ui/react';
import { useState } from 'react';
import { useRouter } from 'next/router';
import { getStorageItem } from '../../utils';
import { RIGOBOT_HOST, BREATHECODE_HOST } from '../../utils/variables';
import bc from '../services/breathecode';
import useAuth from '../hooks/useAuth';
import Icon from './Icon';
import useStyle from '../hooks/useStyle';

function ConnectGithubRigobot({ ...rest }) {
const { t } = useTranslation('profile');
const { user, isAuthenticatedWithRigobot } = useAuth();

const toast = useToast();
const router = useRouter();
const [modalIsOpen, setModalIsOpen] = useState(false);
const accessToken = getStorageItem('accessToken');

const {
borderColor, backgroundColor, modal,
} = useStyle();

const hasGithub = user?.github && user.github.username !== '';

return (
<>
<Stack spacing={4} justifyContent="space-between" {...rest}>
<InputGroup>
<InputLeftAddon background={backgroundColor} border="1px solid" borderRadius="3px" borderColor="gray.default" height="3.125rem">
<Icon icon="github" width="24px" height="24px" />
</InputLeftAddon>
<Box
w="100%"
h="3.125rem"
border="1px solid"
borderRightRadius="3px"
display="flex"
borderColor="gray.default"
alignItems="center"
>
{hasGithub ? (
<>
<Text
margin={{ base: '0 14px 0 14px', sm: '0 0 0 24px' }}
textAlign="start"
cursor="default"
>
{user.github.username.replace(/(:?https?:\/\/)?(?:www\.)?github.com\//gm, '')}
</Text>
<Text
margin={{ base: '0 14px 0 auto', sm: '0 24px 0 auto' }}
textAlign="start"
color="blue.default"
cursor="pointer"
display="flex"
alignItems="center"
gridGap="6px"
textTransform="uppercase"
fontSize="14px"
onClick={() => {
setModalIsOpen(true);
}}
>
<Icon icon="close" width="10px" height="10px" />
{t('remove')}
</Text>
</>
) : (
<Text
margin={{ base: '0 14px 0 14px', sm: '0 0 0 24px' }}
textAlign="start"
color="blue.default"
cursor="pointer"
onClick={(e) => {
e.preventDefault();
window.location.href = `${BREATHECODE_HOST}/v1/auth/github/${accessToken}?url=${window.location.href}`;
}}
>
{t('connect-github')}
</Text>
)}
</Box>
</InputGroup>
<InputGroup>
<InputLeftAddon background={backgroundColor} border="1px solid" borderRadius="3px" borderColor="gray.default" height="3.125rem">
<Icon icon="rigobot-logo" width="24px" height="24px" />
</InputLeftAddon>
<Box
w="100%"
h="3.125rem"
border="1px solid"
borderRightRadius="3px"
display="flex"
borderColor="gray.default"
alignItems="center"
>
{isAuthenticatedWithRigobot ? (
<>
<Text
margin={{ base: '0 14px 0 14px', sm: '0 0 0 24px' }}
textAlign="start"
cursor="default"
>
{t('connected-with-rigobot')}
</Text>
</>
) : (
<Tooltip label={!user?.github?.username ? t('rigobot-requires-github-connection') : ''} placement="top">
<Button
variant="link"
fontSize="16px"
isDisabled={!user?.github?.username}
_hover={{ textDecoration: 'none' }}
margin={{ base: '0 14px 0 14px', sm: '0 0 0 24px' }}
textAlign="start"
color="blue.default"
cursor="pointer"
onClick={(e) => {
e.preventDefault();
if (user?.github?.username) {
window.open(`${RIGOBOT_HOST}/invite/?referer=4geeks&token=${accessToken}`, '_blank');
}
}}
>
{t('connect-rigobot')}
</Button>
</Tooltip>
)}
</Box>
</InputGroup>
</Stack>
<Modal isOpen={modalIsOpen} size="xl" margin="0 10px" onClose={() => setModalIsOpen(false)}>
<ModalOverlay />
<ModalContent background={modal.background}>
<ModalHeader borderBottom="1px solid" fontSize="15px" textTransform="uppercase" borderColor={borderColor} textAlign="center">
{t('remove-github-modal.title')}
</ModalHeader>
<ModalCloseButton />
<ModalBody padding={{ base: '26px 18px', md: '42px 36px' }}>
<Heading as="p" size="xsm" fontWeight="700" letterSpacing="0.05em" padding={{ base: '0 1rem 26px 1rem', md: '0 4rem 52px 4rem' }} textAlign="center">
{t('remove-github-modal.description')}
</Heading>
<Box display="flex" flexDirection={{ base: 'column', sm: 'row' }} gridGap="12px" justifyContent="space-around">
<Button
variant="outline"
onClick={() => setModalIsOpen(false)}
textTransform="uppercase"
fontSize="13px"
>
{t('common:close')}
</Button>
<Button
variant="default"
onClick={() => {
bc.auth().removeGithub()
.then(() => {
setModalIsOpen(false);
setTimeout(() => {
router.reload();
}, 1000);
toast({
position: 'top',
title: t('alert-message:any-removed', { any: 'GitHub' }),
description: t('alert-message:github-account-removed'),
status: 'success',
duration: 5000,
isClosable: true,
});
})
.catch(() => {
toast({
position: 'top',
title: t('alert-message:something-went-wrong'),
description: t('alert-message:error-removing-github'),
status: 'error',
duration: 5000,
isClosable: true,
});
});
}}
textTransform="uppercase"
fontSize="13px"
>
{t('common:confirm')}
</Button>
</Box>
</ModalBody>
</ModalContent>
</Modal>
</>
);
}

export default ConnectGithubRigobot;
3 changes: 1 addition & 2 deletions src/common/components/DirectAccessModal.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ import useStyle from '../hooks/useStyle';
import useSession from '../hooks/useSession';
import FieldForm from './Forms/FieldForm';
import Heading from './Heading';
import modifyEnv from '../../../modifyEnv';
import { setStorageItem, toCapitalize } from '../../utils';
import { BREATHECODE_HOST } from '../../utils/variables';
import { log } from '../../utils/logging';

function DirectAccessModal({ title, modalIsOpen }) {
Expand All @@ -22,7 +22,6 @@ function DirectAccessModal({ title, modalIsOpen }) {
const router = useRouter();
const locale = router?.locale;
// const technology = router?.query?.technology || 'Python';
const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
const toast = useToast();

const [formProps, setFormProps] = useState({
Expand Down
6 changes: 0 additions & 6 deletions src/common/components/EventCard.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,6 @@ function EventCard({ id, language, slug, title, ignoreDynamicHandler, descriptio
const [date, setDate] = useState('');
const { lightColor, featuredColor } = useStyle();
const startedButNotEnded = date?.started && date?.ended === false;
// const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
// const accessToken = getStorageItem('accessToken');

// const linkQuery = parseQuerys({
// token: accessToken || undefined,
// });

const startingSoonDelta = 30;

Expand Down
4 changes: 2 additions & 2 deletions src/common/components/Feedback.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import AlertMessage from './AlertMessage';
import useStyle from '../hooks/useStyle';
import useAuth from '../hooks/useAuth';
import { error } from '../../utils/logging';
import { BREATHECODE_HOST } from '../../utils/variables';
import { BREATHECODE_HOST, RIGOBOT_HOST } from '../../utils/variables';
import { reportDatalayer } from '../../utils/requests';

const base64regex = /^([0-9a-zA-Z+/]{4})*(([0-9a-zA-Z+/]{2}==)|([0-9a-zA-Z+/]{3}=))?$/;
Expand Down Expand Up @@ -117,7 +117,7 @@ function Feedback({ storyConfig }) {
<Text size="12px" textAlign="start" fontWeight="700">
{t('feedback.connect-rigobot-text')}
{' '}
<Link href={`https://rigobot.herokuapp.com/invite/?referer=4Geeks&token=${accessToken}`} color="currentcolor" textDecoration="underline" fontSize="12px" variant="default">
<Link href={`${RIGOBOT_HOST}/invite/?referer=4Geeks&token=${accessToken}`} color="currentcolor" textDecoration="underline" fontSize="12px" variant="default">
{t('feedback.connect-rigobot')}
</Link>
.
Expand Down
3 changes: 1 addition & 2 deletions src/common/components/Forms/LogIn.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,14 +12,13 @@ import Icon from '../Icon/index';
import validationSchema from './validationSchemas';
import useAuth from '../../hooks/useAuth';
import useStyle from '../../hooks/useStyle';
import modifyEnv from '../../../../modifyEnv';
import { BREATHECODE_HOST } from '../../../utils/variables';

function LogIn({ hideLabel, actionfontSize, callBack, disableRedirect }) {
const { t } = useTranslation('login');
const [showPSW, setShowPSW] = useState(false);
const { login } = useAuth();
const toast = useToast();
const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
// const router = useRouter();
const [curUrl, setUrl] = useState('');
useEffect(() => setUrl(typeof window !== 'undefined' ? window.location.href : ''), []);
Expand Down
4 changes: 1 addition & 3 deletions src/common/components/Forms/Register.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,18 +19,16 @@ import { useState } from 'react';
import PropTypes from 'prop-types';
import validationSchema from './validationSchemas';
import { getStorageItem, setStorageItem } from '../../../utils';
import modifyEnv from '../../../../modifyEnv';
import NextChakraLink from '../NextChakraLink';
import ModalInfo from '../../../js_modules/moduleMap/modalInfo';
import Text from '../Text';
import { SILENT_CODE } from '../../../lib/types';
import bc from '../../services/breathecode';
import useSession from '../../hooks/useSession';
import useSubscribeToPlan from '../../hooks/useSubscribeToPlan';
import { BASE_PLAN } from '../../../utils/variables';
import { BASE_PLAN, BREATHECODE_HOST } from '../../../utils/variables';

function Register({ setIsLoggedFromRegister }) {
const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
const { userSession } = useSession();
const { t } = useTranslation('login');
const [showAlreadyMember, setShowAlreadyMember] = useState(false);
Expand Down
4 changes: 1 addition & 3 deletions src/common/components/Forms/Signup.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,14 +19,13 @@ import PhoneInput from '../PhoneInput';
import Text from '../Text';
import useStyle from '../../hooks/useStyle';
import useSession from '../../hooks/useSession';
import { BASE_PLAN } from '../../../utils/variables';
import { BASE_PLAN, BREATHECODE_HOST } from '../../../utils/variables';
import { SILENT_CODE } from '../../../lib/types';
import { getStorageItem, setStorageItem, getQueryString } from '../../../utils';
import { reportDatalayer } from '../../../utils/requests';
import useSignup from '../../store/actions/signupAction';
import ModalInfo from '../../../js_modules/moduleMap/modalInfo';
import bc from '../../services/breathecode';
import modifyEnv from '../../../../modifyEnv';

function SignupForm({
planSlug, courseChoosed, showVerifyEmail, subscribeValues, buttonStyles,
Expand All @@ -43,7 +42,6 @@ function SignupForm({
return newValues;
}, {});

const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });
const { emailValidation, thriggerValidation } = useEmailValidation();
const { hexColor, featuredColor } = useStyle();
const plan = getQueryString('plan') || planSlug;
Expand Down
4 changes: 1 addition & 3 deletions src/common/components/LiveEvent/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,9 @@ import Text from '../Text';
import Icon from '../Icon';
import { isValidDate } from '../../../utils';
import OtherEvents from './OtherEvents';
import modifyEnv from '../../../../modifyEnv';
import MainEvent from './MainEvent';
import logoData from '../../../../public/logo.json';
import { WHITE_LABEL_ACADEMY } from '../../../utils/variables';
import { WHITE_LABEL_ACADEMY, BREATHECODE_HOST } from '../../../utils/variables';

function LiveEvent({
mainClasses,
Expand All @@ -44,7 +43,6 @@ function LiveEvent({
main: [],
other: [],
});
const BREATHECODE_HOST = modifyEnv({ queryString: 'host', env: process.env.BREATHECODE_HOST });

const bgColor2 = useColorModeValue('featuredLight', 'featuredDark');
const textColor = useColorModeValue('black', 'white');
Expand Down
5 changes: 1 addition & 4 deletions src/common/components/MarkDownParser/MDComponents/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -533,7 +533,7 @@ export function MDCheckbox({
}

export function OnlyForBanner({
children, permission, include, exclude, profile,
children, permission, include, exclude,
}) {
const allCapabilities = permission.split(',').concat(include.split(',').concat(exclude.split(',')));
log('md_permissions:', allCapabilities);
Expand All @@ -542,7 +542,6 @@ export function OnlyForBanner({
<OnlyFor
onlyMember
withBanner
profile={profile}
capabilities={allCapabilities}
>
{children}
Expand Down Expand Up @@ -621,13 +620,11 @@ MDText.propTypes = {
OnlyForBanner.propTypes = {
children: PropTypes.node.isRequired,
permission: PropTypes.string,
profile: PropTypes.objectOf(PropTypes.oneOfType([PropTypes.any])),
include: PropTypes.string,
exclude: PropTypes.string,
};
OnlyForBanner.defaultProps = {
permission: '',
profile: {},
include: '',
exclude: '',
};
Expand Down
Loading