Code Monkey home page Code Monkey logo

edtro.azuredevops.extensions.querybasedboards's Introduction

EdTro.AzureDevOps.Extensions.querybasedboards

Query Based Boards enables a user to visualize the result of work item queries as a board and track the dependencies.

This extension for Azure DevOps Services/Server is available on the markteplace here

View the detail documentation here

Please feel free to take a look at the YouTube channel that I have created for this extension.

Information

This project is bootstrapped with Create React App and has the following dependencies:

  • azure-devops-extension-sdk, see details here
  • azure-devops-extension-api, see detals here
  • azure-devops-ui (this is the new Formula Design System), see information here
  • react-dnd, see details here and for a tutorial here
  • react-dnd-multi-backend, see details here
  • some components that where missing in the Formula Design System, I have used from Fluent UI, see details here
  • lodash, see details here

Many thanks to these teams and people.

NOTE: this the second version of this extension. The first version was created by a former colleague of ours, all the credits for coming up with this idea is going to him! This version is however rebuild completely, based on the new Azure DevOps extension libraries and the new Formula Design System. The old and original project is still available on the marketplace here

Full list of dependencies:

{
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^12.1.5",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/lodash": "^4.14.191",
    "@types/node": "^16.18.11",
    "@types/pluralize": "^0.0.29",
    "@types/react": "^16.8.6",
    "@types/react-dnd-html5-backend": "^3.0.2",
    "@types/react-dnd-multi-backend": "^5.0.0",
    "@types/react-dnd-touch-backend": "^0.5.0",
    "@types/react-dom": "^16.8.6",
    "azure-devops-extension-api": "^1.158.0",
    "azure-devops-extension-sdk": "^2.0.11",
    "azure-devops-ui": "^2.167.53",
    "lodash": "^4.17.21",
    "moment": "^2.29.4",
    "office-ui-fabric-react": "^7.203.0",
    "pluralize": "^8.0.0",
    "react": "^16.8.6",
    "react-dnd": "^10.0.2",
    "react-dnd-html5-backend": "^10.0.2",
    "react-dnd-multi-backend": "^5.0.1",
    "react-dnd-touch-backend": "^10.0.2",
    "react-dom": "^16.8.6",
    "react-scripts": "5.0.1",
    "typescript": "^4.9.4",
    "web-vitals": "^2.1.4"
  },
  "devDependencies": {
    "sass": "^1.57.1"
  }
}

edtro.azuredevops.extensions.querybasedboards's People

Contributors

edtro avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

edtro.azuredevops.extensions.querybasedboards's Issues

New Feature: Work In Progress Limits

Hey Edward,

it would be great, if you could introduce WIP limits similar to ones offered on the original boards. Maybe it would even be possible to have seperate WIP limits for each swimlane.
And now the killer feature: Maybe the WIP limit could be enforced in a way that if the wip limit of a column is reached, it is not allowed to drag an item to it.

Best Bernhard

Base the columns values on an other (custom) picklistfield

At the moment the columns are solely based on the field System.State.
In some cases it could be handy that you can use an other field.

It should be based on a text picklistfield (for safety reasons, do not use other system fields) like custom fields.
The check on a state change should be skipped.

Note: Not all workitem types will have this (custom) field... so this has to be checked first.

New feature: Use AS-OF date within the query

When enabled the 'AS OF' date that is selected will be added to the query statement, so the actual state of that moment is displayed within the board (be aware: this will not work well together with all of the macros like @today).

question: get all my features + stories from all AND all my stories connected to other features

There is one thing, I stumbled over while setting up things with qbb. I know it's not directly related to qbb, it0s rather a thing how queries work in Azure DevOps. But maybe you know a better way round this thats why I dre to post this question here too.

