Modifies issue row when no issue is associated with the active branch

(#4332, #4349)

Author: sergeibbb

src/webviews/apps/plus/home/components/active-work.ts

@@ -232,6 +232,11 @@ export class GlActiveBranchCard extends GlBranchCardBase {
 				flex-direction: column;
 				gap: 0.8rem;
 			}
+
+			span.branch-item__missing {
+				color: var(--vscode-descriptionForeground);
+				font-style: italic;
+			}
 		`,
 	];
 
@@ -518,16 +523,21 @@ export class GlActiveBranchCard extends GlBranchCardBase {
 		if (!issues.length) {
 			if (!this.expanded) return nothing;
 
-			return html`<gl-button
-				class="branch-item__missing"
-				appearance="secondary"
-				full
-				href=${this.createCommandLink<AssociateIssueWithBranchCommandArgs>('gitlens.associateIssueWithBranch', {
-					branch: this.branch.reference,
-					source: 'home',
-				})}
-				>Associate an Issue</gl-button
-			>`;
+			return html`<div class="branch-item__row" full>
+				<span class="branch-item__missing" full>Current work item</span>
+				<gl-tooltip hoist content="Associate an issue">
+					<a
+						href=${this.createCommandLink<AssociateIssueWithBranchCommandArgs>(
+							'gitlens.associateIssueWithBranch',
+							{
+								branch: this.branch.reference,
+								source: 'home',
+							},
+						)}
+						><span class="branch-item__icon"> <issue-icon></issue-icon> </span
+					></a>
+				</gl-tooltip>
+			</div>`;
 		}
 		return super.renderIssuesItem();
 	}