@learnpack/learnpack 5.0.270 → 5.0.274

package/src/commands/translate.ts

@@ -1,123 +1,123 @@
-import SessionCommand from "../utils/SessionCommand"
-import * as fs from "fs"
-import * as path from "path"
-import * as prompts from "prompts"
-import { translateExercise } from "../utils/rigoActions"
-import SessionManager from "../managers/session"
-import Console from "../utils/console"
-import { saveTranslatedReadme } from "../utils/creatorUtilities"
-
-// This function list the names of the exercise directories inside the ./exercises folder, if the exercises folder doesn't exist, it will look for the ./.learn/exercises folder
-const listExercises = async () => {
-  const exercisesDir = path.join(process.cwd(), "exercises")
-  const learnExercisesDir = path.join(process.cwd(), ".learn", "exercises")
-
-  const exercises = fs.readdirSync(exercisesDir).filter(file => {
-    return fs.statSync(path.join(exercisesDir, file)).isDirectory()
-  })
-
-  if (exercises.length > 0) {
-    return exercises
-  }
-
-  return fs.readdirSync(learnExercisesDir).filter(file => {
-    return fs.statSync(path.join(learnExercisesDir, file)).isDirectory()
-  })
-}
-
-const getReadmeForExercise = async (exercise: string) => {
-  const readmePath = path.join(
-    process.cwd(),
-    "exercises",
-    exercise,
-    "README.md"
-  )
-  return fs.readFileSync(readmePath, "utf8")
-}
-
-export default class BuildCommand extends SessionCommand {
-  static description =
-    "List all the lessons, the user is able of select many of them to translate to the given languages"
-
-  async init() {
-    const { flags } = this.parse(BuildCommand)
-    await this.initSession(flags)
-  }
-
-  async run() {
-    const { flags } = this.parse(BuildCommand)
-
-    const exercises = await listExercises()
-
-    const exercisesToTranslate = await prompts([
-      {
-        type: "multiselect",
-        name: "exercises",
-        message: "Select the exercises to translate",
-        choices: exercises.map(exercise => ({
-          title: exercise,
-          value: exercise,
-        })),
-      },
-      {
-        type: "text",
-        name: "output_language",
-        message:
-          "Write the languages to translate to comma separated. Example: English, Spanish, French",
-        initial: "Spanish",
-      },
-    ])
-
-    const configObject = this.configManager?.get()
-
-    if (configObject) {
-      // build exerises
-      Console.debug("Building exercises")
-      this.configManager?.buildIndex()
-    }
-
-    let sessionPayload = await SessionManager.getPayload()
-    if (!sessionPayload || !sessionPayload.rigobot) {
-      Console.error("You must be logged in to upload a LearnPack package")
-      try {
-        sessionPayload = await SessionManager.login()
-      } catch (error) {
-        Console.error("Error trying to authenticate")
-        Console.error((error as TypeError).message || (error as string))
-      }
-    }
-
-    const rigoToken = sessionPayload.rigobot.key
-
-    await Promise.all(
-      exercisesToTranslate.exercises.map(async (exercise: string) => {
-        await Promise.all(
-          exercisesToTranslate.output_language
-            .split(",")
-            .map(async (language: string) => {
-              const readme = await getReadmeForExercise(exercise)
-              const response = await translateExercise(
-                rigoToken,
-                {
-                  text_to_translate: readme,
-                  output_language: language,
-                },
-                `${process.env.HOST}/webhooks/translate-exercise`
-              )
-
-              await saveTranslatedReadme(
-                exercise,
-                response.parsed.output_language_code,
-                response.parsed.translation
-              )
-              Console.success(
-                `Translated ${exercise} to ${language} successfully`
-              )
-            })
-        )
-      })
-    )
-
-    this.exit(0)
-  }
-}
+import SessionCommand from "../utils/SessionCommand"
+import * as fs from "fs"
+import * as path from "path"
+import * as prompts from "prompts"
+import { translateExercise } from "../utils/rigoActions"
+import SessionManager from "../managers/session"
+import Console from "../utils/console"
+import { saveTranslatedReadme } from "../utils/creatorUtilities"
+
+// This function list the names of the exercise directories inside the ./exercises folder, if the exercises folder doesn't exist, it will look for the ./.learn/exercises folder
+const listExercises = async () => {
+  const exercisesDir = path.join(process.cwd(), "exercises")
+  const learnExercisesDir = path.join(process.cwd(), ".learn", "exercises")
+
+  const exercises = fs.readdirSync(exercisesDir).filter(file => {
+    return fs.statSync(path.join(exercisesDir, file)).isDirectory()
+  })
+
+  if (exercises.length > 0) {
+    return exercises
+  }
+
+  return fs.readdirSync(learnExercisesDir).filter(file => {
+    return fs.statSync(path.join(learnExercisesDir, file)).isDirectory()
+  })
+}
+
+const getReadmeForExercise = async (exercise: string) => {
+  const readmePath = path.join(
+    process.cwd(),
+    "exercises",
+    exercise,
+    "README.md"
+  )
+  return fs.readFileSync(readmePath, "utf8")
+}
+
+export default class BuildCommand extends SessionCommand {
+  static description =
+    "List all the lessons, the user is able of select many of them to translate to the given languages"
+
+  async init() {
+    const { flags } = this.parse(BuildCommand)
+    await this.initSession(flags)
+  }
+
+  async run() {
+    const { flags } = this.parse(BuildCommand)
+
+    const exercises = await listExercises()
+
+    const exercisesToTranslate = await prompts([
+      {
+        type: "multiselect",
+        name: "exercises",
+        message: "Select the exercises to translate",
+        choices: exercises.map(exercise => ({
+          title: exercise,
+          value: exercise,
+        })),
+      },
+      {
+        type: "text",
+        name: "output_language",
+        message:
+          "Write the languages to translate to comma separated. Example: English, Spanish, French",
+        initial: "Spanish",
+      },
+    ])
+
+    const configObject = this.configManager?.get()
+
+    if (configObject) {
+      // build exerises
+      Console.debug("Building exercises")
+      this.configManager?.buildIndex()
+    }
+
+    let sessionPayload = await SessionManager.getPayload()
+    if (!sessionPayload || !sessionPayload.rigobot) {
+      Console.error("You must be logged in to upload a LearnPack package")
+      try {
+        sessionPayload = await SessionManager.login()
+      } catch (error) {
+        Console.error("Error trying to authenticate")
+        Console.error((error as TypeError).message || (error as string))
+      }
+    }
+
+    const rigoToken = sessionPayload.rigobot.key
+
+    await Promise.all(
+      exercisesToTranslate.exercises.map(async (exercise: string) => {
+        await Promise.all(
+          exercisesToTranslate.output_language
+            .split(",")
+            .map(async (language: string) => {
+              const readme = await getReadmeForExercise(exercise)
+              const response = await translateExercise(
+                rigoToken,
+                {
+                  text_to_translate: readme,
+                  output_language: language,
+                },
+                `${process.env.HOST}/webhooks/translate-exercise`
+              )
+
+              await saveTranslatedReadme(
+                exercise,
+                response.parsed.output_language_code,
+                response.parsed.translation
+              )
+              Console.success(
+                `Translated ${exercise} to ${language} successfully`
+              )
+            })
+        )
+      })
+    )
+
+    this.exit(0)
+  }
+}

