sswconsulting/ssw.people

This is the site generator for SSW.People. ▶️ Video: http://r.ssw.com/SSW-people

SSW People

This is a Gatsby generated website, leveraging data from SSW.People.Profiles (GitHub) and SSW CRM. Pages are automatically re-generated and published to our SSW website when a profile markdown page is updated.

Learn more on Adam's Blog - Introducing SSW People!

SSW People is the SSW Employee Pages V2 - No more SharePoint!

This is a Gatsby generated site pulling data from:

• SSW Profiles GitHub Repository
• Dynamics CRM

Getting Started

Required Tools

• Install nodejs via https://nodejs.org/en/ (LTS Version)

• Install yarn via https://yarnpkg.com/lang/en/docs/install/ (Used for package management)

• Package dependencies (Windows)

  • Python 3
  • Node-gyp - see https://github.com/nodejs/node-gyp#on-windows
  • Install Visual Studio 2022 - Desktop Development with C++ in the Visual Studio Installer

  Figure: Desktop Development with C++ workload

Getting ready for development

• Clone the repo from https://github.com/SSWConsulting/SSW.People

• Run yarn (or npm install) to install packages

• Create environment files (.env.development and .env.production) and fill out the values for the following keys:

  GOOGLE_ANALYTICS=
  RECAPTCHA_KEY=
  DATA_API_URL=FALSE
  DATA_API_AUTHORIZATION=
  DATA_API_TENANT=
  YOUTUBE_API_KEY=
  VERSION_DEPLOYED=#{VERSION_DEPLOYED}
  CHINA_BUILD=FALSE
  EVENTS_API=https://www.ssw.com.au/ssw/SharePointEventsService.aspx
  CONTACT_API=/ssw/api/crm/createlead
  CRM_APP_ID=
  CRM_TENANT=
  CRM_TENANT_ID=
  CRM_APP_SECRET=
  CRM_SCOPE=
  CRM_VIEW_CURRENT=
  CRM_VIEW_PAST=
  APPINSIGHTS_INSTRUMENTATIONKEY=#{APPINSIGHTS_INSTRUMENTATIONKEY}
  REWRITES_JSON_URL=FALSE

Development

1. Branch off main for your PBI
2. Run yarn build (or npm run-script build) (.env.production is required for this step)
3. Do your work
4. Run the site in development mode by yarn develop (or npm run-script develop) (.env.development is required for this step)
5. Commit code and push
6. Raise a PR
7. Get it merged!

Definition of Done

• Code Compiles
• Check the Acceptance Criteria.
• Code is squash-merged to main via a pull request that was approved by a 2nd developer.
• Another team member agrees it’s ready for Production.
• Pushed to Production.
• Use @Mention (OR Send email) to notify Product Owner/PBI stakeholder that PBI is done (be sure to include screenshots/done video as proof)

<As per rule: Done - Do you go beyond 'Done' and follow a 'Definition of Done'?>

Branches

• Branching strategy is based off Release Flow
• Main is the main 'dev' branch
• Release/xx is the 'production' one (where xx is incremented from the previous release)
• Always create a new branch for your PBIs
• Always delete your branch once your PR has been merged

Builds

• Changes made to https://github.com/SSWConsulting/SSW.People.Profiles (i.e. profile changes) trigger builds that deploy:

  • main to the staging site: https://staging.ssw.com.au/people/
  • latest release/xx to the production site: https://www.ssw.com.au/people

• Branching off main to release/xx, or making changes to release/xx will build and deploy to the production site: https://www.ssw.com.au/people

Note: people.ssw.com.au redirects to https://www.ssw.com.au/people

People profiles repository

People profiles repository lives here: https://github.com/SSWConsulting/SSW.People.Profiles

• Sample Profile:
  • Staging: https://staging.ssw.com.au/people/bob-northwind
  • Production: https://www.ssw.com.au/people/bob-northwind

Merging changes to main on this repo will trigger:

