Merge pull request #2093 from themeum/dev

3.8.0 Release

Author: shewa12

.babelrc

@@ -41,10 +41,9 @@ vendor/
 yarn.lock
 .env
 # Ignore Cypress screenshots
-cypress/screenshots/
+cypress/screenshots/*
 # Ignore Cypress fixtures
-cypress/fixtures/course.json
-cypress/fixtures/assets
+cypress/fixtures/*
 !cypress/fixtures/assets/tutor_bulk_enrollment_sample.csv
 # Ignore specific PNG files
 **/beforeEach*.png
@@ -53,4 +52,11 @@ launch.json
 /includes/droip
 
 # Copilot Instructions
-.github/copilot-instructions.md
+.github/copilot-instructions.md
+
+#rspack
+.swc
+assets/.rsdoctor
+
+*storybook.log
+storybook-static

.gitignore

@@ -0,0 +1,54 @@
+import type { StorybookConfig } from 'storybook-react-rsbuild';
+
+const config: StorybookConfig = {
+  stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: ['@storybook/addon-docs', '@storybook/addon-a11y', '@storybook/addon-themes'],
+  framework: {
+    name: 'storybook-react-rsbuild',
+    options: {},
+  },
+  rsbuildFinal: async (rsbuildConfig, { configType }) => {
+    // Ensure SWC loader uses the Emotion plugin, matching your main Rspack config
+    const isDevelopment = configType === 'DEVELOPMENT';
+
+    rsbuildConfig.tools = rsbuildConfig.tools || {};
+    rsbuildConfig.tools.swc = {
+      jsc: {
+        parser: {
+          syntax: 'typescript',
+          tsx: true,
+          decorators: false,
+        },
+        externalHelpers: true,
+        transform: {
+          react: {
+            runtime: 'automatic',
+            development: isDevelopment,
+            refresh: false,
+            importSource: '@emotion/react',
+          },
+        },
+        experimental: {
+          plugins: [
+            [
+              '@swc/plugin-emotion',
+              {
+                sourceMap: isDevelopment,
+                autoLabel: 'dev-only',
+                labelFormat: '[local]',
+                cssPropOptimization: true,
+              },
+            ],
+          ],
+        },
+      },
+      env: {
+        targets: 'Chrome >= 58, Firefox >= 54, Safari >= 10.1, Edge >= 16',
+      },
+    };
+
+    return rsbuildConfig;
+  },
+};
+
+export default config;

.storybook/main.ts

@@ -0,0 +1,42 @@
+import { Global, css } from '@emotion/react';
+import { withThemeFromJSXProvider } from '@storybook/addon-themes';
+import type { Preview } from '@storybook/react';
+
+import { tutorConfig } from '@TutorShared/config/config';
+import { typography } from '@TutorShared/config/typography';
+
+const GlobalStyles = () => (
+  <Global
+    styles={css`
+      *,
+      *::before,
+      *::after {
+        box-sizing: border-box;
+      }
+      body {
+        ${typography.body()}
+      }
+    `}
+  />
+);
+
+tutorConfig.tutor_url = tutorConfig.tutor_url || `${process.env.CYPRESS_base_url}/wp-content/plugins/tutor`;
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+
+  decorators: [
+    withThemeFromJSXProvider({
+      GlobalStyles,
+    }),
+  ],
+};
+
+export default preview;

.storybook/preview.tsx

@@ -435,24 +435,26 @@ document.addEventListener('DOMContentLoaded', function () {
 	 * On toggle switch change - show, hide setting's elements
 	 * @since 2.1.9
 	 */
-	function showHideToggleChildren(el) {
-		let isChecked = el.is(':checked')
-		let fields = el.data('toggle-fields').split(',')
+	function showHideToggleChildren(inputSwitchElement) {
+		let isChecked = inputSwitchElement.is(':checked')
+		let fields = inputSwitchElement.data('toggle-fields').split(',')
 		if (Array.isArray(fields) === false || fields.length === 0) return
 
 		fields = fields.map(s => s.trim());
 		isChecked
-			? fields.forEach((f) => $('#field_' + f).removeClass('tutor-hide-option'))
-			: fields.forEach((f) => $('#field_' + f).addClass('tutor-hide-option'))
-
-		let toggleWrapper = el.parent().parent().parent()
-		let sectionWrapper = el.parent().parent().parent().parent()
-		let visibleElements = sectionWrapper.find('.tutor-option-field-row').not('div.tutor-hide-option').length
+			? fields.forEach((f) => $(`#field_${f}`).removeClass('tutor-hide-option'))
+			: fields.forEach((f) => $(`#field_${f}`).addClass('tutor-hide-option'))
 
-		visibleElements === 1
-			? toggleWrapper.addClass('tutor-option-no-bottom-border')
-			: toggleWrapper.removeClass('tutor-option-no-bottom-border')
+		let tutorOptionFieldRow = inputSwitchElement.closest('.tutor-option-field-row')
+		let tutorOptionRowWrapper = inputSwitchElement.closest('.item-wrapper')
+		let visibleElements = tutorOptionRowWrapper.find('.tutor-option-field-row').not('div.tutor-hide-option')
 
+		if (visibleElements.length === 1) {
+			tutorOptionFieldRow.addClass('tutor-option-no-bottom-border')
+		} else {
+			tutorOptionFieldRow.removeClass('tutor-option-no-bottom-border')
+			visibleElements.last().addClass('tutor-option-no-bottom-border')
+		}
 	}
 
 	const btnToggles = $('input[type="checkbox"][data-toggle-fields]')

assets/fonts/tutor-v2.woff

@@ -1,7 +1,5 @@
-const { default: sprintf } = require("../../helper/sprintf");
-
 document.addEventListener("DOMContentLoaded", function(){
-   const { __, _x, _n, _nx } = wp.i18n; 
+   const { __, _x, _n, _nx, sprintf } = wp.i18n; 
    // Approve and Reject button
    const approveButton = document.querySelectorAll('.tutor-admin-open-withdraw-approve-modal');
    const rejectButton = document.querySelectorAll('.tutor-admin-open-withdraw-reject-modal');
@@ -155,5 +153,4 @@ document.addEventListener("DOMContentLoaded", function(){
             })
         }
     }
-
-});
+});