<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Hugo</title>
    <description>The latest articles on DEV Community by Hugo (@hugoeft).</description>
    <link>https://dev.to/hugoeft</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F813484%2Fde8d4815-e55a-4d56-a6aa-cb168a2fdad9.jpg</url>
      <title>DEV Community: Hugo</title>
      <link>https://dev.to/hugoeft</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/hugoeft"/>
    <language>en</language>
    <item>
      <title>How to Handle Dependencies Between Pull-Requests</title>
      <dc:creator>Hugo</dc:creator>
      <pubDate>Fri, 21 Jul 2023 10:51:58 +0000</pubDate>
      <link>https://dev.to/hugoeft/how-to-handle-dependencies-between-pull-requests-4nn9</link>
      <guid>https://dev.to/hugoeft/how-to-handle-dependencies-between-pull-requests-4nn9</guid>
      <description>&lt;h1&gt;
  
  
  TL;DR
&lt;/h1&gt;

&lt;p&gt;At the end of this article, we will have learned valuable techniques for managing dependencies between Pull Requests (PRs). We would understand how to strategically handle conflicts and optimize the order of merges. 🦸‍♂️🚀&lt;/p&gt;

&lt;h1&gt;
  
  
  Introduction
&lt;/h1&gt;

&lt;p&gt;In the dynamic environment of software development, effective management of dependencies between pull requests (PRs) is pivotal to enabling smooth collaboration and seamless code integration. 🔌&lt;/p&gt;

&lt;p&gt;But let’s face it, juggling dependencies manually can be a real challenge! 😫.&lt;/p&gt;

&lt;h1&gt;
  
  
  Why managing dependencies between PRs is a challenge?
&lt;/h1&gt;

&lt;p&gt;Here are some key aspects of the problem:&lt;/p&gt;

&lt;h2&gt;
  
  
  Order of Merging
&lt;/h2&gt;

&lt;p&gt;If PRs have dependencies on one another, the order in which they are merged becomes crucial.&lt;/p&gt;

&lt;p&gt;Merging PRs in the wrong order could lead to broken code or features not working as intended in the main branch.&lt;/p&gt;

&lt;p&gt;This challenge becomes even more pronounced when there are a lot of PRs dependent on each other in large projects.&lt;/p&gt;

&lt;p&gt;It can sometimes create challenging situations where it’s difficult to assign responsibility and find solutions.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F246593551-5d74beb0-2190-4773-9da7-23d99baf42fe-2.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F246593551-5d74beb0-2190-4773-9da7-23d99baf42fe-2.gif" alt="Meeseeks"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conflict Resolution
&lt;/h2&gt;

&lt;p&gt;When multiple PRs modify the same codebase, they can lead to dependency issues.&lt;/p&gt;

&lt;p&gt;Resolving these issues manually can be time-consuming and error-prone.&lt;/p&gt;

&lt;h2&gt;
  
  
  Code Review Complexity
&lt;/h2&gt;

&lt;p&gt;PRs that depend on changes introduced in other PRs can complicate the code review process.&lt;/p&gt;

&lt;p&gt;Reviewers may need to consider multiple PRs at once to understand the full context, which can slow down the review and merging process.&lt;/p&gt;

&lt;h1&gt;
  
  
  Solution: Defining PR Dependencies
&lt;/h1&gt;

&lt;p&gt;In this tutorial, we will explore how Mergify helps improve the process and improve workflow efficiency by handling dependencies. 🧑‍💻&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftsrz2ighl79d9s0md181.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Ftsrz2ighl79d9s0md181.png" alt="MergifyDiagram"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Mergify is a robust solution for GitHub automation, engineered to streamline our workflow and adeptly manage the intricacies of dependency handling.&lt;/p&gt;

&lt;p&gt;We could avoid the above cases by defining “Defining Pull Request Dependencies” using Mergify’s &lt;code&gt;Depends-On header&lt;/code&gt;. ⛓️&lt;/p&gt;

&lt;p&gt;It handles prioritization and streamlines the process by automatically arranging the merging sequence of our pull requests.&lt;/p&gt;

&lt;p&gt;We need to simply add a &lt;code&gt;Depends-On&lt;/code&gt; header into the body of a pull request to indicate its dependencies.&lt;/p&gt;

&lt;p&gt;Mergify will then wait to merge until all linked requests are successfully merged. ✅&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F1.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F1.jpg" alt="User journey diagram"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;Now let’s see this in action with a simple example:&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Project Setup
&lt;/h2&gt;