• a build/release of the main branch in Staging (https://staging.ssw.com.au/people/)
• a build/release of the release branch Production (https://www.ssw.com.au/people)

Next Step: Wiki >

---

SSW.People YouTube Channel

ssw.people's Issues

UI - Make

Sorting wrong when missing the sketch image

When a profile is missing the sketch image, the order of the profiles is back to alphabetical.

Figure: Order is alphabetical

This is because it creates javacript errors that prevent the sorting to happens.
Use placeholder images if the image is missing

GitHub Widget - Investigate cause of errors and when it fails display nothing instead of an error

@calumjs @Berber-Mama @adamcogan @christianmorfordwaitessw @bradystroud

Yang just spotted this weird issue on Calum's SSW people page – the GitHub contributions says “Error :(“

When Calum went to check it for himself, it worked fine. Apparently Yang has the same issue on everyone’s page, so it’s not just Calum's.

Adam also experienced the same issue as Yang in the past but hasn't been able to reproduce the issue recently.

• Please investigate…maybe something to do with a VPN connection, etc.
• See if we can make it so if widget's fail, they are just hidden instead of displaying an error.

Figure: Yang’s view has an error

Figure: My view works fine

Chinafy - Missing Chinafy link

(reported by @adamcogan)

The SSW People mini site has been Chinafied, there should be a link in the footer to the rules

• add a link to https://rules.ssw.com.au/rules-to-better-internationalization (similar to SugarLearning)

Figure: SugarLearning has a Chinafied link in the footer with a link to the rules

jean

test

AB#58105

UI - Add Favicon to SSW.People

Noticed SSW.People site doesn't have a favicon:

1. Please add the SSW squares (SSW.Rules is a good example)

AB#60584

BUG: Cannot deploy SSW.People without any profiles

SSW.People requires at least one profile to build the site. This is because it is expecting frontmatter values.
The site should be able to be deployed blank without any profiles.

AB#56817

Profile - print css - events

Cc @adamcogan

When I print a profile and look at events:

1. Events are not aligned
2. Event headings look too big

AB#56164

🔨 Fix empty Upcoming Speakers list

Hi team,

I don't think we should have that empty "Upcoming Speakers" heading on the sidebar...

Not sure if it is a bug (not showing stuff) OR if we really don't have any upcoming events added to the calendar.

Either way, the user shouldn't see this empty

1. Please action
   a) Add the upcoming Speakers
   OR
   b) Hide that section for the time being

Create Architecture Diagrams

• Create Architecture Diagrams on SSW.People

Profile Automation - Creating Profile Wiki is unclear

CC @leahy268 @christianmorfordwaitessw @adamcogan @bradystroud
As per my conversation with Warwick, Christian and Brady on August 19th, when users go through SugarLearning and navigate to the Wiki it is unclear how to reach the profile creation section or when they have finished.

• Add a part at the end of the profile creation Wiki to contact someone to review your Pull Request.
• Review the Wiki to make sure the end-to-end process for creating profiles is Crystal clear from the home page.
• On SugarLearning, change the navigation to more clearly point to instructions on profile creation.
  e.g. it should directly link to a wiki page that explains it.
• Get the Wiki and SugarLearning changes checked by someone unfamiliar with the process and non-technical
• Investigate if we can add Automated Reviewers to our Pull Requests and if this is a good idea.
• If the above was a good idea then implement it.
• Get this all checked by @adamcogan

Figure: It is not clear what else I need to do before my profile is done e.g. create a Pull Request and have it reviewed

Figure: SugarLearning doesn't clearly communicate the process which makes it hard for users to follow.

Footer - GitHub should link to rules to better GitHub

(reported by @adamcogan)

**Figure: GitHub link in the footer goes to a static site rule instead of rules about GitHub

• Github should link to https://rules.ssw.com.au/rules-to-better-github

UI - Add Newcastle office filter

CC @adamcogan

Since we have an office in Newcastle, we should advertise it on SSW.People

Figure: I work in the Newcastle office but you wouldn't know that from the filters

AB#59373

Change profile image behavior on individual employee pages

As per my conversation with @SebastienBoissiere ...

On SSW.People... I would like to suggest a change on the individual pages:
E.g. https://www.ssw.com.au/people/tiago-araujo

Currently, when we hover the image, it shows the b&w funny version.

