Skip to content

Commit

Permalink
css fixes + path fixes + repo link fix
Browse files Browse the repository at this point in the history
  • Loading branch information
rohitmalhotra1420 committed Nov 11, 2024
1 parent 78cf16d commit 471f134
Show file tree
Hide file tree
Showing 9 changed files with 86 additions and 40 deletions.
16 changes: 13 additions & 3 deletions .github/workflows/nextjs.yml
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ name: Deploy Next.js site to Pages
on:
# Runs on pushes targeting the default branch
push:
branches: ["main"]
branches: ['main']

# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:
Expand All @@ -21,7 +21,7 @@ permissions:
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
group: 'pages'
cancel-in-progress: false

jobs:
Expand Down Expand Up @@ -51,7 +51,7 @@ jobs:
- name: Setup Node
uses: actions/setup-node@v3
with:
node-version: "20"
node-version: '20'
cache: ${{ steps.detect-package-manager.outputs.manager }}
- name: Setup Pages
uses: actions/configure-pages@v3
Expand All @@ -71,6 +71,16 @@ jobs:
# If source files changed but packages didn't, rebuild from a prior cache.
restore-keys: |
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
# Conditionally set NEXT_PUBLIC_BASE_PATH based on the repository
- name: Set base path for GitHub Pages
run: |
if [ "${{ github.repository }}" == "push-protocol/push-scan" ]; then
echo "NEXT_PUBLIC_BASE_PATH=/push-scan" >> $GITHUB_ENV
else
echo "NEXT_PUBLIC_BASE_PATH=" >> $GITHUB_ENV
fi
- name: Install dependencies
run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
- name: Build with Next.js
Expand Down
20 changes: 12 additions & 8 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ Push Analytics and Push Scan </h1>
<p>Push Analytics Dashboard is a comprehensive tool designed to provide in-depth insights into the performance and usage of the Push Protocol. This repository hosts the code that powers the analytics component of the Push Protocol, offering a detailed view of various metrics such as the number of subscribers, notifications, channels, and more. The dashboard is an essential tool for understanding the reach and impact of the Push Protocol, providing valuable data that can help guide future development and improvements.

The dashboard is designed with a user-friendly interface, making it easy to navigate and understand the data presented. It provides real-time updates, ensuring you have the most accurate and up-to-date information at your fingertips. Whether you're a developer looking to monitor the performance of your channels, or a user interested in understanding more about your subscriptions, the Push Analytics Dashboard is a powerful resource for all things related to the Push Protocol.</p>

<h3> <a href="https://push.network/">Visit: Push.network 🕸️</a> </h3>
<br />
<p align="center">
Expand All @@ -40,37 +41,40 @@ The dashboard is designed with a user-friendly interface, making it easy to navi
---

## 📚 Table of Contents

