Search refinement

[ExperimentsInHonesty]

Overview

We want the github / civic tech index search to be as useful and intuitive as possible.

Actions

• [x] gather list of what is possible to get from the github api
• [x] define what we want to use
• [ ] determine way to make search layout readable and intuitive

Resources

Best buy search Amazon LinkedIn Google cart

[ExperimentsInHonesty]

Affiliations Topics Languages Used Last Updated

[Abhishek-AC]

List of what can be retrieved from the GitHub API. This is what I could figure out from the Search repositories API response.

1. Affiliations
2. Topics
3. Languages Used
4. Last Updated
5. Created At
6. Stargazers Count
7. Watchers Count
8. Open Issues Count
9. Forks Count

I am pasting one of the objects from the response, @chalimar, @ExperimentsInHonesty requesting you to go through the fields and add something that can be useful to a search.

API:

GET https://api.github.com/search/repositories?q=topic:hack-for-la&sort=updated&order=desc

{
   "id":130000551,
   "node_id":"MDEwOlJlcG9zaXRvcnkxMzAwMDA1NTE=",
   "name":"website",
   "full_name":"hackforla/website",
   "private":false,
   "owner":{
      "login":"hackforla",
      "id":11635254,
      "node_id":"MDEyOk9yZ2FuaXphdGlvbjExNjM1MjU0",
      "avatar_url":"https://avatars3.githubusercontent.com/u/11635254?v=4",
      "gravatar_id":"",
      "url":"https://api.github.com/users/hackforla",
      "html_url":"https://github.com/hackforla",
      "followers_url":"https://api.github.com/users/hackforla/followers",
      "following_url":"https://api.github.com/users/hackforla/following{/other_user}",
      "gists_url":"https://api.github.com/users/hackforla/gists{/gist_id}",
      "starred_url":"https://api.github.com/users/hackforla/starred{/owner}{/repo}",
      "subscriptions_url":"https://api.github.com/users/hackforla/subscriptions",
      "organizations_url":"https://api.github.com/users/hackforla/orgs",
      "repos_url":"https://api.github.com/users/hackforla/repos",
      "events_url":"https://api.github.com/users/hackforla/events{/privacy}",
      "received_events_url":"https://api.github.com/users/hackforla/received_events",
      "type":"Organization",
      "site_admin":false
   },
   "html_url":"https://github.com/hackforla/website",
   "description":"Hack for LA's website",
   "fork":false,
   "url":"https://api.github.com/repos/hackforla/website",
   "forks_url":"https://api.github.com/repos/hackforla/website/forks",
   "keys_url":"https://api.github.com/repos/hackforla/website/keys{/key_id}",
   "collaborators_url":"https://api.github.com/repos/hackforla/website/collaborators{/collaborator}",
   "teams_url":"https://api.github.com/repos/hackforla/website/teams",
   "hooks_url":"https://api.github.com/repos/hackforla/website/hooks",
   "issue_events_url":"https://api.github.com/repos/hackforla/website/issues/events{/number}",
   "events_url":"https://api.github.com/repos/hackforla/website/events",
   "assignees_url":"https://api.github.com/repos/hackforla/website/assignees{/user}",
   "branches_url":"https://api.github.com/repos/hackforla/website/branches{/branch}",
   "tags_url":"https://api.github.com/repos/hackforla/website/tags",
   "blobs_url":"https://api.github.com/repos/hackforla/website/git/blobs{/sha}",
   "git_tags_url":"https://api.github.com/repos/hackforla/website/git/tags{/sha}",
   "git_refs_url":"https://api.github.com/repos/hackforla/website/git/refs{/sha}",
   "trees_url":"https://api.github.com/repos/hackforla/website/git/trees{/sha}",
   "statuses_url":"https://api.github.com/repos/hackforla/website/statuses/{sha}",
   "languages_url":"https://api.github.com/repos/hackforla/website/languages",
   "stargazers_url":"https://api.github.com/repos/hackforla/website/stargazers",
   "contributors_url":"https://api.github.com/repos/hackforla/website/contributors",
   "subscribers_url":"https://api.github.com/repos/hackforla/website/subscribers",
   "subscription_url":"https://api.github.com/repos/hackforla/website/subscription",
   "commits_url":"https://api.github.com/repos/hackforla/website/commits{/sha}",
   "git_commits_url":"https://api.github.com/repos/hackforla/website/git/commits{/sha}",
   "comments_url":"https://api.github.com/repos/hackforla/website/comments{/number}",
   "issue_comment_url":"https://api.github.com/repos/hackforla/website/issues/comments{/number}",
   "contents_url":"https://api.github.com/repos/hackforla/website/contents/{+path}",
   "compare_url":"https://api.github.com/repos/hackforla/website/compare/{base}...{head}",
   "merges_url":"https://api.github.com/repos/hackforla/website/merges",
   "archive_url":"https://api.github.com/repos/hackforla/website/{archive_format}{/ref}",
   "downloads_url":"https://api.github.com/repos/hackforla/website/downloads",
   "issues_url":"https://api.github.com/repos/hackforla/website/issues{/number}",
   "pulls_url":"https://api.github.com/repos/hackforla/website/pulls{/number}",
   "milestones_url":"https://api.github.com/repos/hackforla/website/milestones{/number}",
   "notifications_url":"https://api.github.com/repos/hackforla/website/notifications{?since,all,participating}",
   "labels_url":"https://api.github.com/repos/hackforla/website/labels{/name}",
   "releases_url":"https://api.github.com/repos/hackforla/website/releases{/id}",
   "deployments_url":"https://api.github.com/repos/hackforla/website/deployments",
   "created_at":"2018-04-18T03:47:42Z",
   "updated_at":"2020-05-09T23:27:46Z",
   "pushed_at":"2020-05-09T23:25:32Z",
   "git_url":"git://github.com/hackforla/website.git",
   "ssh_url":"git@github.com:hackforla/website.git",
   "clone_url":"https://github.com/hackforla/website.git",
   "svn_url":"https://github.com/hackforla/website",
   "homepage":"https://www.hackforla.org",
   "size":40596,
   "stargazers_count":12,
   "watchers_count":12,
   "language":"HTML",
   "has_issues":true,
   "has_projects":true,
   "has_downloads":true,
   "has_wiki":true,
   "has_pages":true,
   "forks_count":45,
   "mirror_url":null,
   "archived":false,
   "disabled":false,
   "open_issues_count":75,
   "license":null,
   "forks":45,
   "open_issues":75,
   "watchers":12,
   "default_branch":"gh-pages",
   "permissions":{
      "admin":false,
      "push":false,
      "pull":true
   },
   "score":1.0
}

