Skip to content

Commit

Permalink
Merge pull request #1751 from lumi-tip/development-lumi-8086
Browse files Browse the repository at this point in the history 
small refactor
  • Loading branch information
@tommygonzaleza
tommygonzaleza authored Jan 2, 2025
2 parents bddf599 + ada226a commit fa6c86c
Show file tree
Hide file tree
Showing 5 changed files with 86 additions and 70 deletions.
4 changes: 4 additions & 0 deletions public/locales/en/common.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,10 @@
"mark-as-done": "Mark as done",
"mark-as-not-done": "Mark as not done"
},
"external":{
"title": "This is an external exercise",
"description": "<strong>\"{{projectName}}\"</strong> is an external exercise you will redirected to a new tab to do it; choose one of the following options to start working on the project:"
},
"learnpack": {
"title": "This is a Learnpack interactive exercise",
"choose-open": "Choose how to open this project",
Expand Down
5 changes: 5 additions & 0 deletions public/locales/es/common.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,10 @@
"mark-as-done": "Marcar como hecho",
"mark-as-not-done": "Marcar como no hecho"
},
"external":{
"title": "Este es un ejercicio externo",
"description": "<strong>\"{{projectName}}\"</strong> es un ejercicio externo, serás redireccionado a una nueva pestaña para hacerlo; elige una de las siguientes opciones para comenzar a trabajar en el proyecto:"
},
"learnpack": {
"title": "Este es un ejercicio interactivo de Learnpack",
"choose-open": "Escoge como quieres abrir este proyecto",
Expand All @@ -159,6 +163,7 @@
"project": "proyecto",
"exercise": "ejercicio"
},
"start-exercise": "Empezar ejercicio",
"recommended": "Recomendado",
"open-in-learnpack-button": {
"text": "Abrir en la nube",
Expand Down
2 changes: 1 addition & 1 deletion src/common/services/breathecode.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -322,7 +322,7 @@ const breathecode = {
const qs = parseQuerys(query);
return {
get: () => axios.get(`${url}/asset${qs}`),
getAsset: (slug) => axios.get(`${url}/asset/${slug}`),
getAsset: (slug) => axios.get(`${url}/asset/${slug}${qs}`),
getAssetContext: (id) => axios.get(`${url}/asset/${id}/context`),
techs: () => axios.get(`${url}/academy/technology${qs}`),
techsBySort: () => axios.get(`${url}/technology${qs}`),
Expand Down
11 changes: 8 additions & 3 deletions src/js_modules/syllabus/ProjectInstructions.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -167,6 +167,8 @@ function ProjectInstructions({ currentAsset, variant, handleStartLearnpack }) {
const isForOpenLocaly = isInteractive || templateUrl;
const learnpackDeployUrl = currentAsset?.learnpack_deploy_url;

const isExternalExercise = currentAsset?.external && currentAsset?.asset_type === 'EXERCISE';

const startWithLearnpack = learnpackDeployUrl && cohortSession.available_as_saas && !noLearnpackIncluded.includes(currentAsset.slug);

if (variant === 'small') {
Expand Down Expand Up @@ -210,15 +212,18 @@ function ProjectInstructions({ currentAsset, variant, handleStartLearnpack }) {
<>
<Box background="blue.1100" borderRadius="11px" padding="16px">
<Box display="flex" gap="16px">
<Icon icon="learnpack" width="102px" height="102px" />
{!isExternalExercise && <Icon icon="learnpack" width="102px" height="102px" />}
<Box>
<Heading size="xsm" mb="15px" color="white">
{t('common:learnpack.title')}
{!isExternalExercise ? t('common:learnpack.title') : t('common:external.title')}
</Heading>
<Text
size="l"
color="white"
dangerouslySetInnerHTML={{ __html: t('common:learnpack.description', { projectName: currentTask?.title || currentAsset?.title }) }}
dangerouslySetInnerHTML={{
__html: !isExternalExercise ? t('common:learnpack.description', { projectName: currentAsset?.title || currentTask?.title })
: t('common:external.description', { projectName: currentAsset?.title || currentTask?.title }),
}}
/>
</Box>
</Box>
Expand Down
134 changes: 68 additions & 66 deletions src/pages/syllabus/[cohortSlug]/[lesson]/[lessonSlug]/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -259,10 +259,16 @@ function SyllabusContent() {
}, [currentTask]);

useEffect(() => {
const assetSlug = currentAsset?.translations[lang] || currentAsset?.translations?.us || currentAsset?.translations?.en || lessonSlug;
const translations = currentAsset?.translations
? Object.values(currentAsset.translations)
: [];

if (taskTodo.length > 0) {
setCurrentTask(taskTodo.find((el) => el.task_type === assetTypeValues[lesson]
&& (el.associated_slug === assetSlug || currentAsset?.aliases?.includes(el.associated_slug))));
const foundTask = taskTodo.find((el) => (
el.task_type === assetTypeValues[lesson]
&& (translations.includes(el.associated_slug) || currentAsset?.aliases?.includes(el.associated_slug))
));
setCurrentTask(foundTask);
}
}, [taskTodo, lessonSlug, lesson, currentAsset]);

Expand Down Expand Up @@ -376,6 +382,7 @@ function SyllabusContent() {
setCurrentBlankProps(null);
setSubTasks([]);
};

const onClickAssignment = (e, item) => {
const link = `/syllabus/${cohortSlug}/${item.type?.toLowerCase()}/${item.slug}`;

Expand All @@ -394,70 +401,65 @@ function SyllabusContent() {

useEffect(() => {
const currTask = sortedAssignments[currentModuleIndex]?.modules?.find((l) => l.slug === lessonSlug);
const englishTaskUrls = {
en: currTask?.translations?.en,
us: currTask?.translations?.us,
};
const currentLanguageTaskUrl = englishTaskUrls[lang] || currTask?.translations?.[lang]?.slug || lessonSlug;
if (currTask?.target === 'blank') {
setCurrentBlankProps(currTask);
} else if (currentBlankProps === null || currentBlankProps?.target !== 'blank') {
axios.get(`${BREATHECODE_HOST}/v1/registry/asset/${currentLanguageTaskUrl}?asset_type=${assetTypeValues[lesson]}`)
.then(({ data }) => {
const translations = data?.translations;
const exensionName = getExtensionName(data.readme_url);
const isIpynb = exensionName === 'ipynb';
const currentSlug = translations?.[language] || lessonSlug;
const urlPathname = data.readme_url ? data.readme_url.split('https://github.com')[1] : null;
const pathnameWithoutExtension = urlPathname ? urlPathname.split('.ipynb')[0] : null;
const extension = urlPathname ? urlPathname.split('.').pop() : null;
// const translatedExtension = language === 'us' ? '' : `.${language}`;
const finalPathname = `${pathnameWithoutExtension}.${extension}`;

setReadmeUrlPathname(finalPathname);
let currentTranslationSlug = data?.lang === language ? data?.slug : data.translations[language];
if (isIpynb) {
setIpynbHtmlUrl(`${BREATHECODE_HOST}/v1/registry/asset/preview/${currentSlug}?plain=true`);
setCurrentAsset(data);
} else {
setIpynbHtmlUrl(null);
if (currentTranslationSlug === undefined) {
currentTranslationSlug = `${lessonSlug}-${language}`;
const currentLanguageTaskUrl = currTask?.translations?.[lang === 'en' ? 'us' : lang]?.slug || lessonSlug;
bc.lesson({ asset_type: assetTypeValues[lesson] }).getAsset(currentLanguageTaskUrl).then(({ data }) => {
const translations = data?.translations;
const exensionName = getExtensionName(data.readme_url);
const isIpynb = exensionName === 'ipynb';
const currentSlug = translations?.[language] || lessonSlug;
const urlPathname = data.readme_url ? data.readme_url.split('https://github.com')[1] : null;
const pathnameWithoutExtension = urlPathname ? urlPathname.split('.ipynb')[0] : null;
const extension = urlPathname ? urlPathname.split('.').pop() : null;
const finalPathname = `${pathnameWithoutExtension}.${extension}`;

if (currTask?.target === 'blank') {
setCurrentAsset(data);
return;
}

setReadmeUrlPathname(finalPathname);
let currentTranslationSlug = data?.lang === language ? data?.slug : data.translations[language];
if (isIpynb) {
setIpynbHtmlUrl(`${BREATHECODE_HOST}/v1/registry/asset/preview/${currentSlug}?plain=true`);
setCurrentAsset(data);
} else {
setIpynbHtmlUrl(null);
if (currentTranslationSlug === undefined) {
currentTranslationSlug = `${lessonSlug}-${language}`;
}
Promise.all([
axios.get(`${BREATHECODE_HOST}/v1/registry/asset/${currentTranslationSlug}.md`),
axios.get(`${BREATHECODE_HOST}/v1/registry/asset/${currentTranslationSlug}?asset_type=${assetTypeValues[lesson]}`),
])
.then(([respMarkdown, respData]) => {
const currData = respData.data;
const markdownData = respMarkdown.data;

if (lesson === 'answer') {
setQuizSlug(currentTranslationSlug);
} else {
setQuizSlug(null);
}
Promise.all([
axios.get(`${BREATHECODE_HOST}/v1/registry/asset/${currentTranslationSlug}.md`),
axios.get(`${BREATHECODE_HOST}/v1/registry/asset/${currentTranslationSlug}?asset_type=${assetTypeValues[lesson]}`),
])
.then(([respMarkdown, respData]) => {
const currData = respData.data;
const markdownData = respMarkdown.data;

if (lesson === 'answer') {
setQuizSlug(currentTranslationSlug);
} else {
setQuizSlug(null);
}
if (currData !== undefined && typeof markdownData === 'string') {
// Binary base64 decoding ⇢ UTF-8
const markdown = getMarkDownContent(markdownData);
setReadme(markdown);
setCurrentAsset(currData);
}
})
.catch(() => {
setReadme({
content: t('no-traduction-found-description'),
});
setCurrentAsset({
...data,
title: t('no-traduction-found'),
});
});
}
}).catch(() => {
EventIfNotFound();
});
}
if (currData !== undefined && typeof markdownData === 'string') {
// Binary base64 decoding ⇢ UTF-8
const markdown = getMarkDownContent(markdownData);
setReadme(markdown);
setCurrentAsset(currData);
}
})
.catch(() => {
setReadme({
content: t('no-traduction-found-description'),
});
setCurrentAsset({
...data,
title: t('no-traduction-found'),
});
});
}
}).catch(() => {
EventIfNotFound();
});
return () => {
cleanCurrentData();
setUserSession({
Expand Down

0 comments on commit fa6c86c

Please sign in to comment.