My use case is:

  • I have different projects set up
  • epics and features are maintained in a global planning project
  • stories life in the product projects
  • the final setup will be quite huge that’s why this separation has been introduced we will have to ensure the system is maintainable (permissions etc.)
  • association from the planning project to others works with area paths which are set up in the planning project and represent the structure of all projects
  • some features need support from other projects so I setup one parent-child-linked story in the other project
  • I want now a single hop query which shows me all features and the child stories
  • the rules should be:
    • show all the features I have associated to my project plus all the stories connected to them, this includes stories which are in other projects and teams
    • show also all my stories, including those which I’m doing for other features in other projects

For more visual people an example diagram below. In queries which are saved as shared queries in all 3 projects there should be this result:

  • Project "Product 1" sees both product features and its stories as one is the own feature and the other contains a story which is linked to the own project / team
  • Project "Product 2" has the same vice versa
  • The Project Platform sees also both of these product features as it has a story of each plus it has a third feature which is not in the queries of the products as it only contains Platform stuff

Features Stories cross Project

I want to see that because the dependencies are important and each project team should see, where they have dependencies to other products and where they have to deliver or are waiting for things.

Bildschirmfoto 2021-02-15 um 07 49 13
(example of the query one below "give me all stories belonging to my features")

The only way I found so far is to have two separate queries which apply the two mentioned rules and combine them. A UNION (without duplicates, so no UNION ALL) would do the trick in one go. Here are my current two test queries.

/** give me all stories belonging to my features **/
SELECT
    [System.Id],
    [System.WorkItemType],
    [System.Title],
    [System.AssignedTo],
    [System.State],
    [System.Tags]
FROM workitemLinks
WHERE
    (
        [Source].[System.WorkItemType] = 'Feature'
        AND [Source].[System.AreaPath] UNDER 'PI-Planning\Plattform'
    )
    AND (
        [System.Links.LinkType] = 'System.LinkTypes.Hierarchy-Forward'
    )
    AND (
        [Target].[System.WorkItemType] <> ''
    )
ORDER BY [System.Id]
MODE (MayContain)
/** give me all features belonging to my stories **/

SELECT
    [System.Id],
    [System.WorkItemType],
    [System.Title],
    [System.AssignedTo],
    [System.State],
    [System.Tags]
FROM workitemLinks
WHERE
    (
        [Source].[System.WorkItemType] = 'Feature'
    )
    AND (
        [System.Links.LinkType] = 'System.LinkTypes.Hierarchy-Forward'
    )
    AND (
        [Target].[System.WorkItemType] <> ''
        AND [Target].[System.AreaPath] = 'Plattform'
    )
ORDER BY [System.Id]
MODE (MustContain)

As I know that this doesn't belong to qbb natively, I also opened a feature request at Microsoft but until someone replies there, we get old and grey ...

WIQL: allow UNION of queries

Update: I also posted a stackoverflow question, maybe I get some infos there: https://stackoverflow.com/questions/66203920/get-all-my-features-stories-from-all-and-all-my-stories-connected-to-other-fea

I hope this is useful also for others using Azure DevOps and Query Based Boards.

After creating an private query the QBB doesn't work for others

Hello!
So the situation is that while we work with shared querys on our Azure DevOps everything works fine and there are no problems. But if one creates a private query and selects to show it as board, then the query based board shows for others only the "Whoops... Something went wrong while loading the configuration page.". For the one who created the private query it still works fine.
If then another person creates also a private query and selects to show it as board, then the query based board extension doesn't work for anyone anymore.
Could this bes somehow fixed?

(Already exists) Feature Request: Add ability to set custom Board Columns

We have a project that is just for doing an extensive platform review. As such, we have:

  • renamed a couple of columns (which show up with the State instead of Column name)
  • Made slight changes to the order of the columns. (but shows up in original order.)

It would be really nice to be able to get Show as Board to display like our board.

Feature request - Board columns based on Projects board columns

The board columns are actually based on de System.State field, which is not how it works in Azure DevOps. Board columns are very useful to follow de developpement progress (for example : Analysis, Approval pending, Development, Revision, QA, etc.)

