Merge branch 'develop'

This commit is contained in:
Sam Carlton 2020-12-11 15:19:05 -06:00
commit c308df4db5
10 changed files with 218 additions and 62 deletions

View file

@ -3,7 +3,7 @@
<div class="list-summary space-y-2">
<div>
Currently there are <strong>{{ total }} listed</strong>,
<strong>{{ total }} listed</strong>,
<span>
<span
v-for="percentage in percentages"
@ -34,13 +34,25 @@
<script>
import statuses from '~/helpers/statuses'
import getListSummaryNumbers from '~/helpers/get-list-summary-numbers.js'
export default {
props: {
appList: {
type: Array,
required: true
default: null
},
customNumbers: {
type: Object,
default: () => {
return {
total: null,
nativePercent: null,
rosettaPercent: null,
unreportedPercent: null,
unsupportedPercent: null
}
}
}
},
data: function () {
@ -53,7 +65,7 @@ export default {
},
computed: {
total () {
return this.appList.length
return (this.customNumbers.total) ? this.customNumbers.total : this.appList.length
},
percentages () {
return [
@ -62,28 +74,28 @@ export default {
bgColor: 'bg-green-500',
emoji: '✅',
percent: this.nativePercent,
verbiage: `are natively supported, `
verbiage: `Native, `
},
{
textColor: 'text-green-200',
bgColor: 'bg-green-200',
emoji: '✳️',
percent: this.rosettaPercent,
verbiage: `run via Rosetta 2, `
verbiage: `Rosetta, `
},
{
textColor: 'text-orange-500',
bgColor: 'bg-orange-500',
emoji: '🔶',
percent: this.unreportedPercent,
verbiage: `need more info, `
verbiage: `need info, `
},
{
textColor: 'text-red',
bgColor: 'bg-red',
emoji: '🚫',
percent: this.unsupportedPercent,
verbiage: `are not working. `
verbiage: `unsupported. `
},
].filter( percentage => {
const isZero = (percentage.percent === 0)
@ -104,34 +116,24 @@ export default {
created () {
// console.log('total apps ', this.total)
// Create a totals object to collect amounts
const totals = {}
const hasCustomNumbers = Object.entries(this.customNumbers).some(([key, number]) => number !== null)
// Get status slugs from statuses
Object.entries(statuses).forEach( ([_, statusSlug]) => {
totals[statusSlug] = 0
})
if (hasCustomNumbers) {
// Count uses of each status
this.appList.forEach( app => {
// console.log('app.status', app.status)
this.nativePercent = this.customNumbers.nativePercent
this.rosettaPercent = this.customNumbers.rosettaPercent
this.unreportedPercent = this.customNumbers.unreportedPercent
this.unsupportedPercent = this.customNumbers.unsupportedPercent
for (const statusKey in statuses) {
if (app.status === statuses[statusKey]) {
totals[app.status]++
break
}
}
return
}
})
const summaryNumbers = getListSummaryNumbers(this.appList)
// console.log('totals', totals)
this.nativePercent = Number((( totals['native'] / this.total ) * 100).toFixed(1))
this.rosettaPercent = Number((( totals['rosetta'] / this.total ) * 100).toFixed(1))
this.unreportedPercent = Number((( totals['unreported'] / this.total ) * 100).toFixed(1))
this.unsupportedPercent = Number((100 - (this.nativePercent + this.rosettaPercent + this.unreportedPercent)).toFixed(1))
this.nativePercent = summaryNumbers.nativePercent
this.rosettaPercent = summaryNumbers.rosettaPercent
this.unreportedPercent = summaryNumbers.unreportedPercent
this.unsupportedPercent = summaryNumbers.unsupportedPercent
// console.log('this.nativePercent', this.nativePercent)
// console.log('this.unsupportedPercent', this.unsupportedPercent)

View file

@ -1,13 +1,16 @@
<template>
<div class="search w-full">
<div class="list-summary-wrapper flex justify-center text-center text-sm my-4">
<ListSummary
:app-list="appList"
class="max-w-4xl"
/>
<slot name="before-search">
<div class="list-summary-wrapper flex justify-center text-center text-sm my-4">
</div>
<ListSummary
:app-list="appList"
class="max-w-4xl"
/>
</div>
</slot>
<div class="search-input relative">
<input
@ -75,7 +78,7 @@
>
<!-- app.endpoint: {{ app.endpoint }} -->
<a
:href="app.endpoint"
:href="getAppEndpoint(app)"
class="flex flex-col justify-center inset-x-0 hover:bg-darkest border-2 border-white border-opacity-0 hover:border-opacity-50 focus:outline-none focus:bg-gray-50 duration-300 ease-in-out rounded-lg space-y-2 -mx-5 pl-5 md:pl-20 pr-6 md:pr-64 py-6 "
style="transition-property: border;"
>
@ -168,6 +171,7 @@
import scrollIntoView from 'scroll-into-view-if-needed'
import { getAppCategory } from '~/helpers/categories.js'
import { getAppEndpoint } from '~/helpers/app-derived.js'
// import appList from '~/static/app-list.json'
// import EmailSubscribe from '~/components/email-subscribe.vue'
@ -320,6 +324,7 @@ export default {
},
methods: {
getAppCategory,
getAppEndpoint,
// Search priorities
titleStartsWith (query, app) {
const matches = app.name.toLowerCase().startsWith(query)

11
helpers/app-derived.js Normal file
View file

@ -0,0 +1,11 @@
// App Data that is derived from other app data
export function getAppEndpoint ( app ) {
// console.log('app', app)
if (app.category.slug === 'homebrew') return `/formula/${app.slug}`
if (app.category.slug === 'games') return `/game/${app.slug}`
return `/app/${app.slug}`
}

View file

@ -6,6 +6,7 @@ import axios from 'axios'
import statuses from './statuses'
import parseGithubDate from './parse-github-date'
import { getAppEndpoint } from './app-derived'
const md = new MarkdownIt()
@ -58,8 +59,10 @@ const lookForLastUpdated = function (app, commits) {
// console.log('commit', commit)
const appEndpoint = getAppEndpoint(app)
// $$ If message body contains endpoint
if (commit.messageBody.includes(app.endpoint)) {
if (commit.messageBody.includes(appEndpoint)) {
// console.log('Found', app.name ,commit.committedDate)
return commit.committedDate
}
@ -78,7 +81,7 @@ const lookForLastUpdated = function (app, commits) {
// $$$ If commits comments contains endpoint
for (const { node: comment } of commit.comments.edges) {
if (comment.body.includes(app.endpoint)) {
if (comment.body.includes(appEndpoint)) {
// console.log('Found', app.name ,commit.committedDate)
return commit.committedDate
}
@ -165,7 +168,12 @@ export default async function () {
strict: true
})
const endpoint = `/app/${appSlug}`
const endpoint = getAppEndpoint({
category: {
slug: null
},
slug: appSlug
})// `/app/${appSlug}`
let status = 'unknown'
@ -176,7 +184,11 @@ export default async function () {
}
}
const lastUpdatedRaw = lookForLastUpdated({ name, endpoint }, commits)
const category = {
slug: categorySlug
}
const lastUpdatedRaw = lookForLastUpdated({ name, slug: appSlug, endpoint, category }, commits)
const lastUpdated = (lastUpdatedRaw) ? {
raw: lastUpdatedRaw,
@ -191,10 +203,8 @@ export default async function () {
// url,
text,
slug: appSlug,
endpoint,
category: {
slug: categorySlug
},
// endpoint,
category,
// content: token.content,
relatedLinks
})

View file

@ -4,6 +4,7 @@ import slugify from 'slugify'
import axios from 'axios'
// import { statuses } from './build-app-list'
// import { getAppEndpoint } from './app-derived'
// console.log('process.env.GAMES_SOURCE', process.env.GAMES_SOURCE)
@ -129,16 +130,21 @@ export default async function () {
continue
}
const category = {
slug: 'games'
}
gameList.push({
name: game.Games,
status,
// url: `https://rawg.io/search?query=${encodeURIComponent(game.Games)}`,
text: getStatusText(game),
slug,
endpoint: `/game/${slug}`,
category: {
slug: 'games'
},
// endpoint: getAppEndpoint({
// slug,
// category
// }),//`/game/${slug}`,
category,
content: '',
// relatedLinks: [],
reports: [

View file

@ -1,7 +1,7 @@
// import { promises as fs } from 'fs'
// import MarkdownIt from 'markdown-it'
import slugify from 'slugify'
// import slugify from 'slugify'
import axios from 'axios'
// import statuses from './statuses'
@ -10,6 +10,7 @@ import axios from 'axios'
const marked = require('marked')
const HTMLParser = require(`node-html-parser`)
// import { getAppEndpoint } from './app-derived'
const statusesTranslations = {
@ -144,16 +145,21 @@ export default async function () {
// strict: true
// })
const category = {
slug: 'homebrew'
}
formulaeList.push({
name: formulae.name,
status: parseStatus(formulae),
// url: `https://formulae.brew.sh/formula/${formulae.name}`,
text: getStatusText(formulae),
slug,
endpoint: `/formula/${slug}`,
category: {
slug: 'homebrew'
},
// endpoint: getAppEndpoint({
// slug,
// category
// }),//`/formula/${slug}`,
category,
content: formulae.comments,
relatedLinks: [
{

View file

@ -0,0 +1,43 @@
import statuses from '~/helpers/statuses'
export default function ( appList ) {
const totalApps = appList.length
// Create a totals object to collect amounts
const totals = {}
// Get status slugs from statuses
Object.entries(statuses).forEach( ([_, statusSlug]) => {
totals[statusSlug] = 0
})
// Count uses of each status
appList.forEach( app => {
// console.log('app.status', app.status)
for (const statusKey in statuses) {
if (app.status === statuses[statusKey]) {
totals[app.status]++
break
}
}
})
// console.log('totals', totals)
const nativePercent = Number((( totals['native'] / totalApps ) * 100).toFixed(1))
const rosettaPercent = Number((( totals['rosetta'] / totalApps ) * 100).toFixed(1))
const unreportedPercent = Number((( totals['unreported'] / totalApps ) * 100).toFixed(1))
const unsupportedPercent = Number((100 - (nativePercent + rosettaPercent + unreportedPercent)).toFixed(1))
return {
total: totalApps,
nativePercent,
rosettaPercent,
unreportedPercent,
unsupportedPercent,
}
}

View file

@ -4,9 +4,10 @@ import homebrewList from '~/static/homebrew-list.json'
import { byTimeThenNull } from '~/helpers/sort-list.js'
export const sortedAppList = appList.sort(byTimeThenNull)
export const allList = [
...appList.sort(byTimeThenNull),
...sortedAppList,
...homebrewList,
...gameList,
]

View file

@ -7,6 +7,7 @@ import buildGamesList from './helpers/build-game-list.js'
import buildHomebrewList from './helpers/build-homebrew-list.js'
import { categories } from './helpers/categories.js'
import { getAppEndpoint } from './helpers/app-derived.js'
const listsOptions = [
@ -119,7 +120,7 @@ export default {
homebrewRoutes
] = lists.map((list, listI) => {
return list.map( app => {
return app.endpoint
return getAppEndpoint(app)
})
})

View file

@ -12,8 +12,19 @@
:app-list="allList"
:quick-buttons="quickButtons"
:initial-limit="200"
@update:query="query = $event"
/>
@update:query="onQueryUpdate"
>
<template v-slot:before-search>
<div class="list-summary-wrapper flex justify-center text-center text-sm my-4">
<ListSummary
:custom-numbers="customSummaryNumbers"
class="max-w-4xl"
/>
</div>
</template>
</Search>
<div class="flex flex-col md:flex-row space-x-0 space-y-4 md:space-y-0 md:space-x-4">
<LinkButton
@ -46,29 +57,50 @@
</template>
<script>
import axios from 'axios'
import getListSummaryNumbers from '~/helpers/get-list-summary-numbers.js'
import Search from '~/components/search.vue'
import LinkButton from '~/components/link-button.vue'
import AllUpdatesSubscribe from '~/components/all-updates-subscribe.vue'
import ListSummary from '~/components/list-summary.vue'
export default {
async asyncData () {
// const { default: appList } = await import('~/static/app-list.json')
// const { default: gamelist } = await import('~/static/game-list.json')
const { allList } = await import('~/helpers/get-list.js')
const { sortedAppList, allList } = await import('~/helpers/get-list.js')
return {
allList
// Filter app list to leave out data not needed for search
initialAppList: sortedAppList.map( app => {
return {
name: app.name,
status: app.status,
slug: app.slug,
// endpoint: app.endpoint,
text: app.text,
lastUpdated: app.lastUpdated,
category: app.category,
}
}),
customSummaryNumbers: getListSummaryNumbers(allList)
}
},
components: {
Search,
LinkButton,
AllUpdatesSubscribe
AllUpdatesSubscribe,
ListSummary
},
data: function () {
return {
query: '',
fetchedAppList: [],
quickButtons: [
{
label: '✅ Full Native Support',
@ -112,6 +144,45 @@ export default {
},
]
}
},
computed: {
allList () {
return [
...this.initialAppList,
...this.fetchedAppList
]
}
},
methods: {
async onQueryUpdate ( $event ) {
// console.log('$event', $event)
this.query = $event
// If fetched lists have already been loaded in
// OR if there's no query
// then stop
if (this.fetchedAppList.length !== 0 || this.query.trim().length === 0) return
const fetchedListUrls = [
'/game-list.json',
'/homebrew-list.json'
]
const fetchedLists = await Promise.all(fetchedListUrls.map( async listUrl => {
// Fetch List
const response = await axios.get(listUrl)
// Extract apps from response data
const fetchedApps = response.data
return fetchedApps
}))
// console.log('fetchedLists', fetchedLists)
this.fetchedAppList = fetchedLists.flat(1)
return
}
}
}
</script>