SA8.TV008 - Painel estratégico - melhoria no gráfico by mateusmrosa · Pull Request #339 · AppCivico/smae

mateusmrosa · 2025-06-05T17:08:43Z

Summary by CodeRabbit

New Features
- Added an option to configure text alignment for chart names in bar charts.
Style
- Improved bar chart appearance with rounded top corners on bars.
- Updated label styles: labels are now positioned above the bars, aligned to the left, use the legend color, and are rotated for better readability.

coderabbitai · 2025-06-05T17:08:50Z

Walkthrough

The changes introduce an optional nameTextStyle property to the ChartDataDto class and update the bar chart configuration in the transfer analysis service. The chart's x-axis and series label styling are enhanced, including text alignment, label color, rotation, and bar border radius, affecting the chart's appearance.

Changes

File(s)	Change Summary
backend/src/casa-civil/dash/dto/transferencia.dto.ts	Added optional `nameTextStyle` property to `ChartDataDto` for name text alignment configuration.
backend/src/casa-civil/dash/transferencia.service.ts	Updated bar chart config: added x-axis name text alignment, refined label styling, and bar rounding.

Sequence Diagram(s)

sequenceDiagram
    participant Service as transferencia.service.ts
    participant Chart as Bar Chart

    Service->>Chart: Configure chartValPorOrgao
    Chart-->>Service: Set xAxis nameTextStyle (align: right)
    loop For each etapa (stage)
        Service->>Chart: Add series without 'stack', with itemStyle (rounded top)
        Service->>Chart: Set label (position: top, align: left, color, rotate 90, verticalAlign: middle)
    end
    Chart-->>Service: Render updated chart with new styling

Poem

In the land of charts, a tweak appears,
With labels now rotated, alignment clears.
Bars with rounded tops, colors anew,
Text aligned right, for a stylish view.
A rabbit hops by, with a chart in its paw—
"Such lovely details, hurrah hurrah!"

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 4520fc0 and cd2cc39.

📒 Files selected for processing (2)

backend/src/casa-civil/dash/dto/transferencia.dto.ts (1 hunks)
backend/src/casa-civil/dash/transferencia.service.ts (2 hunks)

🔇 Additional comments (3)

backend/src/casa-civil/dash/dto/transferencia.dto.ts (1)

217-219: LGTM! Clean addition for chart text styling.

The optional nameTextStyle property is well-structured and properly typed. It follows the existing pattern of chart configuration properties and enables text alignment customization for chart elements.
backend/src/casa-civil/dash/transferencia.service.ts (2)

690-692: LGTM! Proper usage of the new DTO property.

The nameTextStyle configuration correctly uses the structure defined in the ChartDataDto and provides right alignment for the x-axis text.

723-737:
Details

❓ Verification inconclusive

Enhanced chart styling looks good, but verify label positioning.

The improvements include:

Rounded bar corners for better visual appeal

Label positioning changes from 'inside' to 'top' with rotation

Color coordination between labels and legend

However, consider verifying that the rotated labels at the 'top' position don't overlap when there are many bars with similar values, especially since they're now aligned to the 'left' and rotated 90 degrees.

🏁 Script executed:
#!/bin/bash
# Description: Check if there are any similar chart configurations that might help validate the label positioning approach

# Search for other chart configurations with label positioning
rg -A 10 -B 5 "position.*top.*align.*left" --type ts

# Look for other uses of rotated labels in charts
rg -A 5 -B 5 "rotate.*90" --type ts
Length of output: 1157
Verify rotated label placement in transferencia.chart

Please ensure that the new rotate: 90 labels positioned at the top and left won’t overlap when rendering many bars with similar values—no other instances of this exact configuration were found in the repo for reference.

• File: backend/src/casa-civil/dash/transferencia.service.ts (lines 723–737)
• No other occurrences of position: 'top' + align: 'left' + rotate: 90 were detected—manual edge-case testing is advised.
• If labels overlap, consider dynamically hiding low-priority labels or adjusting spacing.

✨ Finishing Touches

📝 Generate Docstrings

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

🪧 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>, please review it.
- Explain this complex logic.
- 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 explain this code block.
- @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 gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @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.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

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 generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this 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.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

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.

…painel estratégico

sonarqubecloud · 2025-06-05T17:09:34Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

robsonsobral · 2025-06-05T17:12:38Z

backend/src/casa-civil/dash/dto/transferencia.dto.ts

    name?: string;
    nameLocation?: string;
+    nameTextStyle?: {
+        align: string;


Eu teria botado os valores válidos, mas quem manda desse lado do muro são vocês e não especificaram nenhum. Então...

feat: ajusta estrutura do gráfico valor_por_orgao conforme padrão do …

cd2cc39

…painel estratégico

robsonsobral reviewed Jun 5, 2025

View reviewed changes

robsonsobral approved these changes Jun 5, 2025

View reviewed changes

renatocron force-pushed the homol branch from 0e4b105 to cce1130 Compare November 11, 2025 18:27

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

SA8.TV008 - Painel estratégico - melhoria no gráfico#339

SA8.TV008 - Painel estratégico - melhoria no gráfico#339
mateusmrosa wants to merge 1 commit intohomolfrom
feat/SA8.TV008-painel-estrategico-melhoria-grafico

mateusmrosa commented Jun 5, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Jun 5, 2025 •

edited

Loading

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (`.coderabbit.yaml`)

Documentation and Community

Uh oh!

sonarqubecloud bot commented Jun 5, 2025

Uh oh!

robsonsobral Jun 5, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

mateusmrosa commented Jun 5, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Jun 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Poem

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

sonarqubecloud bot commented Jun 5, 2025

Quality Gate passed

Uh oh!

robsonsobral Jun 5, 2025

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

mateusmrosa commented Jun 5, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Jun 5, 2025 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)