&lt;p&gt;For this example, we would start out by setting up a basic &lt;code&gt;React&lt;/code&gt; project.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;mkdir mergify-demo
cd mergify-demo
git init
npx create-react-app ./
For this example, we would be making pull requests creating different branches for our changes and opening pull requests into the main branch with dependencies.
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;For this example, we would be making pull requests creating different branches for our changes and opening pull requests into the main branch with dependencies.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F72jb7oa0curhx9gkbri0.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F72jb7oa0curhx9gkbri0.png" alt="Setting up the project"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Setting up Rules
&lt;/h2&gt;

&lt;p&gt;We will go ahead and create our &lt;code&gt;.mergify.yml&lt;/code&gt; file.&lt;/p&gt;

&lt;p&gt;The Mergify configuration file contains a &lt;code&gt;pull_request_rules&lt;/code&gt; key, which includes a list of rules.&lt;/p&gt;

&lt;p&gt;Each rule has a &lt;code&gt;name&lt;/code&gt;, &lt;code&gt;conditions&lt;/code&gt;, and &lt;code&gt;actions&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;We would need to define the &lt;code&gt;conditions&lt;/code&gt; that must match for the rule to be applied and specify the &lt;code&gt;actions&lt;/code&gt; that will be executed when the conditions are met.&lt;/p&gt;

&lt;p&gt;Here’s what our file would look like 👇&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;.mergify.yml

queue_rules:
  - name: default
    merge_conditions:
      - label=merge
pull_request_rules:
  - name: Alert on dependency updates
    conditions:
      - files~=package.json
    actions:
      label:
        add:
          - dependency update
      queue:
        name: default
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The above rule will check if the &lt;code&gt;package.json&lt;/code&gt; file has been changed - if yes, then it will add a label dependency update and put the PR in the queue named &lt;code&gt;default&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;It will then merge the PR when the label &lt;code&gt;merge&lt;/code&gt; is applied to the PR.&lt;/p&gt;

&lt;p&gt;We can use the Mergify config editor to validate our rules before using them.&lt;/p&gt;

&lt;p&gt;Here’s how our folder structure will look like after adding &lt;code&gt;.mergify.yml&lt;/code&gt; file 👇&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F3.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F3.jpg" alt="Folder structure"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 3: Pushing the repo
&lt;/h2&gt;

&lt;p&gt;Now we would create a new repository in GitHub and push our project to it.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git add .
git commit -m "first commit"
git branch -M main
git remote add origin &amp;lt;Repo Link&amp;gt;
git push -u origin main
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Step 4: Setting Up Mergify with our repository
&lt;/h2&gt;

&lt;p&gt;Now we will go ahead and set up Mergify with our repository. 📁&lt;/p&gt;

&lt;p&gt;We can install Mergify in our GitHub account by visiting &lt;a href="//dashboard.mergify.com"&gt;dashboard.mergify.com&lt;/a&gt; or &lt;a href="//github.com/apps/mergify/installations/new"&gt;github.com/apps/mergify/installations/new&lt;/a&gt; and logging in with GitHub.&lt;/p&gt;

&lt;p&gt;Then we could select the repositories we want Mergify to give access to (for demo purpose, we will give access to all the repos in this case)&lt;/p&gt;

&lt;p&gt;We could now use &lt;code&gt;Mergify's Config Editor&lt;/code&gt; to verify our rules. ✅&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FJgtKeVh-2.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FJgtKeVh-2.gif" alt="Setting up Mergify"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 5: Creating the first PR
&lt;/h2&gt;

&lt;p&gt;Let’s go ahead and create a new branch named &lt;code&gt;pr-1&lt;/code&gt;.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git checkout -b pr-1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this branch we would change the version of our project in &lt;code&gt;package.json&lt;/code&gt; file from&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt; "version": "0.1.0"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;to&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;"version": "0.1.1"
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now, we will push our changes.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git add .
git commit -m "chore: version upgrade"
git push --set-upstream origin pr-1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;and create a new Pull Request to the main branch without any header.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FMergify_Depends-On_Demo-2.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FMergify_Depends-On_Demo-2.gif" alt="Making first PRs"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;In our rules, we have defined a merge condition, i.e., &lt;code&gt;label=merge&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;We did not put the &lt;code&gt;merge&lt;/code&gt; label in the first PR, so Mergify will not merge automatically, and we would need to merge it manually.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 6: Creating the second PR
&lt;/h2&gt;

