jenkinsfile: filter stages based on path

Ideally we would want to trigger Jenkins build based on the path where
change occurred. Unfortunately this is not supported by Jenkins. As a
workaround we are conditionally executing steps if the change occured in
the apps/connector/ path. Prior to this we need to fetch the changelog
diff between current branch and target branch to understand if there was
a change present in the target dir and if we need to run all stages.
The population of changelog is needed just the first time the PR is
opened and in the subsequent steps we don't need this.

Referenced issue: https://github.com/status-im/status-web/issues/590

Signed-off-by: markoburcul <marko@status.im>

apps/connector/Jenkinsfile

@@ -1,6 +1,8 @@
 #!/usr/bin/env groovy
 library 'status-jenkins-lib@v1.9.11'
 
+def changesDetected = false
+
 pipeline {
   agent { label 'linux' }
 
@@ -27,7 +29,41 @@ pipeline {
   }
 
   stages {
+    stage('Initial changelog checkout') {
+      when {
+          expression { currentBuild.previousCompletedBuild == null }
+      }
+      steps {
+        script {
+          checkout scmGit(
+              branches: scm.branches,
+              extensions: [
+                  cloneOption(depth: 100, noTags: true, reference: '', shallow: true),
+                  changelogToBranch(changelogBase(
+                      compareRemote: 'origin',
+                      compareTarget: CHANGE_TARGET
+                  ))
+              ],
+              userRemoteConfigs: scm.userRemoteConfigs
+          )
+        }
+      }
+    }
+
+    stage('Check changes') {
+      when {
+          changeset pattern: "apps/connector/**", comparator: "GLOB"
+      }
+      steps {
+        script {
+            changesDetected = true
+        }
+      }
+    }
     stage('Install') {
+      when {
+          expression { changesDetected }
+      }
       steps {
           dir("${env.WORKSPACE}/apps/connector") {
             script {
@@ -42,6 +78,9 @@ pipeline {
     }
 
     stage('Build') {
+      when {
+          expression { changesDetected }
+      }
       steps {
           dir("${env.WORKSPACE}/apps/connector") {
             script {
@@ -56,6 +95,9 @@ pipeline {
     }
 
     stage('Zip') {
+      when {
+          expression { changesDetected }
+      }
       steps {
         dir("${env.WORKSPACE}/apps/connector") {
           zip(
@@ -68,6 +110,9 @@ pipeline {
     }
 
     stage('Archive') {
+      when {
+          expression { changesDetected }
+      }
       steps {
         dir("${env.WORKSPACE}/apps/connector") {
           archiveArtifacts(
@@ -79,6 +124,9 @@ pipeline {
     }
 
     stage('Upload') {
+      when {
+          expression { changesDetected }
+      }
       steps {
         dir("${env.WORKSPACE}/apps/connector") {
           script {
@@ -90,8 +138,20 @@ pipeline {
   }
 
   post {
-    success { script { github.notifyPR(true) } }
-    failure { script { github.notifyPR(false) } }
+    success {
+      script {
+        if(changesDetected) {
+          github.notifyPR(true) 
+        } 
+      }
+    }
+    failure {
+      script {
+        if(changesDetected) {
+          github.notifyPR(false) 
+        } 
+      }
+    }
     cleanup { cleanWs() }
   }
 }

apps/connector/README.md

@@ -1,7 +1,5 @@
 # A wallet connector by Status
 
-![status](https://img.shields.io/badge/status-beta-orange)
-
 Status Desktop Wallet extended to decentralized applications in your browser.
 
 ## Compatibility

packages/components/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @status-im/components
 
+## 1.0.6
+
+### Patch Changes
+
+- 7f21132: fix `<Shortcut />`icon prop and symbol centering
+
+## 1.0.5
+
+### Patch Changes
+
+- 3ad28ea: chore: Remove flex-1 class from button component (#602)
+
 ## 1.0.4
 
 ### Patch Changes

packages/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@status-im/components",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "license": "MPL-2.0",
   "sideEffects": [
     "*.css"

packages/components/src/button/button.tsx

@@ -76,7 +76,7 @@ function Button(
           {iconBefore}
         </span>
       )}
-      <span className="flex-1 whitespace-nowrap">{children}</span>
+      <span className="whitespace-nowrap">{children}</span>
       {iconAfter && (
         <span className={iconStyles({ size, placement: 'after', variant })}>
           {iconAfter}

packages/components/src/shortcut/shortcut.stories.tsx

@@ -9,7 +9,7 @@ const variants = ['primary', 'secondary', 'gray'] as const
 // eslint-disable-next-line react/display-name
 const renderVariant = (variant: (typeof variants)[number]) => (props: any) => (
   <div className="flex items-center gap-2">
-    <Shortcut {...props} variant={variant} icon={CommandIcon} />
+    <Shortcut {...props} variant={variant} icon={<CommandIcon />} />
     <Shortcut {...props} variant={variant} symbol="K" />
   </div>
 )

packages/components/src/shortcut/shortcut.tsx

@@ -1,13 +1,14 @@
-import { forwardRef } from 'react'
+import { cloneElement, forwardRef } from 'react'
 
 import { match, P } from 'ts-pattern'
 
 import { cva } from '../utils/variants'
 
+import type { IconElement } from '../types'
 import type { VariantProps } from '../utils/variants'
 
 const styles = cva({
-  base: 'flex size-4 flex-shrink-0 items-center justify-center rounded-6 border',
+  base: 'grid size-4 flex-shrink-0 place-items-center rounded-6 border',
   variants: {
     variant: {
       primary: [
@@ -32,7 +33,7 @@ const styles = cva({
 type Props = VariantProps<typeof styles> &
   (
     | {
-        icon: React.ComponentType<React.SVGProps<SVGSVGElement>>
+        icon: IconElement
         symbol?: never
       }
     | {
@@ -42,15 +43,17 @@ type Props = VariantProps<typeof styles> &
   )
 
 const Shortcut = (props: Props, ref: React.Ref<HTMLDivElement>) => {
-  const { variant = 'primary', ...rest } = props
+  const { variant = 'primary' } = props
 
   return (
-    <div className={styles({ variant })} ref={ref} {...rest}>
+    <div className={styles({ variant })} ref={ref}>
       {match(props)
         .with({ symbol: P.string }, ({ symbol }) => (
           <span className="text-11 font-medium">{symbol}</span>
         ))
-        .with({ icon: P._ }, ({ icon: Icon }) => <Icon className="size-3" />)
+        .with({ icon: P._ }, ({ icon }) =>
+          cloneElement(icon, { className: 'size-3' }),
+        )
         .exhaustive()}
     </div>
   )