use fit-content for workpackage status

[kiranparajuli589]

Description

currently, we're using a static width for work package status in the search result.

work package status text may have variable length, so the static width may lead to UI inconsistency like:

very-long-status-text is missed because it does not fit inside specified static width
bug................ a long gap for short status

This PR makes use of dynamic width for the work package status indicator.

[github-actions]

JS Code Coverage

Coverage after merging fit-content-workpackage-status into master will be

54.52%

Coverage Report

File	Stmts	Branches	Funcs	Lines	Uncovered Lines
src
utils.js	8.33%	0%	0%	14.29%	3–9, 9
src/components
AdminSettings.vue	40.91%	100%	16.67%	50%	73–75, 79, 86–87, 89, 92
OAuthConnectButton.vue	93.10%	100%	85.71%	95.45%	44
PersonalSettings.vue	37.14%	30%	33.33%	42.11%	100–101, 101, 101, 104–105, 105, 105, 108–109, 109, 109, 112, 115–116, 118–119, 119–121, 121, 121, 121–122, 127–128, 128, 128, 133, 139, 87–90, 96–97
src/components/settings
SettingsTitle.vue	0%	100%	0%	0%	14
src/components/tab
EmptyContent.vue	100%	100%	100%	100%
SearchInput.vue	80%	58.33%	76.92%	85%	137, 147–149, 149, 149, 149–150, 65, 92, 92, 92–93, 95
WorkPackage.vue	100%	100%	100%	100%
src/utils
workpackageHelper.js	95.12%	95.24%	100%	94.12%	11, 19
src/views
Dashboard.vue	0%	0%	0%	0%	100–101, 101–102, 104, 107, 112, 112, 112–113, 115, 121, 125–126, 134, 137, 141–143, 145, 148–149, 152–153, 153–154, 158–159, 159–160, 162, 164–165, 165, 165, 165, 165–167, 167, 167, 167, 167–169, 172, 177, 177, 177, 179–180, 180, 180–181, 183, 183–185, 189, 193, 196, 196, 196, 199, 199, 199, 204, 207, 207, 207, 214, 217, 217, 217, 222, 222, 222, 227, 227, 227, 23, 232, 235, 238, 24, 241, 241, 241, 244, 244, 244, 247, 25, 250, 253, 26–31, 48, 55, 55, 62, 65–66, 78–79, 79, 79, 82, 85, 85, 85–87, 87, 87–89, 89–90, 92, 95, 95, 95–97, 97, 97–99, 99, 99
ProjectsTab.vue	94.55%	100%	83.33%	94.12%	88–89

[github-actions]

PHP Code Coverage

Coverage after merging fit-content-workpackage-status into master will be

46.06%

Coverage Report

File	Stmts	Branches	Funcs	Lines	Uncovered Lines
lib/AppInfo
Application.php	0%	100%	0%	0%	49, 51–52, 54–55, 59–60, 63, 70, 74–77, 79–84, 95, 99
lib/BackgroundJob
CheckNotifications.php	0%	100%	0%	0%	48, 50, 52–53, 61–62
lib/Controller
ConfigController.php	63.64%	100%	60%	63.86%	101–102, 104, 115–116, 118, 216–221, 223–226, 228, 230, 81–82, 84, 86–88, 90–95
OpenProjectAPIController.php	74.39%	100%	75%	74.32%	170, 187–188, 191, 194–199, 204, 206–211, 213, 90
lib/Dashboard
OpenProjectWidget.php	0%	100%	0%	0%	106–107, 109–113, 61–64, 71, 78, 85, 92, 99
lib/Exception
OpenprojectErrorException.php	100%	100%	100%	100%
OpenprojectResponseException.php	0%	100%	0%	0%	16
lib/Listener
LoadSidebarScript.php	0%	100%	0%	0%	59–61, 65–66, 68, 70, 72–74, 76, 78–82
lib/Notification
Notifier.php	0%	100%	0%	0%	100–104, 109–110, 112, 114, 47–50, 60, 69, 80, 82, 85, 87–92, 95, 97
lib/Search
OpenProjectSearchProvider.php	0%	100%	0%	0%	102, 109–110, 113–116, 118–119, 123–125, 127–131, 133–135, 138–139, 141–142, 146–147, 149–151, 157–158, 160, 169, 177–183, 192–197, 206, 71–75, 82, 89, 97, 99
OpenProjectSearchResultEntry.php	100%	100%	100%	100%
lib/Service
OpenProjectAPIService.php	69.70%	100%	72.22%	69.48%	106–107, 116–125, 127–130, 133–138, 140–141, 144–145, 161–165, 175–176, 178–182, 184, 193–197, 392–393, 395, 410–413, 415, 483–484, 491, 494–497, 499, 505, 509–511, 686
lib/Settings
Admin.php	0%	100%	0%	0%	25–26, 33–35, 37, 42–43, 47, 51
AdminSection.php	0%	100%	0%	0%	19–20, 29, 39, 48, 55
Personal.php	0%	100%	0%	0%	38–41, 48–52, 54, 56–58, 62–68, 71, 75, 79
PersonalSection.php	0%	100%	0%	0%	19–20, 29, 39, 48, 55

[individual-it]

can you please post before-after screen shots?

[kiranparajuli589]

Screenshots

Before:

After:

PS open project allow the status to be up to 30 characters

[SwikritiT]

LGTM