I know every project has to have the same configuration of Board columns for it to work. But would it be possible to have a look at that feature ? It would really help our dev teams follow the development progress of many projects at once.

Thank you !

"No Data" error message for very simple Query.

We are working on premises on a Azure DevOps Server 2020 (Version Dev18.M170.6) with the xml process template. I installed the version 0.20326.3 of Query Based Boards yesterday. Unfortunately I always get the
"No Data - Please review the query. Please note that only 'flat' and 'one-hop' queries are implemented."
error message, even for very simple queries.

An example Query I used:
Wiql: select [System.Id], [System.Title] from WorkItems where [System.TeamProject] = @project and [System.WorkItemType] = 'Feature' and [System.State] <> 'Done' and [System.State] <> 'Removed'

Is this a known issue or can you give me any hint how I can investigate what the root cause might be?

Aspects that might have influence:
We defined quite some custom fields and also some custom states.
I am currently working over a VPN connection. But also colleagues working directly on their machines have that issue.

image

Bug: Columns for custom states are not displayed

We have in our company added few custom states to the work items, but it looks like that appropriate columns for this states are not displayed even if there are some work items which should be displayed.

Also we have query where we display work items according to the rules:
image
and work items from the second group (based on the changed date and changed by fields) are also not displayed on the board.

New feature: Configure default filter selections

See the question:

Hi,
The "Parent has children" feature was certainly useful for me when filtering tasks. I have customized the configuration to always display the filtering options. I don't understand if it is possible to let the option "Yes" be default though. If so, can you provide me with an example?
Kind regards
Janni
By Janni Kajbrink

Share source code

Hi,
can you share source code of the extension? We would be able to fork it then and make some additional improvements/bug fixes.

We would really appreciate this.

New Feature: Parent on the work item card

Hi,

While it is true it is possible to use the fields to configure the parent it will only display as non-clickable item number.

I would like this to work as a link with the proper item name like on the built-in board:
image

Thanks!

BUG. Custom additional fields on WI card. Board crashes on some fields.

Hi!
I think it's better to discuss here, rather then at VS Marketplace.
As I published as VSM I tried to add custom field from another extension (our own development):

{ "fields":[ { "name":"Logrocon.PerformerIT", "title":"Developer" } ] }

it has same type as AssignedTo. And it crashed the board:
Empty board

But when I add string field from same extension:

{ "fields":[ { "name":"Logrocon.CustomerContact.1C", "title":"Contact" } ] }

everything goes normal:
Normal board

Doing Done column doesn't work

Hi @edtro,
Thanks for implementing this excellent extension. I've got swimlanes and columns working, but the Doing/Done column doesn't work for me. If I use the api to query one of our Work Items I can see the Done Column is set as:

"System.BoardColumn":"In Progress","System.BoardColumnDone":true

So I implemented the column as:

{
"name":"In Progress",
"title":"In Progress/Active",
"width": 2,
"doingDone":{
"field":"System.BoardColumnDone",
"doingTitle":"Working on it...",
"doingDefaultValue":false,
"doneTitle":"Finished!",
"doneValue":true
}
},

Which does show the new sub-columns but doesn't show any of the cards in the done column (just in doing). Is there something I'm doing wrong?

Many thanks
Clive

New Feature: User Filtering to only show relevant

Hi,

Currently if you filter a board with a two level query to a certain user it will display all the first level categories no matter the user does not have it assigned:
image

It would be good to show only the relevant categories. It would only make sense to display them if the user is having subtasks in the Story / Feature. This would enable intra-story collaboration by seeing only the relevant work item categories and subtasks on the board when filtering.

This is somewhat connected to my other ticket:
#33

Thanks!

Collapsible columns behavior is not clear

Some of the columns have an arrow that allow them to be collapsed.
I thought it was the "isBacklog" parameter in the column definition to set that, but it's something else (or it is and it isn't properly working).
So: it's some hidden configuration, it's a bug or it's something else?

