UI: Refactor to use functional components

# Summary

Say for UI features, new feature added in workflow page would likely be useful in archived workflow as well,
but right now we have both class and functional components at various parts of the UI, porting features from one part to another can be a pain.

class component file list:

_--- below heavily modified by agilgur5 ---_

- [x] 1. ui/src/app/app.tsx: #10867
- [x] 2. ~ui/src/app/archived-workflows/components/archived-workflow-details/archived-workflow-details.tsx~: no longer exists as of #11121
- [x] 3. ~ui/src/app/archived-workflows/components/archived-workflow-filters/archived-workflow-filters.tsx~: no longer exists as of #11121
- [x] 4. ~ui/src/app/archived-workflows/components/archived-workflow-list/archived-workflow-list.tsx~: no longer exists as of #11121
- [x] 5. ui/src/app/cluster-workflow-templates/components/cluster-workflow-template-list/cluster-workflow-template-list.tsx: #9809
- [x] 6. ui/src/app/reports/components/reports.tsx: #11794
- [x] 7. ui/src/app/shared/components/base-page.tsx: #11891
- [x] 8. ui/src/app/shared/components/checkbox-filter/checkbox-filter.tsx: #11739
- [x] 9. ui/src/app/shared/components/dropdown/dropdown.tsx: #11901
- [x] 10. ui/src/app/shared/components/error-panel.tsx: #11791
- [x] 11. ~ui/src/app/shared/components/graph/coffman-graham-sorter.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 12. ~ui/src/app/shared/components/graph/dfs-sorter.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 13. ~ui/src/app/shared/components/graph/types.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 14. ui/src/app/shared/components/inline-table/inline-table.tsx: #11791
- [x] 15. ui/src/app/shared/components/input-filter.tsx: #11899
- [x] 16. ui/src/app/shared/components/nudge.tsx: #11791
- [x] 17. ui/src/app/shared/components/pagination-panel.tsx: #11791
- [x] 18. ui/src/app/shared/components/resource-editor/resource-editor.tsx: #11800
- [x] 19. ui/src/app/shared/components/tags-input/tags-input.tsx: #11800
- [x] 20. ui/src/app/shared/conditions-panel.tsx: #11791
- [x] 21. ~ui/src/app/shared/list-watch.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 22. ui/src/app/shared/resources-duration.tsx: #11791
- [x] 23. ~ui/src/app/shared/retry-observable.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 24. ~ui/src/app/shared/retry-watch.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 25. ~ui/src/app/shared/scoped-local-storage.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 26. ~ui/src/app/shared/services/archived-workflows-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 27. ~ui/src/app/shared/services/cluster-workflow-template-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 28. ~ui/src/app/shared/services/cron-workflow-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 29. ~ui/src/app/shared/services/event-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 30. ~ui/src/app/shared/services/event-source-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 31. ~ui/src/app/shared/services/info-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 32. ~ui/src/app/shared/services/sensor-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 33. ~ui/src/app/shared/services/workflow-template-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 34. ~ui/src/app/shared/services/workflows-service.ts:~ [Not a React component](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712651952)
- [x] 35. ui/src/app/userinfo/components/user-info.tsx: #11793
- [x] 36. ui/src/app/workflows/components/submit-workflow-panel.tsx: #11803
- [x] 37. ui/src/app/workflows/components/workflow-creator-info/workflow-creator-info.tsx: #11791
- [x] 38. ui/src/app/workflows/components/workflow-dag/workflow-dag-render-options-panel.tsx: #11791
- [ ] 39. ui/src/app/workflows/components/workflow-dag/workflow-dag.tsx: #11920
- [x] 40. ui/src/app/workflows/components/workflow-drawer/workflow-drawer.tsx: #11800
- [x] 41. ui/src/app/workflows/components/workflow-filters/workflow-filters.tsx: #11891
- [x] 42. ui/src/app/workflows/components/workflow-labels/workflow-labels.tsx: #11791
- [x] 43. ui/src/app/workflows/components/workflow-panel/workflow-panel.tsx: #11791
- [x] 44. ui/src/app/workflows/components/workflow-timeline/workflow-timeline.tsx: #11899
- [x] 45. ui/src/app/workflows/components/workflow-yaml-viewer/workflow-yaml-viewer.tsx: #11791
- [x] 46. ui/src/app/workflows/components/workflows-list/workflows-list.tsx: #11891
- [x] 47. ui/src/app/workflows/components/workflows-row/workflows-row.tsx: #11791
- [x] 48. ui/src/app/workflows/components/workflows-toolbar/workflows-toolbar.tsx: #12046
- [x] 49. ui/src/app/workflows/components/workflow-node-info/workflow-node-info.tsx: #11791
- [x] 50. ui/src/app/workflows/components/resubmit-workflow-panel.tsx: #11803
- [x] 51. ui/src/app/workflows/components/retry-workflow-panel.tsx: #11803
- [x] 52. ~ui/src/app/shared/components/error-boundary.tsx~: [_Cannot_ be converted](https://github.com/argoproj/argo-workflows/issues/9810#issuecomment-1712939379)
- [x] 53. ui/src/app/shared/components/parameters-input/parameters-input.tsx: #11894

plan to refactor them in batches

---

**Message from the maintainers**:

Love this enhancement proposal? Give it a 👍. We prioritise the proposals with the most 👍.