cursorPoller.tsx 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. import {Client, Request} from 'sentry/api';
  2. import parseLinkHeader from 'sentry/utils/parseLinkHeader';
  3. type Options = {
  4. linkPreviousHref: string;
  5. success: (data: any, link?: string | null) => void;
  6. };
  7. const BASE_DELAY = 3000;
  8. const MAX_DELAY = 60000;
  9. class CursorPoller {
  10. constructor(options: Options) {
  11. this.options = options;
  12. this.setEndpoint(options.linkPreviousHref);
  13. }
  14. api = new Client();
  15. options: Options;
  16. pollingEndpoint: string = '';
  17. timeoutId: number | null = null;
  18. lastRequest: Request | null = null;
  19. active: boolean = true;
  20. reqsWithoutData = 0;
  21. getDelay() {
  22. const delay = BASE_DELAY * (this.reqsWithoutData + 1);
  23. return Math.min(delay, MAX_DELAY);
  24. }
  25. setEndpoint(linkPreviousHref: string) {
  26. if (!linkPreviousHref) {
  27. this.pollingEndpoint = '';
  28. return;
  29. }
  30. const issueEndpoint = new URL(linkPreviousHref, window.location.origin);
  31. // Remove collapse stats
  32. issueEndpoint.searchParams.delete('collapse');
  33. this.pollingEndpoint = decodeURIComponent(
  34. issueEndpoint.pathname + issueEndpoint.search
  35. );
  36. }
  37. enable() {
  38. this.active = true;
  39. // Proactively clear timeout and last request
  40. if (this.timeoutId) {
  41. window.clearTimeout(this.timeoutId);
  42. }
  43. if (this.lastRequest) {
  44. this.lastRequest.cancel();
  45. }
  46. this.timeoutId = window.setTimeout(this.poll.bind(this), this.getDelay());
  47. }
  48. disable() {
  49. this.active = false;
  50. if (this.timeoutId) {
  51. window.clearTimeout(this.timeoutId);
  52. this.timeoutId = null;
  53. }
  54. if (this.lastRequest) {
  55. this.lastRequest.cancel();
  56. }
  57. }
  58. poll() {
  59. this.lastRequest = this.api.request(this.pollingEndpoint, {
  60. success: (data, _, resp) => {
  61. // cancel in progress operation if disabled
  62. if (!this.active) {
  63. return;
  64. }
  65. // if theres no data, nothing changes
  66. if (!data || !data.length) {
  67. this.reqsWithoutData += 1;
  68. return;
  69. }
  70. if (this.reqsWithoutData > 0) {
  71. this.reqsWithoutData -= 1;
  72. }
  73. const linksHeader = resp?.getResponseHeader('Link') ?? null;
  74. const links = parseLinkHeader(linksHeader);
  75. this.setEndpoint(links.previous.href);
  76. this.options.success(data, linksHeader);
  77. },
  78. error: resp => {
  79. if (!resp) {
  80. return;
  81. }
  82. // If user does not have access to the endpoint, we should halt polling
  83. // These errors could mean:
  84. // * the user lost access to a project
  85. // * project was renamed
  86. // * user needs to reauth
  87. if (resp.status === 404 || resp.status === 403 || resp.status === 401) {
  88. this.disable();
  89. }
  90. },
  91. complete: () => {
  92. this.lastRequest = null;
  93. if (this.active) {
  94. this.timeoutId = window.setTimeout(this.poll.bind(this), this.getDelay());
  95. }
  96. },
  97. });
  98. }
  99. }
  100. export default CursorPoller;