\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.
\nYou will also see any lint errors in the console.\n\n### `npm test`\n\nLaunches the test runner in the interactive watch mode.
\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### `npm run build`\n\nBuilds the app for production to the `build` folder.
\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.
\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n### `npm run eject`\n\n**Note: this is a one-way operation. Once you `eject`, you can’t go back!**\n\nIf you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.\n\nInstead, it will copy all the configuration files and the transitive dependencies (Webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.\n\nYou don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.\n\n## Learn More\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n\n### Code Splitting\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting\n\n### Analyzing the Bundle Size\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size\n\n### Making a Progressive Web App\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app\n\n### Advanced Configuration\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration\n\n### Deployment\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/deployment\n\n### `npm run build` fails to minify\n\nThis section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify\n" }, { "path": "frontend/package.json", "content": "{\n \"name\": \"frontend\",\n \"version\": \"0.1.0\",\n \"private\": true,\n \"dependencies\": {\n \"axios\": \"^0.19.0\",\n \"chart.xkcd\": \"^1.1.7\",\n \"notie\": \"^4.3.1\",\n \"query-string\": \"^6.8.3\",\n \"react\": \"^16.10.1\",\n \"react-content-loader\": \"^4.3.1\",\n \"react-dom\": \"^16.10.1\",\n \"react-github-btn\": \"^1.0.6\",\n \"react-router-dom\": \"^5.1.1\",\n \"react-scripts\": \"3.1.2\",\n \"remixicon\": \"^2.0.0\"\n },\n \"scripts\": {\n \"start\": \"react-scripts start\",\n \"build\": \"react-scripts build\",\n \"test\": \"react-scripts test\",\n \"eject\": \"react-scripts eject\",\n \"deploy\": \"npm run build && gh-pages -d build -b master\"\n },\n \"eslintConfig\": {\n \"extends\": \"react-app\"\n },\n \"browserslist\": {\n \"production\": [\n \">0.2%\",\n \"not dead\",\n \"not op_mini all\"\n ],\n \"development\": [\n \"last 1 chrome version\",\n \"last 1 firefox version\",\n \"last 1 safari version\"\n ]\n },\n \"devDependencies\": {\n \"gh-pages\": \"^2.1.1\"\n }\n}\n" }, { "path": "frontend/public/404.html", "content": "\n\n \n \n
\n ![\"logo\"](\"/logo.png\")
\n \n Repo Analytics\n
\n \n \n Repo Analytics\n \n {\n user.username ? \n
\n \n {user.username} ▼\n \n
\n :\n Sign in with GitHub\n }\n \n {/* Topics */}\n \n
\n );\n}\n\nfunction Topics({ match }) {\n return (\n About
\n\n
\n );\n}\n\nfunction Topic({ match }) {\n return (\n Topics
\n- \n
- \n Rendering with React\n \n
- \n Components\n \n
- \n Props v. State\n \n
Please select a topic.
}\n />\n\n
\n );\n}"
},
{
"path": "frontend/src/App.test.js",
"content": "import React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\n\nit('renders without crashing', () => {\n const div = document.createElement('div');\n ReactDOM.render({match.params.topicId}
\n\n
;\n}\n\nexport default AddRepo;"
},
{
"path": "frontend/src/components/CardLoader.js",
"content": "import React from \"react\"\nimport ContentLoader from \"react-content-loader\"\n\nconst MyLoader = () => (\n \n\n setRepoPath(e.target.value)}>\n \n
\n\n \n Pricing\n
\n \n
\n}\n\nexport default VisitChart;\n"
},
{
"path": "frontend/src/components/Footer.css",
"content": "footer {\n margin: 80px 0;\n border-top: 1px solid #dfe2e5;\n padding: 20px 8px;\n\n\n display: flex;\n justify-content: space-between;\n}\n\n.footer-content {\n font-size: 16px;\n color: #586069;\n}\n\n.footer-content a:hover {\n text-decoration: underline;\n}\n\n\n.footer-contacts a {\n font-size: 16px;\n color: #586069;\n padding-left: 4px;\n}\n\n.footer-contacts a:hover {\n color: #888;\n}"
},
{
"path": "frontend/src/components/Footer.js",
"content": "import React from 'react';\nimport './Footer.css'\n\nconst Footer = () => (\n \n)\n\nexport default Footer;\n"
},
{
"path": "frontend/src/components/PathChart.js",
"content": "import React from 'react';\n\nconst Paths = ({paths}) => (\n Git clones
\n\n \n
\n \n \n \n
\n
\n);\n\nexport default Paths;\n"
},
{
"path": "frontend/src/components/ProjectCard.css",
"content": ".card-container {\n margin: 15px;\n font-size: 16px;\n height: 100%;\n position: relative;\n}\n\n.path-divider {\n font-size: 16px;\n /* line-height: 26px; */\n color: #586069;\n margin: 0 3px;\n}\n\n.project-trend {\n /* TODO: for chart.xkcd: config padding; margin*/\n height: 100%;\n position: relative;\n top: -26px;\n z-index: 0;\n}\n\n.card-description a {\n font-weight: 500;\n font-size: 16px;\n position: relative;\n z-index: 1;\n}\n\n.card-description a:hover {\n text-decoration: underline;\n}\n\n.card-footer {\n position: absolute;\n bottom: 18px;\n right: 0;\n font-size: 11px;\n color: #888;\n}"
},
{
"path": "frontend/src/components/ProjectCard.js",
"content": "import React, { useRef, useEffect } from 'react';\nimport chartXkcd from 'chart.xkcd';\nimport './ProjectCard.css';\n\n\nconst ProjectCard = ({repo, createdAt, username, views}) => {\n\n const ref = useRef();\n const totalViewsData = views.map(view => ({\n x: view.timestamp,\n y: view.count,\n }));\n const uniqueViewsData = views.map(view => ({\n x: view.timestamp,\n y: view.uniques,\n }));\n \n useEffect(() => {\n if (ref.current) {\n new chartXkcd.XY(ref.current, {\n // title: 'Visitors',\n data: {\n datasets: [{\n label: 'Views',\n data: totalViewsData,\n }, {\n label: 'Unique Visitors',\n data: uniqueViewsData,\n }],\n },\n options: {\n xTickCount: 3,\n yTickCount: 4,\n legendPosition: chartXkcd.config.positionType.upLeft,\n showLine: true,\n timeFormat: 'MM/DD/YYYY',\n dotSize: 0.5,\n dataColors: ['#28a745', '#005cc5'],\n // unxkcdify: true\n },\n });\n }\n }, []);\n\n return \n};\n\nexport default ProjectCard;\n"
},
{
"path": "frontend/src/components/ReferrerChart.js",
"content": "import React from 'react';\n\nconst Referrer = ({referrers}) => {\n\n console.log('referrers', referrers)\n return (\n Popular content
\n| Content | \nViews | \nUnique visitors | \n
|---|---|---|
| {path.path} | \n{path.count} | \n{path.uniques} | \n
\n \n \n
\n
\n)};\n\nexport default Referrer;"
},
{
"path": "frontend/src/components/RepoLoader.js",
"content": "import React from 'react'\nimport ContentLoader from 'react-content-loader'\n\nconst Article = () => (\n Referring sites
\n| Site | \nViews | \nUnique visitors | \n
|---|---|---|
| {referrer.referrer} | \n{referrer.count} | \n{referrer.uniques} | \n
\n
\n );\n};\n\nexport default Nav;"
},
{
"path": "frontend/src/components/RepoSetting.css",
"content": ".traffic-switch {\n margin: 40px;\n margin-top: 40px;\n font-size: 20px;\n font-weight: 300;\n line-height: 25px;\n}\n\n\n/* The switch - the box around the slider */\n.switch {\n position: relative;\n display: inline-block;\n width: 40px;\n height: 24px;\n}\n\n/* Hide default HTML checkbox */\n.switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n\n/* The slider */\n.slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n -webkit-transition: .4s;\n transition: .4s;\n}\n\n.slider:before {\n position: absolute;\n content: \"\";\n height: 16px;\n width: 16px;\n left: 4px;\n bottom: 4px;\n background-color: white;\n -webkit-transition: .4s;\n transition: .4s;\n}\n\ninput:checked + .slider {\n background-color: #28a745;\n}\n\ninput:focus + .slider {\n box-shadow: 0 0 1px #28a745;\n}\n\ninput:checked + .slider:before {\n -webkit-transform: translateX(16px);\n -ms-transform: translateX(16px);\n transform: translateX(16px);\n}\n\n/* Rounded sliders */\n.slider.round {\n border-radius: 24px;\n}\n\n.slider.round:before {\n border-radius: 50%;\n}"
},
{
"path": "frontend/src/components/RepoSetting.js",
"content": "import React from 'react';\nimport './RepoSetting.css';\n\nconst Setting = () => (\n \n
\n \n \n {repoPath}\n \n \n \n \n
\n \n\n
\n)\n\nexport default Setting;\n"
},
{
"path": "frontend/src/components/StarAnalytics.js",
"content": "import React, { useEffect, useState } from \"react\";\nimport RepoLoader from \"./RepoLoader\";\nimport http from '../utils/http';\nimport StarHistoryChart from \"./StarHistoryChart\";\nimport StarLocationChart from \"./StarLocationChart\";\n\nconst Traffic = ({ repoPath }) => {\n const [starData, setstarData] = useState();\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setIsLoading(true);\n http.getRepoStars({\n repoPath,\n })\n .then(traffic => {\n setstarData(traffic);\n setIsLoading(false);\n })\n .catch(err => console.log(err));\n }, []);\n\n if (isLoading || !starData) {\n return \n \n Make traffic data private\n
\n \n
\n }\n\n return (Here we analyse history and location statics of your repo.
\nYou might need to wait for a minute or two and refresh the page if your repo have too many stars and it is the first time you open this page
\n\n
);\n}\n\nexport default Traffic;\n"
},
{
"path": "frontend/src/components/StarHistoryChart.js",
"content": "import React, { useState, useEffect } from 'react';\nimport chartXkcd from 'chart.xkcd';\nimport './VisitChart.css';\n\nconst StarHistoryChart = ({ repo, history, notAddingUp}) => {\n\n const [isAdding, setIsAdding] = useState(true)\n const dates = Object.keys(history);\n let counts = Object.values(history);\n if(isAdding) {\n for(let i = 1; i < counts.length; i++) {\n counts[i] = counts[i-1]+ counts[i]\n }\n }\n const data = dates.map((date, i) => ({\n x: date,\n y: counts[i],\n }));\n\n useEffect(() => {\n const svg = document.querySelector('.star-history-chart');\n new chartXkcd.XY(svg, {\n data: {\n datasets: [{\n label: repo,\n data,\n }],\n },\n options: {\n xTickCount: 3,\n yTickCount: 4,\n legendPosition: chartXkcd.config.positionType.upLeft,\n showLine: true,\n timeFormat: 'YYYY-MM-DD',\n dotSize: 0.3,\n dataColors: ['#28a745'],\n // unxkcdify: true\n },\n });\n });\n\n return \n
\n\n Updated at {starData.updatedAt.slice(0,10)}
\n\n
\n\n\n \n {\n Object.keys(starData.history).length !== 0 \n ? \n : ''\n }\n
\n \n {\n Object.keys(starData.locations).length !== 0 \n ? \n : ''\n }\n\n
\n \n
\n}\n\nexport default StarHistoryChart;\n"
},
{
"path": "frontend/src/components/StarLocationChart.js",
"content": "import React, { useEffect } from 'react';\nimport chartXkcd from 'chart.xkcd';\nimport './VisitChart.css';\n\nconst StarLocationChart = ({ locations }) => {\n\n const locationsKeys = Object.keys(locations);\n const counts = Object.values(locations);\n const totalCount = counts.reduce((pre, cur) => pre + cur);\n const topLocations = locationsKeys.sort((a, b)=> locations[b] - locations[a]).slice(0, 6);\n const topCounts = counts.sort((a, b) => b - a).slice(0, 6);\n const othersCount = totalCount - topCounts.reduce((pre, cur) => pre + cur);\n\n useEffect(() => {\n const svg = document.querySelector('.star-location-chart');\n new chartXkcd.Pie(svg, {\n data: {\n labels: [...topLocations, 'others'],\n datasets: [{\n data: [...topCounts, othersCount],\n }],\n },\n options: {\n innerRadius: 0.5,\n // unxkcdify: true\n },\n });\n }, []);\n\n return \n Star History \n \n
\n\n\n \n
\n\n
\n}\n\nexport default StarLocationChart;\n"
},
{
"path": "frontend/src/components/TrafficAnalytics.js",
"content": "import React, { useEffect, useState } from \"react\";\nimport VisitChart from './VisitChart';\nimport CloneChart from './CloneChart';\nimport RepoLoader from \"./RepoLoader\";\nimport ReferrerChart from \"./ReferrerChart\";\nimport PathChart from \"./PathChart\";\nimport http from '../utils/http';\n\nconst Traffic = ({ repoPath }) => {\n const [trafficData, setTrafficData] = useState();\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setIsLoading(true);\n http.getRepoTraffic({\n repoPath,\n })\n .then(traffic => {\n setTrafficData(traffic);\n setIsLoading(false);\n })\n .catch(err => console.log(err));\n }, []);\n\n if (isLoading || !trafficData) {\n return \n Star Locations\n
\n\n{totalCount} valid locations detected
\n\n \n
\n\n
\n }\n\n return (\n
);\n}\n\nexport default Traffic;\n"
},
{
"path": "frontend/src/components/VisitChart.css",
"content": ".chart-container {\n border: 1px solid #d1d5da;\n border-radius: 5px;\n margin-bottom: 30px;\n position: relative;\n}\n\n.svg-container {\n height: 270px;\n width: 100%;\n}\n\n\n.chart-container-header {\n display: block;\n padding: 13px 10px 14px;\n margin: 0;\n font-size: 16px;\n line-height: 17px;\n background-color: #f6f8fa;\n border-bottom: 1px solid rgba(27,31,35,.15);\n border-radius: 3px 3px 0 0;\n}\n\n.location-description {\n position: absolute;\n right: 3px;\n font-size: 12px;\n color: #888;\n}\n"
},
{
"path": "frontend/src/components/VisitChart.js",
"content": "import React, { useEffect } from 'react';\nimport chartXkcd from 'chart.xkcd';\nimport './VisitChart.css';\n\nconst VisitChart = ({ views }) => {\n const totalViewsData = views.map(view => ({\n x: view.timestamp,\n y: view.count,\n }));\n const uniqueViewsData = views.map(view => ({\n x: view.timestamp,\n y: view.uniques,\n }));\n useEffect(() => {\n const svg = document.querySelector('.visit-chart');\n new chartXkcd.XY(svg, {\n // title: 'Visitors',\n data: {\n datasets: [{\n label: 'Views',\n data: totalViewsData,\n }, {\n label: 'Unique Visitors',\n data: uniqueViewsData,\n }],\n },\n options: {\n xTickCount: 3,\n yTickCount: 4,\n legendPosition: chartXkcd.config.positionType.upLeft,\n showLine: true,\n timeFormat: 'MM/DD/YYYY',\n dotSize: 0.5,\n dataColors: ['#28a745', '#005cc5'],\n // unxkcdify: true\n },\n });\n }, []);\n\n return \n
\n\n Updated at {trafficData.date}
\nRecording analytics since {trafficData.repoCreatedAt.slice(0, 10)}
\n\n
\n\n\n \n \n
\n \n \n
\n \n
\n \n \n
\n \n \n
\n \n
\n}\n\nexport default VisitChart;\n"
},
{
"path": "frontend/src/index.css",
"content": "body {\n margin: 0;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\",\n \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\",\n sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n font-family: source-code-pro, Menlo, Monaco, Consolas, \"Courier New\",\n monospace;\n}\n"
},
{
"path": "frontend/src/index.js",
"content": "import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport * as serviceWorker from './serviceWorker';\nimport 'remixicon/fonts/remixicon.css'\n\nReactDOM.render(Visitors
\n\n \n
\n\n
\n );\n}\n\nexport default Home;"
},
{
"path": "frontend/src/pages/Repo.css",
"content": ".repo-container {\n margin: 0 auto;\n max-width: 900px;\n padding: 0 8px;\n}\n\n.repo-header {\n width: 100vw;\n background-color: #fafbfc;\n border-bottom: 1px solid #e1e4e8;\n position: relative;\n}\n\n.repo-title {\n padding-top: 10px;\n padding-bottom: 50px;\n font-size: 22px;\n}\n\n.repo-title a:hover {\n text-decoration: underline;\n}\n\n.repo-nav {\n position: absolute;\n bottom: -1px;\n}\n\n.repo-nav a {\n color: #24292e;\n float: left;\n padding: 7px 15px 8px;\n color: #586069;\n white-space: nowrap;\n border-radius: 3px 3px 0 0;\n border-left: 1px solid transparent;\n border-right: 1px solid transparent;\n border-top: 3px solid transparent;\n border-bottom: 1px solid transparent;\n cursor: pointer;\n}\n\n.repo-nav .selected {\n background-color: #fff;\n border-left: 1px solid rgb(225, 228, 232);\n border-right: 1px solid rgb(225, 228, 232);\n border-top: 3px solid #e36209;\n border-bottom: 1px solid white;\n}\n\n.dates-container {\n display: flex;\n justify-content: flex-end;\n flex-direction: column;\n align-items: flex-end;\n padding: 15px 0;\n font-weight: 400;\n font-size: 12px;\n color: #888\n}\n\n.dates-container p {\n margin: 0;\n padding: 2px 0;\n}\n\n.repo-ref-paths-container {\n display: flex;\n justify-content: space-around;\n flex-wrap: wrap;\n}\n\n.one-ref-path {\n width: 300px;\n max-width: 430px;\n flex-grow: 100;\n flex-shrink: 0;\n flex-basis: 1;\n background-color: #fff;\n margin-bottom: 10px;\n}\n\ntable {\n width: 100%;\n color: rgb(88, 96, 105);\n border-collapse: collapse;\n font-size: 14px;\n}\n\nthead {\n background-color: rgb(246, 248, 250);\n}\n\ntr:nth-child(even){background-color: rgba(246, 248, 250, 0.4);}\n\ntd, th {\n padding: 8px;\n text-align: left;\n}\n\ntd {\n word-break: break-word;\n}\n\ntr {\n border-bottom: 1px solid #ddd;\n}\n\ntd a:hover {\n text-decoration: underline;\n}"
},
{
"path": "frontend/src/pages/Repo.js",
"content": "import TrafficAnalytics from '../components/TrafficAnalytics'; \nimport StarAnalytics from '../components/StarAnalytics'; \nimport RepoSetting from '../components/RepoSetting'; \nimport RepoNav from '../components/RepoNav'; \n\nimport './Repo.css';\nimport React from \"react\";\nimport Footer from '../components/Footer';\n\nimport {\n BrowserRouter as Router,\n Switch,\n Route,\n Link,\n useRouteMatch,\n useParams,\n useLocation,\n} from \"react-router-dom\";\n\nfunction Repo () {\n const match = useRouteMatch();\n const location = useLocation();\n const username = match.params.username;\n const repo = match.params.repo;\n const repoPath = `${username}/${repo}`\n\n return (\n \n
\n
\n {\n !user.username ?\n Sign in with GitHub\n : ''\n }\n
\n\n \n Star \n
\n \n Thorough analytics for your GitHub repos\n
\n\n
\n \n
\n Better traffic data
\n\n Track traffic to GitHub Repos for longer than 14 days.\n
\n\n
\n Understand your users
\n\n Analyze history, locations of Star, Watch... data of your GitHub Repos\n
\n\n
\n What do you care?
\n\n Suggest new features for Repo Analytics on \n \n GitHub\n
\n\n
\n {\n !user.username ?\n Sign in with GitHub\n : ''\n }\n
\n
\n Example repos using Repo Analytics
\n { isLoading ?\n {\n repos.map(repo =>
\n\n \n \n \n
)\n }\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n\n
\n );\n}\n\nexport default Repo;"
},
{
"path": "frontend/src/pages/User.css",
"content": ".user-title {\n margin-left: 8px;\n margin-top: 30px;\n margin-bottom: 30px;\n font-size: 25px;\n}\n\n.user-link {\n font-weight: 500;\n}\n\n.user-github-link {\n font-size: 20px;\n font-weight: 500;\n margin: 3px;\n}\n"
},
{
"path": "frontend/src/pages/User.js",
"content": "import React, { useEffect, useState } from \"react\";\nimport http from '../utils/http';\nimport ProjectCard from '../components/ProjectCard';\nimport './User.css';\nimport userSignedIn from '../utils/userSignedIn';\nimport CardLoader from '../components/CardLoader';\nimport AddRepo from '../components/AddRepo';\nimport Footer from '../components/Footer';\n\nfunction User ({ match }) {\n const username = match.params.username;\n const userLocal = userSignedIn.get();\n const [repos, setRepos] = useState([]);\n const [isLoading, setIsLoading] = useState(false);\n\n useEffect(() => {\n setIsLoading(true);\n http.getUserRepos(username)\n .then(repos => {\n setRepos(repos);\n setIsLoading(false);\n });\n }, []);\n\n return (\n \n \n
\n \n
\n );\n}\n\nexport default User;"
},
{
"path": "frontend/src/serviceWorker.js",
"content": "// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.1/8 is considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl)\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister();\n });\n }\n}\n"
},
{
"path": "frontend/src/utils/http.js",
"content": "import axios from 'axios';\n\nconst userRaw = window.localStorage.getItem('user');\n\nlet token;\nif (userRaw) {\n const user = JSON.parse(userRaw);\n token = user.token;\n}\n\nconst http = axios.create({\n baseURL: 'https://repo-analytics.t9t.io/',\n // baseURL: 'http://localhost:8080/',\n timeout: 20000,\n headers: {\n token,\n },\n});\n \nconst getUserRepos = async (username) => {\n const res = await http.get(`/user/${username}`);\n return res.data.repos;\n}\n\n/**\n * \n * @param {String} repoPath \n * @param {String} startDate \n * @param {String} endDate \n */\nconst getRepoTraffic = async ({repoPath}) => {\n const res = await http.get(`/repo/${repoPath}`);\n return res.data.traffic;\n}\n\nconst getRepoStars = async ({repoPath}) => {\n const res = await http.get(`/repo/${repoPath}/stars`);\n return res.data;\n}\n\nconst addRepo = async ({username, repoPath, token}) => {\n const res = await http.post('/repo/add', {\n username, repoPath, token,\n });\n return res.data;\n}\n\nexport default {\n getUserRepos,\n getRepoTraffic,\n getRepoStars,\n addRepo,\n};\n\n\n// test\n// getRepoStars({repoPath: 'timqian/star-history'})"
},
{
"path": "frontend/src/utils/trafficDateRangeToArray.js",
"content": "/**\n * @param startDate\n * @param endDate\n * @returns array of required traffic dates\n * @example\n * const dateArr = trafficDateRangeToArray('2019-10-01', '2019-10-20')\n */"
},
{
"path": "frontend/src/utils/userSignedIn.js",
"content": "/**\n * user: {\n * username: 'timqian',\n * token: '',\n * photo: '',\n * }\n */\n\nfunction set({ username, token, photo }) {\n window.localStorage.setItem('user', JSON.stringify({\n username, token, photo\n }))\n}\n\nfunction get() {\n let user = {};\n const userRaw = window.localStorage.getItem('user');\n if (userRaw) {\n try {\n user = JSON.parse(userRaw);\n } catch (err) {}\n }\n return user;\n}\n\nfunction remove() {\n window.localStorage.removeItem('user');\n}\n\nmodule.exports = {\n set,\n get,\n remove,\n};"
}
]\n Repos of \n \n {username}\n \n \n \n \n
\n { isLoading ?\n {\n repos.map(repo =>
\n\n \n \n \n
)\n }\n\n {\n userLocal.username === username ?\n