Mirrors/Stirling-PDF
Mirrors/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Frooodle/Stirling-PDF.git synced 2025-11-16 01:21:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(frontend): refactor ToolStep props handling and children usage (#4524)

Browse Source 
# Description of Changes

- Replaced `children` being passed as a prop to `React.createElement`
with proper usage as additional arguments (fixes
`react/no-children-prop` warning).
- Added stricter handling of `isVisible` and `_excludeFromCount` props
with improved variable naming (`stepProps`) for clarity.
- Refactored JSX structure for collapsed/expanded rendering logic to
improve readability.

This change was made to clean up prop handling, remove ESLint warnings,
and make the component more consistent with React best practices.

---

## Checklist

### General

- [ ] I have read the [Contribution
Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
- [ ] I have read the [Stirling-PDF Developer
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md)
(if applicable)
- [ ] I have read the [How to add new languages to
Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md)
(if applicable)
- [ ] I have performed a self-review of my own code
- [ ] My changes generate no new warnings

### Documentation

- [ ] I have updated relevant docs on [Stirling-PDF's doc
repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/)
(if functionality has heavily changed)
- [ ] I have read the section [Add New Translation
Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags)
(for new translation tags only)

### UI Changes (if applicable)

- [ ] Screenshots or videos demonstrating the UI changes are attached
(e.g., as comments or direct attachments in the PR)

### Testing (if applicable)

- [ ] I have tested my changes locally. Refer to the [Testing
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing)
for more details.

---------

Co-authored-by: Reece Browne <74901996+reecebrowne@users.noreply.github.com>
This commit is contained in:
Ludy 2025-09-29 13:51:42 +02:00 committed by GitHub
parent c19abe0da7
commit 4ab66fdf14
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
frontend/src/components/tools/shared/ToolStep.tsx
View File

@ -164,13 +164,16 @@ export function createToolSteps() {
const isVisible = props.isVisible !== false; const isVisible = props.isVisible !== false;
const currentStepNumber = isVisible ? stepNumber++ : undefined; const currentStepNumber = isVisible ? stepNumber++ : undefined;
const step = React.createElement(ToolStep, { const step = React.createElement(
...props, ToolStep,
title, {
_stepNumber: currentStepNumber, ...props,
children, title,
key: `step-${title.toLowerCase().replace(/\s+/g, '-')}` _stepNumber: currentStepNumber,
}); key: `step-${title.toLowerCase().replace(/\s+/g, '-')}`
},
children
);
steps.push(step); steps.push(step);
return step; return step;
@ -186,9 +189,9 @@ export function createToolSteps() {
const getVisibleCount = () => { const getVisibleCount = () => {
return steps.filter(step => { return steps.filter(step => {
const props = step.props as ToolStepProps; const stepProps = step.props as ToolStepProps;
const isVisible = props.isVisible !== false; const isVisible = stepProps.isVisible !== false;
const excludeFromCount = props._excludeFromCount === true; const excludeFromCount = stepProps._excludeFromCount === true;
return isVisible && !excludeFromCount; return isVisible && !excludeFromCount;
}).length; }).length;
}; };
@ -203,9 +206,9 @@ export function ToolStepProvider({ children, forceStepNumbers }: { children: Rea
let count = 0; let count = 0;
React.Children.forEach(children, (child) => { React.Children.forEach(children, (child) => {
if (React.isValidElement(child) && child.type === ToolStep) { if (React.isValidElement(child) && child.type === ToolStep) {
const props = child.props as ToolStepProps; const stepProps = child.props as ToolStepProps;
const isVisible = props.isVisible !== false; const isVisible = stepProps.isVisible !== false;
const excludeFromCount = props._excludeFromCount === true; const excludeFromCount = stepProps._excludeFromCount === true;
if (isVisible && !excludeFromCount) count++; if (isVisible && !excludeFromCount) count++;
} }
}); });