fix: account for polls with no options in PollHeader text (#2713)

do not show any string in PollHeader if there are no options.

Author: MartinCupela

src/components/Poll/PollHeader.tsx

@@ -27,12 +27,13 @@ export const PollHeader = () => {
 
   const selectionInstructions = useMemo(() => {
     if (is_closed) return t<string>('Vote ended');
-    if (enforce_unique_vote) return t<string>('Select one');
+    if (enforce_unique_vote || options.length === 1) return t<string>('Select one');
     if (max_votes_allowed)
       return t<string>('Select up to {{count}}', {
         count: max_votes_allowed > options.length ? options.length : max_votes_allowed,
       });
-    return t<string>('Select one or more');
+    if (options.length > 1) return t<string>('Select one or more');
+    return '';
   }, [is_closed, enforce_unique_vote, max_votes_allowed, options.length, t]);
 
   if (!name) return;

src/components/Poll/__tests__/PollHeader.test.js

@@ -72,4 +72,34 @@ describe('PollHeader', () => {
     expect(nameDiv).toHaveTextContent(pollData.name);
     expect(subtitleDiv).toHaveTextContent('Select one or more');
   });
+
+  it('should render Select one header if only one option is available', () => {
+    const pollData = generatePoll({
+      max_votes_allowed: undefined,
+      options: [
+        {
+          id: '85610252-7d50-429c-8183-51a7eba46246',
+          text: 'A',
+        },
+      ],
+    });
+    const { container } = renderComponent({
+      poll: new Poll({ client: {}, poll: pollData }),
+    });
+    const nameDiv = container.querySelector(TITLE_SELECTOR);
+    const subtitleDiv = container.querySelector(SUBTITLE_SELECTOR);
+    expect(nameDiv).toHaveTextContent(pollData.name);
+    expect(subtitleDiv).toHaveTextContent('Select one');
+  });
+
+  it('should render no header text if no options available', () => {
+    const pollData = generatePoll({ max_votes_allowed: undefined, options: [] });
+    const { container } = renderComponent({
+      poll: new Poll({ client: {}, poll: pollData }),
+    });
+    const nameDiv = container.querySelector(TITLE_SELECTOR);
+    const subtitleDiv = container.querySelector(SUBTITLE_SELECTOR);
+    expect(nameDiv).toHaveTextContent(pollData.name);
+    expect(subtitleDiv).toHaveTextContent('');
+  });
 });