Skip to content

Add link & target props to big_number.handlebars #861

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 8 commits into from
May 19, 2025

Conversation

hanskihyv
Copy link
Contributor

@hanskihyv hanskihyv commented Mar 19, 2025

We needed link functionality for the Big Number component

This PR introduces support for adding links to both the title and the value fields in the Big Number component. It also allows specifying whether those links should open in the same tab (_self) or a new tab (_blank). The goal is to enable more interactive dashboards where users can navigate between pages directly by clicking on a Big Number’s text.
Usage

Added four optional properties:

  • title_link (string): the URL or path that the Big Number’s title should link to, if any
  • title_target (string): how the title link is opened, e.g. "_self" for same tab, or "_blank" for a new tab
  • value_link (string): the URL or path that the Big Number’s value should link to, if any
  • value_target (string): how the value link is opened, e.g. "_self" or "_blank"
-- adding link + target properties for both title and value.

SELECT 
    'big_number'    AS component,
    'Weekly Stats'  AS title,
    '/stats_page.sql' AS title_link,   -- Link for the title
    '_blank'        AS title_target,   -- Opens in new tab
    42              AS value,
    '/details.sql'  AS value_link,     -- Link for the value
    '_self'         AS value_target,   -- Opens in same tab
    'green'         AS color,
    'Check out stats' AS description;

@lovasoa lovasoa linked an issue Mar 19, 2025 that may be closed by this pull request
@lovasoa
Copy link
Collaborator

lovasoa commented Mar 19, 2025

Thanks Hansky !

As I said in #859 , I think target=_blank is not the most user friendly for people who are not already familiar with html. Maybe true as title_link_new_tab ?

By the way, do you work with @accforgithubtest ?

Copy link
Collaborator

@lovasoa lovasoa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you also document the changes and add an example for them in https://github.com/sqlpage/SQLPage/blob/main/examples/official-site/sqlpage/migrations/49_big_number.sql ?

{{#if title}}
<div class="d-flex align-items-center">
<div class="subheader text-truncate me-2">{{title}}</div>
<!-- Otsikko (title): mahdollisuus linkkiin ja targetiin -->
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could we translate the comments to english and use handlebars comments ?

@hanskihyv
Copy link
Contributor Author

Thanks Hansky !

As I said in #859 , I think target=_blank is not the most user friendly for people who are not already familiar with html. Maybe true as title_link_new_tab ?

By the way, do you work with @accforgithubtest ?

No, I don't work @accforgithubtest and didn't read that discussion beforehand.

I did do some modifications regarding that title_link_new_tab and modified 49_big_number.sql.
As I'm new with git / github, not sure if everything has been done correctly now. At least on second commit today I got the 49_big_number.sql added.

Copy link
Collaborator

@lovasoa lovasoa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you update the changelog and the documentation too ?

@lovasoa
Copy link
Collaborator

lovasoa commented Mar 20, 2025

No, I don't work @accforgithubtest and didn't read that discussion beforehand.

Well, then you both had the same idea at almost the same time :) You'll make someone happy !

lovasoa added 5 commits May 20, 2025 01:09

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
@lovasoa lovasoa merged commit eaac4c7 into sqlpage:main May 19, 2025
@lovasoa
Copy link
Collaborator

lovasoa commented May 19, 2025

Hi @hanskihyv ! I'm sorry for the long delay.

I made the last few changes I needed to this pr and merged it. Thank you again for your contribution !

This will be in v0.35

@hanskihyv hanskihyv deleted the bignumber-links branch May 20, 2025 05:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[feat] big_number component - Add support for link to open other links
2 participants