Skip to content

Commit

Permalink
Merge pull request #17 from rajbos/extract-js
Browse files Browse the repository at this point in the history
Extract the first set of javascript into widget specific files
  • Loading branch information
rajbos authored Sep 18, 2023
2 parents 72f16c6 + 79d91e7 commit 75a4dbb
Show file tree
Hide file tree
Showing 10 changed files with 198 additions and 200 deletions.
22 changes: 22 additions & 0 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
name: CI

on:
push:

jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4

- uses: actions/setup-node@v3
with:
node-version: 16

- run: |
npm install
npm install -g tfx-cli
- name: Create extension
run: tfx extension create --manifest-globs vss-extension-dev.json --rev-version
#- run: npm run test
21 changes: 21 additions & 0 deletions library.js
Original file line number Diff line number Diff line change
Expand Up @@ -141,4 +141,25 @@ function getDatePoints() {
}

return trendDates;
}

function consoleLog(message) {
console.log(message);
}

async function getRepos(VSS, Service, GitWebApi) {
try {
const webContext = VSS.getWebContext();
const project = webContext.project;

// todo: load the available repos in this project
const gitClient = Service.getClient(GitWebApi.GitHttpClient);
repos = await gitClient.getRepositories(project.name);
console.log(`Found these repos: ${JSON.stringify(repos)}`);
return repos;
}
catch (err) {
console.log(`Error loading the available repos: ${err}`);
return [];
}
}
9 changes: 3 additions & 6 deletions vss-extension-dev.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"manifestVersion": 1,
"id": "GHAzDoWidget-DEV",
"version": "0.0.1.73",
"version": "0.0.1.84",
"public": false,
"name": "Advanced Security dashboard Widgets [DEV]",
"description": "[DEV] GitHub Advanced Security for Azure DevOps dashboard widgets",
Expand All @@ -14,7 +14,7 @@
],
"targets": [
{
"id": "Microsoft.VisualStudio.Services"
"id": "Microsoft.VisualStudio.Services.Cloud"
}
],
"tags": [
Expand Down Expand Up @@ -113,7 +113,7 @@
"RobBos.GHAzDoWidget-DEV.GHAzDoWidget.Chart.Configuration"
],
"properties": {
"name": "[DEV] GHAzDoWidget - Sample Chart",
"name": "[DEV] GHAzDoWidget - Chart",
"description": "[DEV] A trend chart widget for Advanced Security alerts.",
"catalogIconUrl": "img/publogo.png",
"uri": "/chart/chart.html",
Expand Down Expand Up @@ -155,9 +155,6 @@
{
"path": "styles.css", "addressable": true
},
{
"path": "sdk/scripts", "addressable": true
},
{
"path": "img", "addressable": true
},
Expand Down
5 changes: 1 addition & 4 deletions vss-extension.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
],
"targets": [
{
"id": "Microsoft.VisualStudio.Services"
"id": "Microsoft.VisualStudio.Services.Cloud"
}
],
"tags": [
Expand Down Expand Up @@ -155,9 +155,6 @@
{
"path": "styles.css", "addressable": true
},
{
"path": "sdk/scripts", "addressable": true
},
{
"path": "img", "addressable": true
},
Expand Down
21 changes: 2 additions & 19 deletions widget_1x1/configuration_1x1.html
Original file line number Diff line number Diff line change
Expand Up @@ -16,23 +16,6 @@
var $repoDropdown = $("#repo-dropdown");
var $repoAlertType = $("#repo-alert-type");

async function getRepos() {
try {
const webContext = VSS.getWebContext();
const project = webContext.project;

// todo: load the available repos in this project
const gitClient = Service.getClient(GitWebApi.GitHttpClient);
repos = await gitClient.getRepositories(project.name);
console.log(`Found these repos: ${JSON.stringify(repos)}`);
return repos;
}
catch (err) {
console.log(`Error loading the available repos: ${err}`);
return [];
}
}

function reloadWidget(widgetConfigurationContext) {
let repo;
if (repos) {
Expand All @@ -57,7 +40,7 @@
var settings = JSON.parse(widgetSettings.customSettings.data);
console.log(`Loading the 1x1 settings with ${JSON.stringify(settings)}`)

const repos = await getRepos();
const repos = await getRepos(VSS, Service, GitWebApi);
// add all repos as selection options to the dropdown
if (repos) {
// add a top option to select no repo
Expand Down Expand Up @@ -91,7 +74,7 @@
return WidgetHelpers.WidgetStatusHelper.Success();
},
onSave: async function() {
const repos = await getRepos();
const repos = await getRepos(VSS, Service, GitWebApi);
let repo;
if (repos) {
// find the repo with this name
Expand Down
94 changes: 3 additions & 91 deletions widget_1x1/widget_1x1.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<head>
<script src="../lib/VSS.SDK.min.js"></script>
<script src="../library.js"></script>
<script src="widget_1x1.js"></script>
<link rel="stylesheet" href="../styles.css" />

<script type="text/javascript">
Expand All @@ -28,111 +29,22 @@
consoleLog('project name: ' + projectName);
consoleLog('organization name: ' + organization);

async function loadWidget(widgetSettings) {
consoleLog(`WidgetSettings inside loadWidget_1x1: ${JSON.stringify(widgetSettings)}`);

// data contains a stringified json object, so we need to make a json object from it
const data = JSON.parse(widgetSettings.customSettings.data);

// init with default values
let alerts = {
dependencyAlerts: 0,
secretAlerts: 0,
codeAlerts: 0
};
let linkBase = 'https://dev.azure.com';

if (data && data.repo) {
const repoName = data.repo;
const repoId = data.repoId;
consoleLog('loaded repoName from widgetSettings_1x1: ' + repoName);

// set the tile
var title = $('h2.ghazdo-title');
title.text(`${repoName}`);
alerts = await getAlerts(organization, projectName, repoId);
consoleLog('alerts: ' + JSON.stringify(alerts));

// GHAS is only available on the SaaS version, so we can hardcode the domain
linkBase = `https://dev.azure.com/${organization}/${projectName}/_git/${repoName}/alerts`;
}
else {
consoleLog('configuration_1x1 is needed first, opening with empty values');
// set the tile to indicate config is needed
var title = $('h2.title');
title.text(`Configure the widget to get Security Alerts`);
}


let alertTypeToShow = 1
if (data && data.repoAlertType) {
alertTypeToShow = data.repoAlertType;
}

// set the alert count
consoleLog(`Setting the alert count 1x1 for type ${alertTypeToShow}`);
const alertCountEl = $('p.alertCount');
let alertCount = 0;
let alertTypeLink = ""
let alertTypeDescripion = "";
switch (alertTypeToShow) {
case "1":
alertCount = alerts.dependencyAlerts;
alertTypeLink = `${linkBase}?_t=dependencies`;
alertTypeDescripion = "Dependency Alerts";
break;
case "2":
alertCount = alerts.secretAlerts;
alertTypeLink = `${linkBase}?_t=secrets`;
alertTypeDescripion = "Secret Scanning Alerts";
break;
case "3":
alertCount = alerts.codeAlerts;
alertTypeLink = `${linkBase}?_t=codescanning`;
alertTypeDescripion = "Code Scanning Alerts";
break;
default:
alertCount = alerts.dependencyAlerts;
alertTypeLink = `${linkBase}?_t=dependencies`;
alertTypeDescripion = "Dependency Alerts";
break;
}

consoleLog(`Setting the alert count to [${alertCount}] with description [${alertTypeDescripion}] and link [${alertTypeLink}]`);
try {
alertCountEl.text(alertCount);
const alertLinkEl = $('a.alert-link');
alertLinkEl.attr('href', alertTypeLink);

// set the alert type
const alertType = $('h3.alertType');
alertType.text(alertTypeDescripion);
}
catch (err) {
consoleLog(`Error setting the alert count 1x1: ${err}`);
}
}

return {
load: async function (widgetSettings) {
await loadWidget(widgetSettings);
await loadWidget(widgetSettings, organization, projectName);

return WidgetHelpers.WidgetStatusHelper.Success();
},
reload: async function (widgetSettings) {
consoleLog('reload with widgetSettings: ' + JSON.stringify(widgetSettings));
await loadWidget(widgetSettings);
await loadWidget(widgetSettings, organization, projectName);
return;
}
}
});
VSS.notifyLoadSucceeded();
}
);

function consoleLog(message) {
console.log(message);
}
</script>

</head>
Expand Down
85 changes: 85 additions & 0 deletions widget_1x1/widget_1x1.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
async function loadWidget(widgetSettings, organization, projectName) {
consoleLog(`WidgetSettings inside loadWidget_1x1: ${JSON.stringify(widgetSettings)}`);
consoleLog(`Running for organization [${organization}], projectName [${projectName}]`);

// data contains a stringified json object, so we need to make a json object from it
const data = JSON.parse(widgetSettings.customSettings.data);

// init with default values
let alerts = {
dependencyAlerts: 0,
secretAlerts: 0,
codeAlerts: 0
};
let linkBase = 'https://dev.azure.com';

if (data && data.repo) {
const repoName = data.repo;
const repoId = data.repoId;
consoleLog(`loaded repoName from widgetSettings_1x1: [${repoName}] and id [${repoId}]`);

// set the tile
var title = $('h2.ghazdo-title');
title.text(`${repoName}`);
consoleLog(`title set to [${repoName}]`);
alerts = await getAlerts(organization, projectName, repoId);
consoleLog('alerts: ' + JSON.stringify(alerts));

// GHAS is only available on the SaaS version, so we can hardcode the domain
linkBase = `https://dev.azure.com/${organization}/${projectName}/_git/${repoName}/alerts`;
}
else {
consoleLog('configuration_1x1 is needed first, opening with empty values');
// set the tile to indicate config is needed
var title = $('h2.ghazdo-title');
title.text(`Configure the widget to get Security Alerts`);
}

let alertTypeToShow = 1
if (data && data.repoAlertType) {
alertTypeToShow = data.repoAlertType;
}

// set the alert count
consoleLog(`Setting the alert count 1x1 for type ${alertTypeToShow}`);
const alertCountEl = $('p.alertCount');
let alertCount = 0;
let alertTypeLink = ""
let alertTypeDescripion = "";
switch (alertTypeToShow) {
case "1":
alertCount = alerts.dependencyAlerts;
alertTypeLink = `${linkBase}?_t=dependencies`;
alertTypeDescripion = "Dependency Alerts";
break;
case "2":
alertCount = alerts.secretAlerts;
alertTypeLink = `${linkBase}?_t=secrets`;
alertTypeDescripion = "Secret Scanning Alerts";
break;
case "3":
alertCount = alerts.codeAlerts;
alertTypeLink = `${linkBase}?_t=codescanning`;
alertTypeDescripion = "Code Scanning Alerts";
break;
default:
alertCount = alerts.dependencyAlerts;
alertTypeLink = `${linkBase}?_t=dependencies`;
alertTypeDescripion = "Dependency Alerts";
break;
}

consoleLog(`Setting the alert count to [${alertCount}] with description [${alertTypeDescripion}] and link [${alertTypeLink}]`);
try {
alertCountEl.text(alertCount);
const alertLinkEl = $('a.alert-link');
alertLinkEl.attr('href', alertTypeLink);

// set the alert type
const alertType = $('h3.alertType');
alertType.text(alertTypeDescripion);
}
catch (err) {
consoleLog(`Error setting the alert count 1x1: ${err}`);
}
}
Loading

0 comments on commit 75a4dbb

Please sign in to comment.