Fix the issue where clicking on the + button at the top of a board gr…

…oup wouldn't open the newly-added card (#1708)

Co-authored-by: Moncy Gopalan <ilusivespectre@gmail.com>

webapp/cypress/integration/createBoard.js

@@ -73,6 +73,15 @@ describe('Create and delete board / card', () => {
         cy.get('.Dialog.dialog-back .wrapper').click({force: true});
     });
 
+    it('Can create a card by clicking on the + button', () => {
+        // Create a card by clicking on the + button
+        cy.get('.KanbanColumnHeader :nth-child(5) > .CompassIcon ').click();
+        cy.get('.CardDetail').should('exist');
+
+        // Close card
+        cy.get('.Dialog.dialog-back .wrapper').click({force: true});
+    });
+
     it('Can create a table view', () => {
         // Create table view
         // cy.intercept('POST', '/api/v1/blocks').as('insertBlocks');

webapp/src/components/kanban/kanbanColumnHeader.tsx

@@ -29,7 +29,7 @@ type Props = {
     groupByProperty?: IPropertyTemplate
     intl: IntlShape
     readonly: boolean
-    addCard: (groupByOptionId?: string) => Promise<void>
+    addCard: (groupByOptionId?: string, show?: boolean) => Promise<void>
     propertyNameChanged: (option: IPropertyOption, text: string) => Promise<void>
     onDropToColumn: (srcOption: IPropertyOption, card?: Card, dstOption?: IPropertyOption) => void
     calculationMenuOpen: boolean
@@ -180,7 +180,9 @@ export default function KanbanColumnHeader(props: Props): JSX.Element {
                     </MenuWrapper>
                     <IconButton
                         icon={<AddIcon/>}
-                        onClick={() => props.addCard(group.option.id)}
+                        onClick={() => {
+                            props.addCard(group.option.id, true)
+                        }}
                     />
                 </>
             }