Show warnings based on script selection

[undergroundwires]

Problem description

When using privacy.sexy, users can unintentionally create a "mixed state" selection that includes reversible and non-reversible scripts (see #68). This can lead to confusion and potentially irreversible system changes that users are not fully aware of or do not desire. The problem is the lack of clear, immediate feedback warning users when they have made such selections.

Proposed solution

Introduce a warning system in the UI that alerts users when:

1. They have a mixed state of reversible and non-reversible scripts
2. They include scripts outside of the 'Standard' recommendation
3. Their selection contains irreversible scripts.

This system should:

• Display warnings in an eye-catching color (red or yellow) above the action buttons.
• Use clear and concise language to explain the potential risks.
• Provide tooltips or a help icon with detailed information about the warnings for users who need more context.

Consideration: Irreversible script warning may confuse newbie users just here to select "Standard" and move on as standard pool contains non-intrusive irreversible scripts that delete unnecessary files. This warning could be excluded from this implementation, or use less-prominent color assuring users that these are typically safe and commonly accepted practices.

Alternatives considered

• An "I understand the risks" checkbox that must be ticked before allowing users to proceed with a mixed selection.
• Automatically separating irreversible scripts from the reversible ones upon selecting "Revert all," prompting users with an option to download or apply them separately.

Additional information

Future iterations could include a sanity check feature before running scripts, allowing users to review a flattened list of selected scripts with their revert status and manually include or exclude them. This would serve as a final review dialog, ensuring users are fully aware of the changes they're about to make.

This issue is created after discussions in #68.

[plantindesk]

I think the alternative will be better

An "I understand the risks" checkbox that must be ticked before allowing users to proceed with a mixed selection.

[undergroundwires]

@plantindesk.

Thanks for the feedback. Where should it be shown?

a) User tries to download or run the scripts, once they click the button a dialog is shown that's showing warning. b) It's shown above the action buttons, as illustrated in the first post with a checkbox.

a) seems less-confusing and simpler.

[plantindesk]

When it comes to a 1-page viewport, Option A is the most suitable choice. This is because selecting Option B would result in the page scrolling. Additionally, it's worth noting that if a user wants to access all the features within a particular category, such as Privacy Cleanup, having a "select all" function available is essential. This feature ensures that users can quickly and easily choose every item they wish to modify or delete without having to manually select each one individually. Ultimately, these considerations can help create a more seamless and efficient user interface design.

[undergroundwires]

Thank you for being active @plantindesk. I go with community ideas mostly. A few thought this would be better implementation, so let's go for this. It seems like implementing #50 will be better before these warnings. A dialog before running the script which lets you review everything you selected and exclude them if necessary. Once #50 is implemented, I can add this warnings or checkbox on that dialog.

For "select all" you can use Tree view on top right. But if we put "Select all" on card, feel free to share how the UI can be look like. I'd appreciate it if we can do it in separate issue so it's easier to track/manage. As it's very easy feature we can get this implemented pretty quick.

[plantindesk]

Shall I design the complete UI, drawing from my success creating one for ReactOS even though it didn't make the final cut due to insufficient unique features implementation of OS? Or will a simple dialogue box fulfill your needs? You can take a look at what I previously accomplished via this link: https://www.figma.com/proto/ICHGWdyNiYqmXjUxgHG3xE/ReactOS?node-id=2-12&scaling=scale-down-width&mode=design&t=td7c1XFVtMMEcESr-1.

[undergroundwires]

I believe I lack design with taste in general, so I'd be so happy with design suggestions.

I think we can start with #50, and in that dialog show this issue (warnings or checkboxes). I'd also appreciate a design suggestion or #49, it's one of the biggest new features that will be upcoming. If you want to suggest a complete redesign of UI, it's also welcome, but I cannot promise about timelines.

Again, happy to have you here as contributor. I believe the brain of the community is much bigger than brain of a single person, so I don't have strong opinions around these and try to listen as much as possible, time and resources is the only limitation to getting this up as quick as possible, but we are stronger together.

[plantindesk]

If you like me to rebuild the whole UI. What if I do this with Astro rather than Vue. Cause

• Its syntax are same as HTML
• It uses Islands as an architecture

The general idea of an “Islands” architecture is deceptively simple: render HTML pages on the server, and inject placeholders or slots around highly dynamic regions […] that can then be “hydrated” on the client into small self-contained widgets, reusing their server-rendered initial HTML.

• you can change its rendering mode using output configuration

I will go for the one you will say

[plantindesk]

Please tell me

[undergroundwires]

Hi @plantindesk. I was thinking that you'd just provide some sketches or drawings for inspiration, not any code or anything functional, that would be the biggest contribution so far if you could do that.

If you're able to build functional prototypes please take a look at my last post in #49. Rebuilding existing app does not give a lot of value, but to resolve #49 we can build a completely new app for rendering documentation where each page includes scripts etc (discussed in #49). This can be designed freely. I was considering Hugo, but Astro is totally fine, or can be even better. I'd appreciate TypeScript in that case as I find it much more maintainable. I can start working on providing you a JSON from a CLI so you can get all script data (names, documentation, code) so you have all the data in single file, but it requires significant work from my side to refactor the current project to be more modular (so compiler can produce JSON files), so we can work parallel.

Coming back to this issue about warnings, checkbox or preview before execution (#50), just some sketches will be enough so I can implement it in the existing Vue app.

[plantindesk]

Dialog Box For Warning And Confirmation

This is a sample preview of dialog box based on current situation/theme of application as you told ( did it in hurry :sweat_smile:)

Documentation Of Specific Script

Ok I will create a documentation of Every specific script

I will first show you UI/UX Design for it so that you can tell me if any part is remaining etc.

Just give me a sample format of elements should be there in docs

[plantindesk]

@undergroundwires what happened?

[undergroundwires]

Hi @plantindesk, I thought I commented on this, but did not seem to send it so all of it is lost 🤦.

Thank you for the contribution . This looks simple and good, we can go with this. It solves both this issue and

So the idea is to show only the selected scripts and then showing warning icons next to scripts when they can cause problems. It's easy to implement and quick win feature, I will add this. It will also solve #50.

[plantindesk]

So If we see from beginning,

• As you said, Issue #50 is solved
• For Issue #49 we will use Astro for building the documentation of each script

Right?

[undergroundwires]

Yes 👍, let's discuss further in #49.