Meeting times not showing up on Guides Project

[ExperimentsInHonesty]

Overview

We need the meeting times to show up on the Guides team project page https://www.hackforla.org/projects/guides-team so that prospective volunteers can find the meetings.

Action Items

• Review the screenshot below
• Figure out why the times are not displaying
• Document the solution, which should not be a fix just for this page, but rather a fix for all pages.
• Talk to the Dev Leads about why it's not working and get signoff for the solution
• Write in the Guides Slack channel that it's been fixed.
• apply solution

Resources/Instructions

Pages

• https://www.hackforla.org/events/
• https://www.hackforla.org/projects/guides-team

Screenshots

Screenshot of Guides team page

Events page, Monday meeting

Events page, Friday meeting

[ExperimentsInHonesty]

@roslynwythe I found this bug today. Can you figure out the size and complexity and go ahead and prioritize this issue.

[github-actions]

Hi @njackman-2344, thank you for taking up this issue! Hfla appreciates you :)

Do let fellow developers know about your:-
i. Availability: (When are you available to work on the issue/answer questions other programmers might have about your issue?)
ii. ETA: (When do you expect this issue to be completed?)

You're awesome!

P.S. - You may not take up another issue until this issue gets merged (or closed). Thanks again :)

[njackman-2344]

Availability: Friday night PST 10/27, Wednesday 5pm-10pm 11/1, Thursday 5pm-10pm 11/2, Monday 5pm-10pm 11/6

ETA: 11/10 EOD

[github-actions]

@njackman-2344

Please add update using the below template (even if you have a pull request). Afterwards, remove the 'To Update !' label and add the 'Status: Updated' label.

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures (optional): "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) place your issue in the Questions/In Review column of the Project Board and ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel. Please note that including your questions in the issue comments- along with screenshots, if applicable- will help us to help you. Here and here are examples of well-formed questions.

_{You are receiving this comment because your last comment was before Monday, November 6, 2023 at 11:05 PM PST.}

[njackman-2344]

UPDATE:
1.Progress: Current status- I haven't gotten very far due to not understanding Jekyll well / markdown and Docker desktop not working on updated Operating System. I tried to troubleshoot Docker and now learning Command Line for it. I have reviewed screenshots and analyzed "guides-team.md."

2.Blockers: I am unable to find the "languages" text temporarily popping up when it first loads. The times do not appear there at all. DOM issue? I have used the find option in browser but I am not confident I found the exact code that shows to the part.

3.Availability: Friday night 11/10, Monday night 11/13 PST, Tuesday night 11/14 PST

4.ETA: 2 weeks with help?

[njackman-2344]

UPDATE:

1. Progress: Current Status - Brought it up in COP meeting with Micah and Phillip. They helped with figuring out the "languages" text temporarily popping up and it's due to the else within the loop function within the projects.js file. We looked through the Civic Tech web browser breakpoints (Meeting times) and we're thinking the VRMS might be the answer to where the bug is.
2. Blockers: VRMS?? Jekyll is tough...
3. Availability: Friday night 11/17 4-8pm PST, Monday night 11/20 5pm -10pm PST
4. ETA: based on Dev Lead's advice
   @roslynwythe ?

[ExperimentsInHonesty]

@njackman-2344 It looks like the https://github.com/hackforla/website/blob/gh-pages/assets/js/project.js page is what injects the meeting info into the project pages from the https://github.com/hackforla/website/blob/gh-pages/_data/external/vrms_data.json data file. I recommend figuring out what js script or Jekyll, or HTML is used to display it on the https://www.hackforla.org/events/ page where it is displaying correctly.

Additionally, it looks like the .js file has a console log, that you might be able to view that would help you see the specific error that is happening.

[roslynwythe]

Hi @njackman-2344 I recommend setting breakpoints in appendMeetingTimes in assets/js/project.js and,
looking for console errors and examining the value of various objects. It might also be helpful to do the same thing on a different project page, in order to view the "correct" behavior.
Note that the meeting times for the Guides project do display correctly in the Events page. However in the script behind the Events page, the data is retrieved somewhat differently, via API call. So perhaps there is a difference in the data retrieved from VRMS via API versus _data/external/vrms_data.json. It is quite difficult to view the data in _data/external/vrms_data.json; it might be worthwhile to use "JSON Pretty Print" extension for VS Code.

[github-actions]

@njackman-2344

Please add update using the below template (even if you have a pull request). Afterwards, remove the 'To Update !' label and add the 'Status: Updated' label.

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures (optional): "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) place your issue in the Questions/In Review column of the Project Board and ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel. Please note that including your questions in the issue comments- along with screenshots, if applicable- will help us to help you. Here and here are examples of well-formed questions.

_{You are receiving this comment because your last comment was before Monday, November 27, 2023 at 11:06 PM PST.}

[njackman-2344]

Progress: Did breakpoints for projects.js under appendMeetingTimes() - meetingsFound: Array(0), length:0 && console.log: undefined
Blockers: Will see events page and double check.
Availability: Thursday 9pm-11pm PST today, Friday 10am-12pm PST tomorrow
ETA: 12/13 EOD

[github-actions]

Hi @jphamtv, thank you for taking up this issue! Hfla appreciates you :)

Do let fellow developers know about your:-
i. Availability: (When are you available to work on the issue/answer questions other programmers might have about your issue?)
ii. ETA: (When do you expect this issue to be completed?)

You're awesome!

P.S. - You may not take up another issue until this issue gets merged (or closed). Thanks again :)

