Replace accordion view with tab view for task list

[samarpan1738]

Fixes #432

Changes

1. Update Tab labels (Remove underscores)
2. Add bottom bar for Tab button (Looks better this way)

Preview video

Screen.Recording.2023-03-14.at.12.57.59.AM.mov

[vercel]

@samarpan1738 is attempting to deploy a commit to the RDS-Team Team on Vercel.

A member of the Team first needs to authorize it.

[hjaintech]

The highlighted piece of code has multiple levels of ternary operators being used which is making this code hard to understand/debug. I'd suggest looking for ways to flatten it out OR move some parts of code into separate functions like below

const renderTabSection = () => (
  <div className={classNames.tabsContainer}>
    <Tabs
      tabs={Object.values(Tab) as Tab[]}
      onSelect={onSelect}
      activeTab={activeTab}
    />
  </div>
);

const renderTaskList = () => (
  <div>
    {filteredTask[activeTab] ? (
      <TaskList
        tasks={filteredTask[activeTab]}
        isEditable={isEditable}
        updateCardContent={updateCardContent}
      />
    ) : (
      <EmptyTaskListLabel />
    )}
  </div>
);

.
.
.
  <div className={classNames.tasksContainer}>
    {renderTabSection()}
    {renderTaskList()}
  </div>
.
.
.