I think this behavior is bad as it prevents the user from saving the colorful photo + it's not expected (hover effects are for clickable things)

I know @adamcogan asked for it - probably with no good reason :D.

My suggestion is to make the images toggle on click (not on hover). This way everyone is happy!

Footer - Continuous deployment rule is archived

(Reported by @adamcogan)

Footer links to an archived continuous deployment rule:

Figure: Footer has a link for continuous deployment

Figure: Rule has been archived

• Change link to point to a current rule about continuous deployment

Profile Automation - Profile creation flow is not working

CC @leahy268 @christianmorfordwaitessw @adamcogan @bradystroud
As per my conversation with Warwick, Christian and Brady on August 19th, when users try to run the Automated profile creation flow, they run into an issue with the Azure KeyVault connection

• Investigate and fix the Azure KeyVault connection

Figure: Users click on Flow | Create SSW.People profile but are unable to proceed further due to an invalid Azure KeyVault connection

Can we get all badge clickable and jump to a specific website?

Currently when I click a badge like "AngularHackday", Website will lead me to https://angularhackday.com
but if I click DevOps badge or Anglar badge. it will just open the image in a new window

UX - SSW Mega Menu - Add hoverIntent

@tiagov8 @bradystroud @adamcogan
Hi Seb,

As per our conversation, I’d like to add hoverIntent to our mega menu: https://briancherne.github.io/jquery-hoverIntent/

A notice the dropdown menu pops up immediately every time the mouse passes over it which in many cases is not what the user wants

1. Please action

Cheers,
Tiago

Chinafy SSW.People

@bradystroud @adamcogan
Currently the SSW.People website is all in English and is designed for Australia.

We need to Chinafy SSW.People to make it ready for the China market.

Patrick Zhao's profile

Hello team,

My CRM profile and SSW People site content does not match.

Figure: CRM page

Figure: SSW People site

I tried to add a new skill and I've received an email notification saying change will come through soon. But I have not seen any update in 10 minutes.

AB#58894

Could we have employees' high-res images for download?

Hi team,

