fix(web): Pension calculator toggled off

[RunarVestmann]

Pension calculator - add a "feature flag" in json config that allows us to "turn off" the pension calculator

Summary by CodeRabbit

• New Features

  • Introduced conditional rendering for the Pension Calculator based on a new configuration parameter, allowing users to see a message when the service is turned off.
  • Enhanced the Pension Calculator Results page with updated UI elements that reflect the availability of the feature.
  • Added localization support for a message indicating when the calculator is turned off, improving user feedback.

• Bug Fixes

  • Corrected the logic for displaying the pension calculator interface and results based on the new configuration.

[coderabbitai]

Walkthrough

The changes involve modifications to the PensionCalculator.tsx, PensionCalculatorResults.tsx, and translationStrings.ts files to implement a new configuration parameter, isTurnedOff. This parameter determines the rendering of the pension calculator interface and results display. If isTurnedOff is true, a message indicating that the service is turned off is shown; otherwise, the original user interface for pension calculations is retained. Additionally, a new message for localization regarding the feature's status has been added.

Changes

Files	Change Summary
apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorResults.tsx	Introduced isTurnedOff constant to conditionally render UI elements based on configuration.
apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts	Added isTurnedOff message to support localization for the feature being turned off.

---

Recent review details

Configuration used: .coderabbit.yaml
Review profile: CHILL

Commits

Files that changed from the base of the PR and between f404457 and 7ec5a44.

Files selected for processing (3)

• apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx (2 hunks)
• apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorResults.tsx (3 hunks)
• apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts (1 hunks)

Additional context used

Path-based instructions (3)

apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorResults.tsx (1)

Pattern apps/**/*: "Confirm that the code adheres to the following:

• NextJS best practices, including file structure, API routes, and static generation methods.
• Efficient state management and server-side rendering techniques.
• Optimal use of TypeScript for component and utility type safety."

apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts (1)

Pattern apps/**/*: "Confirm that the code adheres to the following:

• NextJS best practices, including file structure, API routes, and static generation methods.
• Efficient state management and server-side rendering techniques.
• Optimal use of TypeScript for component and utility type safety."

apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx (1)

Pattern apps/**/*: "Confirm that the code adheres to the following:

• NextJS best practices, including file structure, API routes, and static generation methods.
• Efficient state management and server-side rendering techniques.
• Optimal use of TypeScript for component and utility type safety."

Additional comments not posted (7)

apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorResults.tsx (2)

271-271: LGTM!

The code correctly extracts the value of isTurnedOff from customPageData.configJson using the nullish coalescing operator and defaults to false if the property is not defined.

---

283-303: LGTM!

The conditional rendering logic based on the value of isTurnedOff is implemented correctly:

• If isTurnedOff is true, a simplified layout is rendered with a clear message indicating that the feature is turned off.
• If isTurnedOff is false, the original layout is preserved, maintaining the existing functionality.

The code adheres to the NextJS best practices and efficiently uses TypeScript for type safety.

Also applies to: 305-419

apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts (1)

4-8: LGTM!

The new message definition for isTurnedOff looks good. It includes the necessary components: a unique identifier, a default message in Icelandic, and a description clarifying its usage.

apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx (4)

440-440: LGTM!

The introduction of the isTurnedOff constant provides a clean way to control the rendering of the pension calculator interface based on configuration. Defaulting it to true is a safe approach.

---

452-470: LGTM!

The conditional rendering of the "turned off" message based on the isTurnedOff flag is implemented correctly. Using the GridContainer and GridColumn components ensures consistent layout styling.

---

471-1168: LGTM!

The conditional rendering of the pension calculator form based on the isTurnedOff flag is implemented correctly. The use of react-hook-form provides a solid foundation for form management, and the onSubmit function properly handles form submission.

The dynamic nature of the form, with fields conditionally rendered based on the selected typeOfBasePension, enhances the user experience by presenting relevant fields.

Populating the form with defaultValues is a nice touch to persist user input across sessions.

---

481-526: LGTM!

The rendering of the main title, introduction text, and "date of calculations" dropdown is implemented correctly.

Using the SelectController component for the dropdown provides a consistent look and feel with other form fields. The useQueryState hook is a good choice for managing the selected date, as it allows the value to persist across page refreshes and be shared via the URL.

Passing the dateOfCalculationsOptions as a prop is a flexible approach, enabling dynamic configuration of the available dates.

---

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share

• X
• Mastodon
• Reddit
• LinkedIn

Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai generate interesting stats about this repository and render them as a table.
  • @coderabbitai show all the console.log statements in this repository.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 76 lines in your changes missing coverage. Please review.

Project coverage is 36.83%. Comparing base (f404457) to head (7ec5a44).
Report is 1 commits behind head on main.

Files with missing lines	Patch %	Lines
...ocialInsuranceAdministration/PensionCalculator.tsx	0.00%	63 Missing ⚠️
...suranceAdministration/PensionCalculatorResults.tsx	0.00%	13 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main   #15951      +/-   ##
==========================================
- Coverage   36.84%   36.83%   -0.01%     
==========================================
  Files        6693     6693              
  Lines      137245   137256      +11     
  Branches    39030    39041      +11     
==========================================
  Hits        50562    50562              
- Misses      86683    86694      +11     

Flag	Coverage Δ
web	1.85% <0.00%> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
...ocialInsuranceAdministration/translationStrings.ts	0.00% <ø> (ø)
...suranceAdministration/PensionCalculatorResults.tsx	0.00% <0.00%> (ø)
...ocialInsuranceAdministration/PensionCalculator.tsx	0.00% <0.00%> (ø)

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update f404457...7ec5a44. Read the comment docs.

[datadog-island-is]

Datadog Report

Branch report: fix/web-pension-calculator-toggle-off
Commit report: 2dc4ff1
Test service: web

✅ 0 Failed, 84 Passed, 0 Skipped, 31.64s Total Time
➡️ Test Sessions change in coverage: 1 no change