- [Screenshots](#screenshots)
- [Getting Started](#getting-started)
- [Contributing](#contributing)

---

## Screenshots
## Screenshots

<h3>June 2023</h3>

![image](https://github.com/firascodes/push-analytics-dashboard/assets/72166289/f1e7ae48-f400-41e4-b256-50a9c29a02ef)
![image](https://github.com/firascodes/push-analytics-dashboard/assets/72166289/e1e02a38-6c6a-43f9-ab9f-f7ac589cfe6e)


---

## Getting Started

### 🖥 Installation

1. Clone the push-analytics-dashboard repository:

```sh
git clone https://github.com/ethereum-push-notification-service/push-analytics-dashboard
git clone https://github.com/push-protocol/push-analytics-dashboard
```

2. Change to the project directory:

```sh
cd push-analytics-dashboard
```

3. Install the dependencies:

```sh
npm install
```
Expand All @@ -82,25 +86,25 @@ npm run dev && node dist/main.js
```

### 🧪 Running Tests

```sh
npm test
```

## Contributing

Push Protocol is an open source Project. We firmly believe in a completely transparent development process and value any contributions. We would love to have you as a member of the community, whether you are assisting us in bug fixes, suggesting new features, enhancing our documentation, or simply spreading the word.
Push Protocol is an open source Project. We firmly believe in a completely transparent development process and value any contributions. We would love to have you as a member of the community, whether you are assisting us in bug fixes, suggesting new features, enhancing our documentation, or simply spreading the word.

- Bug Report: Please create a bug report if you encounter any errors or problems while utilising the Push Protocol.
- Feature Request: Please submit a feature request if you have an idea or discover a capability that would make development simpler and more reliable.
- Documentation Request: If you're reading the Push documentation and believe that we're missing something, please create a docs request.


Read how you can contribute <a href="https://github.com/ethereum-push-notification-service/push-analytics-dashboard/blob/main/contributing.md">HERE</a>
Read how you can contribute <a href="https://github.com/push-protocol/push-analytics-dashboard/blob/main/contributing.md">HERE</a>

Not sure where to start? Join our discord and we will help you get started!


<a href="https://discord.gg/pushprotocol" title="Join Our Community"><img src="https://www.freepnglogos.com/uploads/discord-logo-png/playerunknown-battlegrounds-bgparty-15.png" width="200" alt="Discord" /></a>

## License
Check out our License <a href='https://github.com/ethereum-push-notification-service/push-analytics-dashboard/blob/main/license-v1.md'>HERE </a>

Check out our License <a href='https://github.com/push-protocol/push-analytics-dashboard/blob/main/license-v1.md'>HERE </a>
2 changes: 0 additions & 2 deletions charts/DoughnutChart/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -124,8 +124,6 @@ const DoughnutChart = ({ data, title, label, value, colorSet }: any) => {
>
<Card
sx={{
minHeight: '100%',
minWidth: '100%',
backgroundColor: isMobile ? 'transparent' : theme.background.card,
border: `1px solid ${theme.background.border}`,
borderRadius: '28px',
Expand Down
1 change: 1 addition & 0 deletions components/Dashboard/Filters.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -326,6 +326,7 @@ const Searchbar = styled.input`

const FirstFilterContainer = styled(ItemHV2)`
justify-content:flex-start;
margin-top:24px;
@media(max-width:480px){
width: 100%;
justify-content: space-between;
Expand Down
3 changes: 3 additions & 0 deletions components/Dashboard/LineChartSet/linchartset.styled.ts
Original file line number Diff line number Diff line change
Expand Up @@ -82,11 +82,14 @@ export const TimeFilterContainer = styled.div`
padding: 5px;
align-items: center;
justify-content: space-between;
margin-top: 24px;
@media (max-width: 480px) {
width: 100%;
margin-top: 0px;
}
@media (max-width: 768px) {
width: 100%;
margin-top: 0px;
}
`;

Expand Down
4 changes: 2 additions & 2 deletions components/Footer/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ export default function Footer() {
width="calc(100% - (var(--spacing-sm) * 2))"
css={css`
flex: initial;
margin: 0 auto;
margin: 0 auto;
`}
>
<Box display="flex" flexDirection="row" gap="spacing-sm">
Expand All @@ -55,7 +55,7 @@ export default function Footer() {
<Twitter color="icon-primary" size={18} />
</Link>
<Link
href="https://github.com/ethereum-push-notification-service/"
href="https://github.com/push-protocol/"
target={'_blank'}
rel={'noreferrer'}
>
Expand Down
60 changes: 42 additions & 18 deletions contributing.md
Original file line number Diff line number Diff line change
@@ -1,40 +1,48 @@
# Contributing

## Repo Setup

```
git clone https://github.com/ethereum-push-notification-service/push-analytics-dashboard
git clone https://github.com/push-protocol/push-analytics-dashboard
cd push-analytics-dashboard
```

```
yarn install
```
***Note*** -

**_Note_** -
We are using `yarn` and **strongly** advise to use yarn 1.x to avoid any NPM issues.

## Running the Demo React App

We have a `demoreact` playground to test the individual packages being built out. To run the `demoreact` app

### By GUI (preferred)

1. click on the `NX console` extension icon in the VSCode sidebar.
2. click on the `build` target execute icon under `demoreact`
3. click on the `serve` target execute icon under `demoreact`
4. wait for the localhost to be ready in the terminal & then hit `http://localhost:4200/` on your browser to run the app.

### By CLI

1. run `yarn nx build demoreact`
2. run `yarn nx run demoreact:build:production`

## Pull Requests process

- All changes should be requested through PRs from a feature/bug branch to `main` branch.
- We are using
- [conventional-commits](https://www.conventionalcommits.org/en/v1.0.0/#summary): to follow [semver](https://semver.org/#summary) for npm package versioning
- [commitizen](https://github.com/commitizen/cz-cli) to restrict commits to follow conventional commits
- [husky](https://typicode.github.io/husky/#/) to run pre-commit checks
- We are using
- [conventional-commits](https://www.conventionalcommits.org/en/v1.0.0/#summary): to follow [semver](https://semver.org/#summary) for npm package versioning
- [commitizen](https://github.com/commitizen/cz-cli) to restrict commits to follow conventional commits
- [husky](https://typicode.github.io/husky/#/) to run pre-commit checks

So, use `yarn cz` to commit changes after `git add` (recommended) or hand crafted git commit messages to follow conventional commit. Otherwise the CLI will prevent you from committing code.

- Before starting on any dev on the repo,
- Before starting on any dev on the repo,

```bash
# pull latest from main
git pull origin main
Expand All @@ -45,14 +53,16 @@ git checkout -b <your-branch-name>
```

### How to add commits which will decide versioning when deploying

When you are ready to commit your changes.

Run

```
git add -A
```

then
then

```
yarn cz
Expand All @@ -65,41 +75,55 @@ this will pop up the below CLI
Read through the [conventional-commits](https://www.conventionalcommits.org/en/v1.0.0/#summary) and [semver](https://semver.org/#summary) to get a better understanding for selecting which option.

### General guideline
* for bug fixes use `fix`
* for backward compatible new features use `feat`

## NX
- for bug fixes use `fix`
- for backward compatible new features use `feat`

## NX

We are using [NX](https://nx.dev/getting-started/intro) and some NX plugins for monorepo management, verison & publish.

### NX console

The repo comes in with a baked in NX console and some other VSCode extensions to -
* help simplify processes like build, lint, test, run demo apps
* run scripts on affected parts of the codebase

***Note*** -
- help simplify processes like build, lint, test, run demo apps
- run scripts on affected parts of the codebase

**_Note_** -
<span style="color:red">Don't run CI-prefixed targets in the NX console in local, they are only for CI.</span>.

## Adding new packages
## Adding new packages

The NX monorepo uses `project.json` & `package.json` to manage the monorepo workspace and also ultimately build out the bundle that will be published to NPM registry.

### - adding `dependencies` to a package
at root, simply run

at root, simply run

```
yarn add "[email protected]"
```

And then simply import that dependency in your package. NX while running `build` for that package will take care of making it a `dependency` in the final bundle.

### - adding `devDependencies` to a package
at root, simply run

at root, simply run

```
yarn add -D "[email protected]"
```

And then simply import that dependency in your package. NX while running `build` for that package will take care of making it a `devDependency` in the final bundle.

### - adding `peerDependencies` to a package
at root, simply run

at root, simply run

```
yarn add "[email protected]"
```

And then simply import that dependency in your package. In the `package.json` of the package where you want to consume it, simply declare the dependency as `peerDependency`
NX while running `build` for that package will take care of making it a `peerDependency` in the final bundle.
6 changes: 5 additions & 1 deletion next.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,11 @@ const nextConfig = {
swcMinify: true,
devIndicators: {
buildActivity: false,
}
},
// Access the NEXT_PUBLIC_BASE_PATH environment variable
basePath: process.env.NEXT_PUBLIC_BASE_PATH || '', // Default to empty if not defined
// You can also use assetPrefix to set the base path for static assets
assetPrefix: process.env.NEXT_PUBLIC_BASE_PATH || '',
};

module.exports = nextConfig;
14 changes: 8 additions & 6 deletions theme/globalStyles.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,28 +2,30 @@
import { createGlobalStyle } from 'styled-components';
import { getBlocksCSSVariables } from '../blocks';

const basePath = process.env.NEXT_PUBLIC_BASE_PATH || '';

export const GlobalStyles = createGlobalStyle`
@font-face {
font-family: 'FK Grotesk Neu';
src: url('../static/fonts/FKGroteskNeue-Regular.woff2') format('woff2'),
url('../static/fonts/FKGroteskNeue-Regular.woff') format('woff');
src: url('${basePath}/static/fonts/FKGroteskNeue-Regular.woff2') format('woff2'),
url('${basePath}/static/fonts/FKGroteskNeue-Regular.woff') format('woff');
font-weight: 100 400;
font-style: normal;
}
@font-face {
font-family: 'FK Grotesk Neu';
src: url('../static/fonts/FKGroteskNeue-Medium.woff2') format('woff2'),
url('../static/fonts/FKGroteskNeu-Medium.woff') format('woff');
src: url('${basePath}/static/fonts/FKGroteskNeue-Medium.woff2') format('woff2'),
url('${basePath}/static/fonts/FKGroteskNeu-Medium.woff') format('woff');
font-weight: 500 600;
font-style: normal;
}
@font-face {
font-family: 'FK Grotesk Neu';
src: url('../static/fonts/FKGroteskNeue-Bold.woff2') format('woff2'),
url('../static/fonts/FKGroteskNeue-Bold.woff') format('woff');
src: url('${basePath}/static/fonts/FKGroteskNeue-Bold.woff2') format('woff2'),
url('${basePath}/static/fonts/FKGroteskNeue-Bold.woff') format('woff');
font-weight: 700 800;
font-style: normal;
font-display: swap;
Expand Down

0 comments on commit 471f134

Please sign in to comment.