&lt;p&gt;Let’s go ahead and create a new branch named &lt;code&gt;pr-2&lt;/code&gt;. In this branch we would change the version of our project in &lt;code&gt;package.json&lt;/code&gt; file and also that of &lt;code&gt;react-scripts&lt;/code&gt;.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git checkout maingit checkout -b pr-2
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;In this branch, we would change the version of our project as well as of react-scripts in package.json file, from&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    "name": "mergify-demo",
    "version": "0.1.0",
    "dependencies": {
        "@testing-library/jest-dom": "^5.16.5",
        "@testing-library/react": "^13.4.0",
        "@testing-library/user-event": "^13.5.0",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "react-scripts": "5.0.1",
        "web-vitals": "^2.1.4"
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;to&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;{
    "name": "mergify-demo",
    "version": "0.1.1",
    "dependencies": {
        "@testing-library/jest-dom": "^5.16.5",
        "@testing-library/react": "^13.4.0",
        "@testing-library/user-event": "^13.5.0",
        "react": "^18.2.0",
        "react-dom": "^18.2.0",
        "react-scripts": "5.0.0",
        "web-vitals": "^2.1.4"
    }
}
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now let’s push this one too.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;git add .
git commit -m "chore: change react-scripts version"
git push --set-upstream origin pr-2
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Now we would go ahead and open a pull request with the following header.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;Updating Version 🎉

You may look at these pull requests for the full picture.

Depends-On: #1
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Mergify looks for the Depends-On: keyword in the PR header for dependency information.&lt;/p&gt;

&lt;p&gt;Here we have added the merge label, so Mergify will try to merge this PR automatically if all the other conditions are met.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 7: Merging the first PR
&lt;/h2&gt;

&lt;p&gt;Now we will go ahead and merge our first &lt;code&gt;PR&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Our second PR still has some &lt;code&gt;merge conflicts&lt;/code&gt;, we will resolve them as shown 👇&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FyOLXSjY-2.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2FyOLXSjY-2.gif" alt="Merging first PR"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;Sit back and let Mergify work its magic. ✨&lt;/p&gt;

&lt;p&gt;Mergify will automatically check if the conditions of the rules are met for the pull request.&lt;/p&gt;

&lt;p&gt;When conditions are satisfied, Mergify will apply the specified actions.&lt;/p&gt;

&lt;p&gt;As soon as we resolve our merge conflict, our PR gets merged automatically. 🪄&lt;/p&gt;

&lt;p&gt;We can go to the Mergify dashboard and check our event logs 👇&lt;br&gt;
&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F2.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fblog.mergify.com%2Fcontent%2Fimages%2F2023%2F07%2F2.jpg" alt="Event logs"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;You may check out both the &lt;code&gt;Pull Requests&lt;/code&gt; here for reference 👉 &lt;a href="//github.com/hugoescafit/mergify-demo/pulls?q=is%3Apr+is%3Aclosed"&gt;github.com/hugoescafit/mergify-demo/pulls?q=is%3Apr+is%3Aclosed&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;That’s it!🎉 With Mergify set-up, you can now enjoy automated dependency management and smoother PR workflows. Let Mergify handle the complexities while you focus on building amazing software!&lt;/p&gt;

&lt;h1&gt;
  
  
  Conclusion
&lt;/h1&gt;

&lt;p&gt;In our exploration of dependency management with Mergify, we’ve discovered powerful tools that streamline workflows and conquer challenges in handling dependencies between pull requests.&lt;/p&gt;

&lt;p&gt;By automating tasks and ensuring code stability, Mergify proves to be an invaluable ally. 🙌&lt;/p&gt;

&lt;p&gt;With features like sequential PR merging, custom rebase strategies, and version compatibility checks. Mergify empowers us to efficiently manage dependencies, embrace automation, optimize collaboration, and unlock the full potential of our software projects with Mergify.&lt;/p&gt;

&lt;p&gt;Head on to &lt;a href="https://Mergify.com" rel="noopener noreferrer"&gt;mergify.com&lt;/a&gt; to start building ✨&lt;/p&gt;

</description>
      <category>github</category>
      <category>devops</category>
      <category>cicd</category>
      <category>programming</category>
    </item>
  </channel>
</rss>