package/src/creator/README.md

@@ -1,54 +1,54 @@
-# React + TypeScript + Vite
-
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
-
-Currently, two official plugins are available:
-
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
-
-```js
-export default tseslint.config({
-  extends: [
-    // Remove ...tseslint.configs.recommended and replace with this
-    ...tseslint.configs.recommendedTypeChecked,
-    // Alternatively, use this for stricter rules
-    ...tseslint.configs.strictTypeChecked,
-    // Optionally, add this for stylistic rules
-    ...tseslint.configs.stylisticTypeChecked,
-  ],
-  languageOptions: {
-    // other options...
-    parserOptions: {
-      project: ["./tsconfig.node.json", "./tsconfig.app.json"],
-      tsconfigRootDir: import.meta.dirname,
-    },
-  },
-})
-```
-
-You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
-
-```js
-// eslint.config.js
-import reactX from "eslint-plugin-react-x"
-import reactDom from "eslint-plugin-react-dom"
-
-export default tseslint.config({
-  plugins: {
-    // Add the react-x and react-dom plugins
-    "react-x": reactX,
-    "react-dom": reactDom,
-  },
-  rules: {
-    // other rules...
-    // Enable its recommended typescript rules
-    ...reactX.configs["recommended-typescript"].rules,
-    ...reactDom.configs.recommended.rules,
-  },
-})
-```
+# React + TypeScript + Vite
+
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+
+Currently, two official plugins are available:
+
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default tseslint.config({
+  extends: [
+    // Remove ...tseslint.configs.recommended and replace with this
+    ...tseslint.configs.recommendedTypeChecked,
+    // Alternatively, use this for stricter rules
+    ...tseslint.configs.strictTypeChecked,
+    // Optionally, add this for stylistic rules
+    ...tseslint.configs.stylisticTypeChecked,
+  ],
+  languageOptions: {
+    // other options...
+    parserOptions: {
+      project: ["./tsconfig.node.json", "./tsconfig.app.json"],
+      tsconfigRootDir: import.meta.dirname,
+    },
+  },
+})
+```
+
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
+
+```js
+// eslint.config.js
+import reactX from "eslint-plugin-react-x"
+import reactDom from "eslint-plugin-react-dom"
+
+export default tseslint.config({
+  plugins: {
+    // Add the react-x and react-dom plugins
+    "react-x": reactX,
+    "react-dom": reactDom,
+  },
+  rules: {
+    // other rules...
+    // Enable its recommended typescript rules
+    ...reactX.configs["recommended-typescript"].rules,
+    ...reactDom.configs.recommended.rules,
+  },
+})
+```

package/src/creator/eslint.config.js

@@ -1,28 +1,28 @@
-import js from "@eslint/js"
-import globals from "globals"
-import reactHooks from "eslint-plugin-react-hooks"
-import reactRefresh from "eslint-plugin-react-refresh"
-import tseslint from "typescript-eslint"
-
-export default tseslint.config(
-  { ignores: ["dist"] },
-  {
-    extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ["**/*.{ts,tsx}"],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-    },
-    plugins: {
-      "react-hooks": reactHooks,
-      "react-refresh": reactRefresh,
-    },
-    rules: {
-      ...reactHooks.configs.recommended.rules,
-      "react-refresh/only-export-components": [
-        "warn",
-        { allowConstantExport: true },
-      ],
-    },
-  }
-)
+import js from "@eslint/js"
+import globals from "globals"
+import reactHooks from "eslint-plugin-react-hooks"
+import reactRefresh from "eslint-plugin-react-refresh"
+import tseslint from "typescript-eslint"
+
+export default tseslint.config(
+  { ignores: ["dist"] },
+  {
+    extends: [js.configs.recommended, ...tseslint.configs.recommended],
+    files: ["**/*.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      "react-hooks": reactHooks,
+      "react-refresh": reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      "react-refresh/only-export-components": [
+        "warn",
+        { allowConstantExport: true },
+      ],
+    },
+  }
+)

package/src/creator/src/components/syllabus/ContentIndex.tsx

@@ -247,7 +247,7 @@ export const ContentIndex = ({
           <>
             <ContentSecondaryHeader messages={messages} />
             {syllabus.lessons.length === 0 && messages.length < 3 && (
-              <div className="text-center text-gray-200 font-bold text-lg">
+              <div className="text-center text-gray-500 font-bold text-lg h-[50vh] flex items-center justify-center">
                 {t("contentIndex.noLessons")}
               </div>
             )}

package/src/creator/src/components/syllabus/SyllabusEditor.tsx

@@ -44,6 +44,7 @@ const SyllabusEditor: React.FC = () => {
     messages,
     setMessages,
     technologies,
+    mode,
   } = useStore(
     useShallow((state) => ({
       history: state.history,
@@ -55,6 +56,7 @@ const SyllabusEditor: React.FC = () => {
       // formState: state.formState,
       setMessages: state.setMessages,
       technologies: state.technologies,
+      mode: state.mode,
     }))
   )
 
@@ -233,7 +235,7 @@ const SyllabusEditor: React.FC = () => {
 
     const timeout = setTimeout(() => {
       cleanAll()
-      window.location.href = `/preview/${syllabus.courseInfo.slug}?token=${auth.bcToken}&language=${syllabus.courseInfo.language}`
+      window.location.href = `/preview/${syllabus.courseInfo.slug}?token=${auth.bcToken}&language=${syllabus.courseInfo.language}&mode=${mode}`
     }, 8000)
     try {
       await createCourse(syllabus, tokenToUse, auth.bcToken)

package/src/creator/src/i18n.ts

@@ -1,28 +1,28 @@
-// src/i18n.ts
-import i18n from "i18next"
-import { initReactI18next } from "react-i18next"
-import LanguageDetector from "i18next-browser-languagedetector"
-
-import enTranslation from "./locales/en.json"
-import esTranslation from "./locales/es.json"
-
-i18n
-  .use(LanguageDetector)
-  .use(initReactI18next)
-  .init({
-    resources: {
-      en: { translation: enTranslation },
-      es: { translation: esTranslation },
-    },
-    fallbackLng: "en",
-    interpolation: {
-      escapeValue: false,
-    },
-    detection: {
-      // Puedes personalizar el orden de detección si lo deseas
-      order: ["querystring", "localStorage", "navigator"],
-      caches: ["localStorage"],
-    },
-  })
-
-export default i18n
+// src/i18n.ts
+import i18n from "i18next"
+import { initReactI18next } from "react-i18next"
+import LanguageDetector from "i18next-browser-languagedetector"
+
+import enTranslation from "./locales/en.json"
+import esTranslation from "./locales/es.json"
+
+i18n
+  .use(LanguageDetector)
+  .use(initReactI18next)
+  .init({
+    resources: {
+      en: { translation: enTranslation },
+      es: { translation: esTranslation },
+    },
+    fallbackLng: "en",
+    interpolation: {
+      escapeValue: false,
+    },
+    detection: {
+      // Puedes personalizar el orden de detección si lo deseas
+      order: ["querystring", "localStorage", "navigator"],
+      caches: ["localStorage"],
+    },
+  })
+
+export default i18n