Dynamic sizing of column widths

Please could you implement dynamic sizing of column widths to allow more than 1 card to show horizontally in columns when the users window size allows this?

This would be really useful for us when we do a Kanban style standup (we have lots of cards in each team column)

Feature Request: add all workitems to a swimlane under a certain area path

Current situation
I'm using swimmlane definitions like shown in the example at the bottom. This works quite nice. Workitems which have these area paths set can be moved through the swimlanes. It's clear that it is not possible to change the area path via drag n drop, which is also a good behavior to not accidently change the area path.

I have area paths with deeper areas for example Platform\Team1 Platform\Team2 etc. On the board I need to create a swimmlane for every exact area path. Otherwise the Items are not shown or not movable on the board.

Desired behavor
On the overall board I only want to see a swimmlane Platform. It should contain workitems which are on any area path beneath that parent area path. I also want to move these items in the swimmlane. That the area path will never be changed on the workitem is a goos behavor and shpuld stay as it is.

Example

   "swimlanes":{
      "field":"System.AreaPath",
      "defaultValue":"Planning",
      "values":[
         {
            "value":"Planning",
            "title":"Planning"
         },
         {
            "value":"Platform",
            "title":"Platform"
         }
      ]
   },

unable to import configuration for queries

I'm trying to import configuration for my queries, but the configuration does not get imported. For the global config on the other hand, I can see the imported config.
Also, when I choose "Show all queries" in the extensions configuration tab, the queries do not appear.

"TeamProjectSettings hub" ?

this page refers to a team project settings hub. I googled for this and did not find anything for Azure DevOps. Where would one locate this hub? Is there a different name for it?

feature request: query based boards with iterations as columns

First of all thank you for this awesome plugin, easily one of the best plugins available for Azure DevOps.

I have a question, or rather feature request: is there a way of having the sprints / iterations as columns (iteration path either top-level only = iteration or lowest level = sprint)?

Let me know if I'm unclear here or if I can help implementing this.

PS: the new Plans V2.0 of Azure DevOps which is in preview has a similar feature but is way less flexible and nice looking as the query based boards do. Thus, I would always prefer to use qbb.

Bug: filter is reset after opening/closing a workitem

As reported on the marketpace, by Janni Kajbrink:

Hi, I really like the feature to filter the task board for different values. But when I have selected a filter and then open for example a User Story and then closes it, the selected filter is cleared. To reproduce

  1. Select a user in the Assigned To filter
  2. Open a user story
  3. Close the user story
  4. The filter is cleared and there is no longer any user selected in the "Assigned to" filter Is this expected?

Show as Taskboard button not displaying for some users

Hi,

We installed this (amazing, by the way) plug in a few days ago. I'm seeing strange issue where some users are seeing the above button but others are not. They are both in the same organization and project. Identical permissions and licensing.

I've asked those that cannot see this button to restart/refresh/clear cache. Both Chrome and Edge.

Any guidance very much appreciated :)

Shai

cannot move work item to doing / done columns

Not sure if I got this wrong. I have this json config for my board as shown at the bottom. My question: why am I not able to drag n drop in one of the doing / done columns? In the picture below I try to drop teh item in teh analysis doing column and this didn't work.

Bildschirmfoto 2021-02-19 um 16 58 11

{
   "settings":{
      "showFilter":true,
      "showArrows":true,
      "showProject":true,
      "showStoryPoints":false,
      "showTags":true
   },
   
   "swimlanes":{
      "field":"System.AreaPath",
      "defaultValue":"Planning",
      "values":[
         {
            "value":"Planning",
            "title":"Planning"
         },
         {
            "value":"Planning\\Platform",
            "title":"Platform"
         },
         {
            "value":"Planning\\Produkt1",
            "title":"Produkt1"
         },
         {
            "value":"Planning\\Produkt2",
            "title":"Produkt2"
         },
         {
            "value":"Planning\\Produkt3",
            "title":"Produkt3"
         }
      ]
   },
      "columns":[
      {
         "name":"Backlog",
         "title":"Backlog",
         "isBacklog":true
      },
      {
         "name":"Analysis",
         "title":"Analysis",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Implementation",
         "title":"Implementation",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Verification",
         "title":"Verification",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Done",
         "title":"Done",
         "isBacklog":true
      }
   ]
}