[ExperimentsInHonesty]

@chali let me know when you have time to review new search attributes.

[chali]

@ExperimentsInHonesty wrong handle :-) you probably wanted @chalimar

[ExperimentsInHonesty]

@chalimar example of search refinement (i.e., filtering) on hackforla.org website future plans https://www.figma.com/file/0RRPy1Ph7HafI3qOITg0Mr/Hack-for-LA-Website?node-id=532%3A1454

[ExperimentsInHonesty]

@chalimar Add good first issue (1-5, 10-20, 20-40, 50+), open issues (1-5, 10-20, 20-40, 50+) and last updated (1 month, 3, 6, year, 2 year), as a filter and a sort.

[Abhishek-AC]

Removing myself from the assignees for this issue. Please let me know if any more insights are required.

[chalimar]

Search project results WIP:

[arunprakash87]

Blocker : Chali is Working on mobile version

[arunprakash87]

@JacobZwang : Please provide updates on this issue. 1 Progress

2. Blockers
3. Availability
4. ETA

[JacobZwang]

@arunprakash87

1. None
2. I am set to "view only" on the Figma document
3. Within 48 hours of gaining access to edit

[JacobZwang]

3. by the end of today

[JacobZwang]

[ExperimentsInHonesty]

Hi @JacobZwang Here is the revised list of requirement for the project cards in the results Organization Name : Hack for LA Affiliation: Code for All, Code for America Title of project: Civic Tech Index Repository name: website Project Description: Join a worldwide movement to catalog every open source civic tech project Programming Languages: Javascript Project languages: English Stargazer count: 4 Open issues count: 24 New issue count: 6 Good First Issue count: 0 Last Updated: June 29, 2020 Created In: United States of America Tags: civic-tech-index code-for-all code-for-all hack-for-la civic tech open-source opensource

