<!--A few plain bullets saying what changed and why, for a reviewer
skimming it - not a wall of text, not a restatement of the diff, not
generated boilerplate.-->
#### How to review this PR
You can pretty much ignore anything inside `<parent>/stories` folder
since this was generated by AI and should be maintained by AI. If you
want to suggest a change in a specific story, let's have a follow-up for
it.
You should focus to review the non-essential files that were changed,
such as the skills or storybook files.
#### Description
This adds stories for all reachable pages in the app, with few
variations in the state of the page.
This can be used as ground-work to later each team add more
customizations/states for their controlled pages, to ensure we are
covering all the states available and having a good coverage during
visual testing.
Closes https://github.com/SigNoz/engineering-pod/issues/6093
<!--If applicable, include screenshots or screen recordings that clearly
show the behavior before the change and the result after the change. -->
#### Screenshots / Screen Recordings
<img width="1867" height="1268" alt="image"
src="https://github.com/user-attachments/assets/78f2f10e-e8bb-4353-a78b-1a88df4bb545"
/>
<!--A few plain bullets saying what changed and why, for a reviewer
skimming it - not a wall of text, not a restatement of the diff, not
generated boilerplate.-->
#### Description
This PR aims to fix the issues we have with translation, today when we
enable the translation, some parts of the app crash due to how the react
works and how the translation works.
In simple works, if you have: `<button>{(var ? 'text' : 'other text')}
{icon}` it will crash because the React will represent the `text` and
`other text` as `TextNode`, and when translate is performed, it changes
the parent of this element to `font` and causes the react to be "blind",
and when trying to delete the element, it cannot find.
> Read
https://martijnhols.nl/blog/everything-about-google-translate-crashing-react
to understand more
There's many fixes that includes ignore the errors and let the app with
invalid data, or actually go ahead and find the places with this pattern
and avoid them.
I kinda mixed two approaches, I introduced a new plugin based on
https://github.com/getcouped/eslint-plugin-react-google-translate/ but
adapted a little bit for our necessity and for our codebase (with oxc).
If we only use this plugin to find and fix the places, we will find most
of the issues crashing the app, but not all of them.
Why not all? Because even our component library is not safe enough for
google translate, eg: https://github.com/SigNoz/components/issues/351
So, I also included https://npmx.dev/package/translation-resilience,
this lib has another approach to fix the issue with the TextNode:
```
Instead of swallowing errors, this shim puts the original text nodes **back** the moment the renderer touches them:
1. A document-wide `MutationObserver` recognizes translation's displacement pattern (merge, wrap, remove — a pattern renderer commits never produce) and tracks each replaced text run as a *displacement group*: the ordered renderer-owned originals with their pre-translation values, plus the wrapper nodes currently standing in for them.
2. Patched `Node.prototype.removeChild` / `insertBefore` / `appendChild` and the `nodeValue` / `data` setters detect operations on displaced text nodes and first **restore the group** — originals go back into the wrappers' position, wrappers are removed — then let the native operation proceed on a consistent tree.
3. The translator's own observer notices the restored (now updated) text and re-translates it, so the user sees fresh, translated content. The loop is self-healing: update → restore → re-translate.
The result: no crashes, **and** live data keeps updating on translated pages — in the visitor's language.
```
We could keep the lib only and no plugin? Yes, but I want to make our
app more resilient without need the help of the lib, so we can continue
to adopt/fix places that has the pattern to crash the app, and
eventually, we can remove the lib because our app is resilient enough.
<!--Reference issues using `Closes #issue-number` to enable automatic
closure on merge. -->
#### Issues closed by this PR
Closes https://github.com/SigNoz/platform-pod/issues/2912
<!--If applicable, include screenshots or screen recordings that clearly
show the behavior before the change and the result after the change. -->
#### Screenshots / Screen Recordings
https://github.com/user-attachments/assets/0225464b-1afe-46ad-afe7-25f79e25201a
<!--Anything reviewers should keep in mind while reviewing -->
#### Additional Information
This lib has a performance cost but the lib only enable itself when it
detects the translation is enabled, so our app (and users) should not
see/perceive any performance cost due to this lib. But again, this is
another reason to slowly adapt and fix all places that offers a
potential problem to google translate.
* feat(dashboards-v2): add context-link variable + URL-param building blocks
Reusable primitives for the V2 context-link editor, kept separate from the
UI wiring:
- types: VariableItem / UrlParam / VariableSource
- utils: query-string <-> key/value param parsing, cursor-aware {{variable}}
insertion, and URL validation (http(s)://, /path, or {{var}}/)
- VariablesPopover: autocomplete that lists {{variables}} grouped by source
and inserts the picked token at the cursor
- useContextLinkVariables: self-contained hook sourcing the offered variables
(global timestamps, per-query groupBy fields as _<key>, dashboard variables)
from the query-builder provider + dashboard store, no prop threading
Covered by utils + hook unit tests.
* feat(dashboards-v2): rework context-link editor into a list + modal
The section is now a list of saved links (label + URL with edit/delete),
with add/edit handled in a modal (@signozhq/ui DialogWrapper) instead of the
cramped inline rows.
The modal carries V1's full authoring UX:
- label + URL with {{variable}} autocomplete and inline validation
- a key/value URL-parameters editor synced to the URL query string
- an "open in new tab" toggle; Save is gated on a non-empty, valid URL
Saved links set renderVariables so consumers interpolate the URL at
click-time. The variables popover renders with withPortal=false so it stays
inside the modal (radix's modal disables pointer events on portalled content).
* chore: pr review fixes
* refactor(dashboards-v2): split dashboard fetch into fetch-only hook + required accessor
- useDashboardFetch (renamed from useDashboardV2) now exposes only the raw
dashboard plus fetch lifecycle; spec derivation moves out of it.
- Add useDashboardFetchRequired: reads the active dashboardId from the store,
reuses the shared react-query cache entry, throws when the dashboard is
missing, and derives spec collections (variables). Also exposes refetch.
- Enforce the split with a new signoz/no-dashboard-fetch-outside-root lint rule,
allowlisted for the two root pages and the required hook.
- Point the context-link variables hook at useDashboardFetchRequired and expand
the VariableSource JSDoc.
* chore: fixed fmt
* chore(css-modules): add good practices for writing css module files
* fix(guide): add more guidelines based on notion doc
* fix(pr): address pr comments
* refactor: replace Radio components with ToggleGroup in various components
* refactor: replace ToggleGroup with ToggleGroupSimple
* fix: update theme selection tests to use role-based queries
* feat: add styles for add-on tab title alignment and spacing
* refactor: replace Ant Design Switch with Signoz UI Switch across multiple components
* fix: update snapshot of failing test
* feat: update snapshot
* refactor: update imports to use Signoz UI Switch from the new path across multiple components
* refactor: update banned components to use Signoz UI imports for Typography and Switch
* refactor: replace Ant Design Switch with Signoz UI Switch
* feat(typography): migrate to @signozhq/ui
* test(ingestion-settings): add more timeout for test
* fix(typography): missing few places introduced by merge main
* fix(traces): blue links instead of l1 foreground
* fix(span-duration): fix issue with bad mocking
* feat: base path config setup and plugin for gotmpl generation at build time
* feat: changed output path to dir level
* feat: refactor the interceptor and added gotmpl into gitignore
* feat: removed plugin and serving the index.html only as the template
* feat: updated the html template
* feat: updated base path utils and fixed navigation and translations
* feat: code refactor around feedbacks
* feat: applied suggested patch changes
* feat: code refactor around feedbacks
* feat(base-path): mirgate rule to oxlint
* feat(base-path): fix lint issues
* feat(base-path): configure local dev setup
* feat(oxc): move from eslint/prettier to oxlint/oxfmt
* fix(scripts): formatted and linted
* fix(k8s-base-list): add again the ignore rule
* fix(fmt): permissions type
* fix(permissions): generate correct file for format
* fix(k8s): wrong update on test methods caused it to be wrong