I have a similar issue with task boards, json example and screen below. I cannot move the work item plus teh done (I call it ready) column ist not shown.

Bildschirmfoto 2021-02-19 um 17 11 46

{
   "settings":{
      "showFilter":true,
      "showArrows":true,
      "showProject":true,
      "showStoryPoints":false,
      "showTags":true
   },
   
   "columns":[
      {
         "name":"Backlog",
         "title":"Backlog",
         "isBacklog":true
      },
      {
         "name":"Analysis",
         "title":"Analysis",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Implementation",
         "title":"Implementation",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Verification",
         "title":"Verification",
         "doingDone":{
            "field":"System.BoardColumnDone",
            "doingTitle":"Doing",
            "doingDefaultValue":false,
            "doneTitle":"Ready",
            "doneValue":true
         }
      },
      {
         "name":"Done",
         "title":"Done",
         "isBacklog":true
      }
   ]
}

With some zoom levels the "Arrow control" to collapse the most right column is overlaid by the options button.

With some zoom levels the "Arrow control" to collapse the most right column is overlaid by the options button. The Screenshot below is taken with a zoom level of 100%. I tested it with Edge 87.0.664.75 and Vivaldi 3.5.2115.87 (based on Chromium 87.0.4280.142).
When the filters are activated it is no problem, because the Options button is then shown on a separate row with the filters. Maybe it would be better to always show the options button on a separate row.

image

Bug: queries not shown in settings after project is renamed

Quick tipp

If you are stumbeling over the same issue, see the workaround solution here: #47 (comment)

Original request

I've created a couple of shared queris in a project and none of them is showing up in the project settings to allow configuration. I guess there is something screwed up but I don't know exactly where to start. I've a couple of projects where I've done similar setups and it's working quite well.

Special in the affected project: it has been renamed.

Other inputs or hints: in the development console of the brwoser I get a 404 when I want to open the settings:

GET https://server/collection/_apis/ExtensionManagement/InstalledExtensions/realdolmen/EdTro-AzureDevOps-Extensions-QueryBasedBoards-Public/Data/Scopes/Default/Current/Collections/querybasedboards-import/Documents 404 (Not Found)

When I run a query and click the "show as board" button there is a super quick error message I'm not able to capture. In the developer console I see a bunch of errors:

ms.vss-web.platform-…jTC5yBclkr.min.js:1 POST https://server/collection/_apis/ExtensionManagement/InstalledEx…copes/Default/Current/Collections/querybasedboards-configuration/Documents 400 (Bad Request)

Could not create configuration for query: ee5fca6e-219e-4811-a071-4bedefa767da

GET https://server/collection/_apis/GraphProfile/MemberAvatars/win.Uy0xLTUtMjEtMzMwMDg0MjA5Mi04MTkxODE4MjUtMjEzMzgyNzUzOC0zMzg1MQ 401 (Unauthorized)

(I guess the last one is not relevant, only to be complete)

What I also can say: I can add the global config but it is not repected in the queries.

Please let me know how I can help to investigate further.

EDIT
Just found out a very important thing I guess: I had a collection backup restored as test environment before we renamed the affected project. And before we renamed the project the queries have worked propperly. So I assume that this is linked to renaming projects.

Possibility to create a Backlog based on Query

I really like this extension and its functionality of visualizing dependencies and searching across projects. Do you think it will be (maybe already is) a possibility to create a backlog from the query?

I would like to use "Add a rollup column" for a backlog based on the query created from items from multiple projects.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.