If I go to a profile (e.g https://www.ssw.com.au/people/matt-wicks) and click on the download photo icon...

...I get a small image 172 x 242px... This is really small to be used in a presentation or other pages

Currently, we only upload 2 images to the SSW.People profiles (color and B&W Sketch).
I would like to include a 3rd one (color high-res) that would be the one downloaded by clicking on that button

📃Roles | SSW People should link off to our Roles repo

@UlyssesMaclaren @christianmorfordwaitessw @bradystroud

On SSW People it should link off to our SSW Roles Repo which explains what all our roles mean.

1. 2. Add a link to https://github.com/SSWConsulting/SSW.Roles next to "Developers" as “About our Roles”:

Figure: Add link to what the roles mean

BUG - Kiki's image have different sizes

Hi team,

https://www.ssw.com.au/people/kiki

Kiki's coloured image has a non-standard size (aspect ratio)

1. Please fix

UI - Make "Edit/Info" links/buttons consistent with SSW.Rules

Hi team,

1. Please update the "Edit" and "Info" links on a SSW.People profile (example) to be consistent with SSW.Rules (example)
2. The URL for the info, should also change to point to SSW.People wiki Please action

from

to

BUG - empty skill

Hi team,

There is an empty skill on the list... which although have "(0)" shows Tim under it...

1. Please fix https://www.ssw.com.au/people/?skill=&skill=

Footer - Promote other people to use the project

(reported by @adamcogan)

In the footer, change from:
We ❤ open source. This page is on GitHub

To:
We ❤ open source. Fork this on GitHub and start using it for yourself.

Photo Album Widget

Create a Photo Album widget to pull photos from Google Photos using the Album link on the User Profile

• Show photos down the side of the page under the social links?

Missing profile URL nickname redirects

When a user changes there nickname, the URL redirect to their profile is changed.
This causes the old redirect to be removed and creates a broken link.

UI - Make alumni status more obvious

To: @BrandlD , @tiagov8
CC: @adamcogan , @christianmorfordwaitessw

As per our conversation, we need something on a past employee profile to make it obvious they are past employees.

1. Add an emoji or a label to past employee's profiles

Figure: Past employee's profile

AB#57225

Couldn't download Nick's image

Today I tried to download Nick's photo from https://www.ssw.com.au/people/nicholas-viet and got a 404:

https://www.ssw.com.au/people/static/Nicholas-Viet-Sketch-269f991294fa9cd6cfb2cc146169f4d6.jpg

AB#56449

Update Profile Page to hide/show Talks

On the people page, for talks use this logic to hide show

1. If person has upcoming talks (no change)
2. If person has no upcoming talks and no past talks then Hide Upcoming Talks and Past Talks
3. If person has no upcoming talks and past talks then Hide Upcoming Talks and show Past Talks

SSW.People build is throwing a fatal error because it is running out of memory

SSW.People is building successfully but throwing a fatal out of memory error during the build process. This problem needs to be investigated.

Figure: The fatal error in the build

Add custom tag for logos

As per email with @tiagov8

We have a CSS saying all content images have a 5px border. It works well for a proper content image (although very few profiles have them – Adam’s is one)
… however it doesn’t for logos or icons (like what we have on JK clients).

1. Could we setup a special class that allows us to choose to have the border or not?
   I’d say don’t have it by default

AB#57123

jean

jean

AB#58106

Change default branch name

Given that this project is being developed in public domain.

Change the default branch from:
master

To:
main

Steps to implement have been documented at https://www.hanselman.com/blog/EasilyRenameYourGitDefaultBranchFromMasterToMain.aspx

Profile Automation - Automatic notification when profile changes should be live

CC @leahy268 @christianmorfordwaitessw @adamcogan @bradystroud @wicksipedia
As per my conversation with Warwick, Christian and Brady on August 19th, when users make a change to their profile it is very unclear whether or not their changes should be live. From their perspective they get an email saying changes were made but it doesn't give them any indication on if the changes should already be live or not. To address this problem we should implement some kind of automated email notification to indicate that changes are deployed.

• When a flow is triggered from people add the user who triggered it to a subscription list
• When the next rolling build is triggered we send out an email to those on the subscription list to say the build has been triggered and should go live in 20 minutes and then clear the subscription list.
• Investigate if we should extend this further by sending a notification when the deployment itself is complete and implement it if it makes sense.

See the below diagram for details of the process:

Figure: The process for triggered people profile changes

Advanced Layout

Would be good to create a min of 2 column layout within divs for better visual

Data - sample profile not displaying correctly

The sample profile is not rendering all the data
https://ssw.com.au/people/sample

It is missing:

• Name
• Social links
• Edit button

Figure: Sample profile missing data

AB#56158

🐛 Profiles | Ordering is wrong

@UlyssesMaclaren @bradystroud @christianmorfordwaitessw

1. On https://www.ssw.com.au/people/, the devs should show in order of job title:
   • Solution Architects
   • Senior Software Architects
   • Software Architects
   • Senior Software Developers
   • Software Developers

Note: this is already partially done but some of the people are jumbled

The GitHub action for creating employee profiles is not working

@christianmorfordwaitessw @bradystroud

The GitHub action for creating employee profiles is not working. It has not run in 11 months, this needs to be investigated.

Figure: the create employee profile action which is not working

UX when booking an initial meeting

@wicksipedia @adamcogan @bradystroud @christianmorfordwaitessw
Hi Team,

UX when booking initial meetings should be improved, this may be an issue with the SSW.Website instead of SSW.People. However, we are not sure.

1. Front end - The clients request should be fire/forget (and shouldn't see errors)
2. Backend - The request should be put into CRM async
   Try following one of the cloud patterns e.g. https://docs.microsoft.com/en-us/azure/architecture/patterns/queue-based-load-leveling
3. UX - It should redirect you immediately when you press submit
4. UX - The UX is bad/slow... No spinner to show it was doing something
5. Was this error visible to developers? E.g. with raygun or app insights?
6. Update SSW.People and/or SSW.Website to log errors when they occur.

Figure: The issue which prompted this review of the UX.

Footer - Missing Facebook link

(reported by @adamcogan)

In the footer, the Facebook link does not link to anything

Figure: Facebook link has no href

• Facebook link should go to https://www.facebook.com/SSW.page/

SSW.People profile email updates

Hi Seb,

Can you please make the following changes to the rules email? (note I’ve also incorporated Adam’s change too)

1. Change from
   Hi Tiago,

You have made a change to CRM | User | Adam
These changes will appear in SSW People after 30 mins.
Thanks for updating, it will be live soon

More information about this rolling build can be found here
https://raw.githubusercontent.com/SSWConsulting/SSW.People.Profiles/main/.github/instructions/images/rolling_build.png

-- Powered By CRM.SSWPeople
To
Hi Tiago,

Thanks for your updates to SSW People | Adam. These changes will be live after about 30 mins.

This happened because you made a change to CRM | User | Adam. More information about this rolling build can be found here
https://raw.githubusercontent.com/SSWConsulting/SSW.People.Profiles/main/.github/instructions/images/rolling_build.png

-- Powered By CRM.SSWPeople
https://github.com/SSWConsulting/SSW.People (an open source project by www.ssw.com.au )

Figure: the change with highlighting because GitHub doesn't support highlighting text aside from code blocks

Profile - print css formatting

Cc: @adamcogan

When I print a profile:

1. The horizontal divider under the quote doesn't span the entire width
   Delete it
2. It isn't clear that the quote is a quote
   Add quote markers
3. Hide YouTube videos or replace with cover art

Recommendation:

AB#56166

Add Social Media Icons

@jaydenalchin @tiagov8 @adamcogan

As per our conversations and emails, the social media icons in the header of the SSW website should be added to SSW People in the footer.

1. Add our 6 social media icons to the footer
2. Remove the link “FIND US ON [Facebook]” (being replaced with the above)
3. Remove the dated HTML5 link (that leads to https://www.w3.org/html/logo/faq.html)

Figure: Footer needs social media icons

Figure: Social media icons to add

Profile - responsive css - layout

cc @adamcogan @sswrebeccaliu @tiagov8

As per our conversation on email - we'd like:

1. when viewing the profile on a phone - swap the quote/social links sections

AB#56165

Skills Sorting - Sort Advanced and Intermediate Skills

The skills in their relevant sections don't seem to sorted in any particular order (are these maybe in creation order). In the absence of a sort order within Advanced and Intermediate sections, sort these alpha order within each section.

People-cn indexed instead of people

Hey @SebastienBoissiere,
cc: @adamcogan @calumjs @christianmorfordwaitessw

I looked for “kiki ssw” in Google today and found that the result showed people-cn link instead of people, take a look at this quick gif for what I see:

Result example:

ssw.com.au › people-cn › kaique-biancatti
Kiki is one of those rare Sys Admins who is a Powershell Guru. He has been an Infrastructure Analyst at SSW for many years, and he has taken some of our ...

Expected:

ssw.com.au › people › kaique-biancatti
Kiki is one of those rare Sys Admins who is a Powershell Guru. He has been an Infrastructure Analyst at SSW for many years, and he has taken some of our ...

1. Can you check why people-cn is being indexed?
2. Is this happening to everyone?
3. The gif took a little trouble, did it help at all?

CRM Skill Changes cause duplicate deployment email

CC: @bradystroud

Hi,

When adding skills in the CRM, a duplicate email is triggered.

1. Only send one email on skill change

Figure: Email showing duplicate emails (see timestamps)

-Luke

Can we improve the skills list?

cc @adamcogan @camillars @UlyssesMaclaren @jaydenalchin @2fernandez

Hi team,

I think we are giving user way too many options under "Skills""

https://zoovu.com/blog/psychology-choice-customers-need-assistance/

IMO we should aim to:

• Merge some related items

  • E.g. "After Effects", "Premiere", "Cinematography" into "Video Recording and Production"
  • E.g. We have 7 items with ".NET" and 15 with "Azure"

• Not show items that are not very relevant to our major prospect/existing clients

  • E.g. Tax and Accounting
  • E.g. Canva

• Not show items that are too subjective:

  • E.g. Support

Note: I understand that internally the specific skills are important to have, so we would probably need to change the way these are included into the page in the back-end. Might be a big one, but I think it definitely is worth it!

--