[arunprakash87]

@JacobZwang to review and hierarchy with operations team on Tuesday. Expected update on wednesday

[JacobZwang]

collected some data, search results should be discussed because data contradicts former decisions

[JacobZwang]

[ExperimentsInHonesty]

@JacobZwang will update to have stars and watch github style and add icons to the search criteria drawers.

[JacobZwang]

updates search results to have GitHub style stars and icons as well as alternative with GitHub logo to represent GitHub rather than Github styling. Icons in the drawer are dependent on final Icon choices, therefore there is little to no advantage to displaying them in the concept. Icons can simply be added next to the text when produced. The next step is to choose the final design (or reject all designs). The search result is basically read to code, a checklist for coders along with an explanation of how items rearrange at different positions should be created for optimal results. Happy to write it once search result has been approved.

[ExperimentsInHonesty]

@chali will update search results cards and open oakland card based on current requirements and team discussion. https://github.com/civictechindex/CTI-website-frontend/issues/29#issuecomment-660705246

[chali]

It will be probably @chalimar ;-)

[ExperimentsInHonesty]

@chali - so sorry I keep at'ing you instead of @chalimar ... maybe you should just join our project 😉

[ExperimentsInHonesty]

@chalimar 's update is

consensus is watch and star on the top write, except on mobile, where it will go beneath the description

[jsachsman]

@chalimar the repository link is missing from the card, please add, thanks!

[chalimar]

Project link and repository link buttons added to card. Vertical card format still pending (mobile and org page projects).

[jsachsman]

@chalimar please remove repository button and use the name of project at top as new link to repository, change name of project at top to link color with underline. Also please modify Project Link button to include 'link' icon and URL of their link, feel free to experiment with sizing, look and feel, etc.

[chalimar]

[jsachsman]

Team approves design above, caveat that topic tags won't include affiliation tags.

[chalimar]

Vertical card design

Updated card design removing org tags per issue from 8/30/2020.

[jsachsman]

Thanks so much @chalimar, please investigate the horizontal version and see if you can get a mobile version of that.

[chali]

@ExperimentsInHonesty haha. looking at what you do my skillset would be fairly useless.

[chalimar]

[jsachsman]

@ExperimentsInHonesty @chalimar I think we should be ready to close this out, looks great!

[jsachsman]

@chalimar would be great to get some images of what the filter looks like when it comes up and what the filtered results look like, thanks!

[chalimar]

Search and filter iteration

[jsachsman]

@chalimar please switch out OakCrime Please move 'showing' text below the filter and sort buttons Please update mobile filter screen to match desktop search in terms of filters list Please add text like this to top - Displaying [number here] of results on search of [phrase] (this is a terrible phrase somebody please come up with a better one here) Please add button below the "Reset Filters" to say "Apply Filters" and that will return user to search view and display filtered results

[chalimar]

Providing an update for mobile search view. Will need to provide an option to display expanded filter attributes.

[jsachsman]

Hi @chalimar sorry this is off-topic for this issue Please add mobile and tablet views for the landing page / welcome screen to the Figma when you get a chance Then inform @mealthebear when you have done so Thanks!

[chalimar]

Sharing a screen example of more search attributes expanded and selected.

[jsachsman]

Great job on this issue, let's go ahead and close out and open a new one for new design needs, thanks!