[jphamtv]

Availability: Monday-Friday Evenings
Estimated ETA: 1/22/24

[ExperimentsInHonesty]

@jphamtv It looks like you assigned yourself this issue but didn't put it in the In Progress column. I am going to move it for you.

[jphamtv]

@jphamtv It looks like you assigned yourself this issue but didn't put it in the In Progress column. I am going to move it for you.

@ExperimentsInHonesty Thanks. I'll make sure to move issues I self-assign to the In Progress column in the future.

[jphamtv]

1. Progress: Figured out why meeting times are not displaying
2. Blockers: None. Will discuss the solutions with Dev Leads at the next meeting
3. Availability: Mon—Fri evenings
4. ETA: 1/22/24

[roslynwythe]

Hi @jphamtv please see this page for information on how to update the wiki:
https://github.com/hackforla/website/wiki/How-to-Contribute-to-the-Wiki

[jphamtv]

Use this to document a HfLA project.
Entries are placed in the _projects/ folder. Jekyll pulls them into the cards on the Projects section of the main page, and generates individual Project pages.

---
# 'identification' is the 9 digit ID for your repo in the GitHub API.
# To find it, go to https://api.github.com/repos/<organizations>/<repository-name>
# For example, https://api.github.com/repos/hackforla/website
identification: ''
# 'title' must match the Project name in VRMS
title:
description:
# card image should be 600px wide x 400px high
image: /assets/images/projects/[project repo name + .jpg or .png]
alt: 'description of the card image'
# hero image should be 1500px wide x 700px high
image-hero: /assets/images/projects/[project repo name + -hero + .jpg or .png]
leadership:
  - name: First Last
    role: Product Manager
    links:
      slack: 'https://hackforla.slack.com/team/xxxxxx'
      github: 'https://github.com/githubusername'
    picture: https://avatars.githubusercontent.com/githubusername
  - name: Given Surname
    role: Lead
    links:
      slack: 'https://hackforla.slack.com/team/xxxxxx'
      linkedin" 'https://linkedin.com/linkedin-username'
    picture: https://avatars.githubusercontent.com/githubusername
links: 
  - name: Github
    url: 'https://www.example.com'
  - name: Slack
    url: 'https://www.example.com'
  - name: Test Site
    url: 'https://test.example.com'
  - name: Demo Site
    url: 'https://demo.example.com'
  - name: Site
    url: 'https://live.example.com'
  - name: Overview
    url: https://github.com/hackforla/product-management/blob/master/project-one-sheets/[REPLACE WITH PROJECT NAME]-Project-One-Sheet.pdf
  # unused links can be commented out
  # - name: Showcase deck
  #   url: ''
  #   alt: ''
looking:
  - category: Development
    skill: one skill
  - category: UI/UX
    skill: another skill
  - category: Content
    skill: Researcher
technologies: 
  - Node.js 
  - ReactJS 
  - Ruby on Rails
  - other etc.
location: 
  - Downtown LA
  - Santa Monica
  - South LA
  # must choose one of the above (closest)
partner:
# Examples of tools are Figma, Photoshop, Sketch, Phone calls
tools:
# Add the necessary program area on the next line after the '-'
program-area:
  -
status:
# If the card should not be included on the site, change visible to "false"
visible: true
# If the project should not have a project homepage for any given reason, add the following line (uncommented):
# project-homepage: false
# For completed projects. Uncomment and add contact info if provided
# completed-contact:
# If the project has an iframe to link to a widget of their app, uncomment below and provide a source link (indents matter):
#iframe:
#  available: true
#  src: ""

# program area card data
# What problem this project addresses
problem: 
# How this project provides a solution to the problem
solution:
# The impact of this project 
impact: 
sdgs:
    # The Sustainable Development Goal (SDG) this project falls under (e.g. 9)
  - goal-number: 
    # The Sustainable Development Goal (SDG) target (e.g. b)
    target:
  - goal-number:
    target:
  - goal-number:
    target:
---

Data for the 'languages' and 'contributors' sections is pulled from the project's GitHub main repository using the GitHub API. In order to merge the GitHub API data into the finished card, you need to put the project's GitHub id in the 'identification field'. To find the id, go to the GitHub homepage for the project's main repository and search the page source for <meta name="octolytics-dimension-repository_id" content="#####">; the number in the 'content' field is the id you want.

If you cannot find the Github Repository ID refer to this wiki article

Sample project .md file for reference

image naming decision record

Links

On the project homepage:

• Links with the names "GitHub", "Site", "Demo Site", and "Test Site" displayed in the "Links" section in the left half of the Project Overview.
• Links named Wiki and Readme are displayed under the "Getting Started" dropdown
• All links are also displayed in the "Resources" section at the bottom of the project homepage

On the project card on HfLA homepage:

• all links are displayed

Leadership

To create a Slack link for each person, go to the project's Slack channel, find a message from that person. Click on their name; this should give you a popup window with the user's picture, name, and a link to "View full profile". Click on "View full profile". That pane gives you the options message, call, and more. Click on "more" and you should be shown "Copy member ID" followed by the actual id. This is the id you need to use in the slack url, e.g. https://app.slack.com/team/<member_id_here>

[jphamtv]

Notes:

• This issue was resolved by updating the project's name in the VRMS system from "Guides" to "Guides Team"
• I was able to edit the old Wiki after including the edited Wiki page in the comment above for the new Wiki

[roslynwythe]

Great job @jphamtv. Thank you so much for your contribution.