├── .babelrc ├── .editorconfig ├── .env.example ├── .eslintignore ├── .eslintrc ├── .firebase └── hosting.YnVpbGQ.cache ├── .firebaserc ├── .github ├── ISSUE_TEMPLATE │ ├── bug_report.md │ └── feature_request.md ├── PULL_REQUEST_TEMPLATE.md ├── dependabot.yml └── workflows │ ├── firebase-hosting-merge.yml │ ├── firebase-hosting-pull-request.yml │ └── node.js.yml ├── .gitignore ├── .nvmrc ├── .prettierignore ├── .prettierrc ├── CODE_OF_CONDUCT.md ├── LICENSE.txt ├── README.md ├── design ├── Add event.png ├── Add speaker.png ├── Dasboard.png ├── Events.png ├── Individual event.png ├── Landing Page-part-1.png ├── Landing Page-part-3.png ├── Profile Overview.png ├── Profile Page Content.png └── README.md ├── firebase.json ├── jsconfig.json ├── package-lock.json ├── package.json ├── public ├── _redirects ├── badges │ ├── bronze-badge.png │ ├── gold-batch.png │ └── silver-badge.png ├── favicon.ico ├── index.html ├── manifest.json └── static │ ├── event │ └── eventBanner.png │ ├── home │ ├── Footer.svg │ ├── avatars │ │ ├── Anuj_garg.jpg │ │ ├── Gaurav_Beriwal.jpg │ │ └── kunal_kush.jpg │ ├── blob.svg │ ├── codeforcause.png │ ├── codeforcause.svg │ ├── illus-1.svg │ ├── olivier.png │ ├── serviceGirl.png │ └── shapes.svg │ ├── images │ ├── avatar-1.png │ ├── avatar-2.png │ ├── avatar-3.png │ ├── bmevents.png │ ├── event_img.jpg │ ├── event_img.svg │ ├── gallery.svg │ ├── google-logo.png │ ├── icons │ │ ├── blog_plus.svg │ │ ├── calendar.png │ │ ├── cross.svg │ │ ├── event.svg │ │ ├── event_calendar.svg │ │ ├── event_calendar_w.svg │ │ ├── fork_button.svg │ │ ├── ok1.svg │ │ ├── ok2.svg │ │ ├── ok3.svg │ │ ├── os1.svg │ │ ├── os2.svg │ │ ├── os3.svg │ │ ├── play1.svg │ │ ├── play2.svg │ │ ├── play_rec.png │ │ ├── prof_event.png │ │ ├── prof_pub.png │ │ ├── publication.svg │ │ ├── rating_star_red.svg │ │ ├── rating_star_white.svg │ │ ├── star_blue.svg │ │ ├── star_button.svg │ │ ├── star_orange.svg │ │ └── star_yellow.svg │ └── login-illustration.svg │ ├── logo.jpg │ ├── logo.png │ ├── logo.svg │ ├── logo │ ├── causefolio.svg │ ├── logo.png │ └── logo.svg │ └── profile │ └── icons │ ├── Vector-1.png │ ├── Vector-2.png │ ├── Vector-3.png │ ├── Vector.png │ └── icons.png └── src ├── App.js ├── Routes.js ├── actions └── accountActions.js ├── assets └── css │ ├── loader.css │ └── prism.css ├── components ├── Badge.js ├── BookmarkedEvents.js ├── Calendar.js ├── CommitChart.js ├── CreateNewEvent.js ├── GoogleAnalytics.js ├── Loader.js ├── LoadingScreen.js ├── Login.js ├── Logo.js ├── Logo1.js ├── NewEvents.js ├── Page.js ├── Profile.js ├── ProfileEvents.js ├── ProfileInfo.js ├── ProfilePublications.js ├── ProjectsCarousel.js ├── PublicProfile.js ├── Publications.js ├── ScrollReset.js ├── Stats.js ├── UserEventStats.js ├── UserNewEvents.js ├── UserUpcomingEvents.js ├── auth │ ├── Auth.js │ ├── AuthGuard.js │ └── AuthRoute.js ├── dashboard.js └── search.js ├── config └── index.js ├── constants └── index.js ├── context └── SettingsContext.js ├── data ├── CourseFeatures.js ├── HomeViewData │ └── HomeViewData.js ├── Members.js ├── colleges.json └── recommendations.js ├── hooks ├── useIsMountedRef.js └── useSettings.js ├── index.js ├── layouts ├── DocsLayout │ ├── TopBar.js │ ├── index.js │ └── mdx │ │ ├── Blockquote.js │ │ ├── Code.js │ │ ├── Heading.js │ │ ├── InlineCode.js │ │ ├── List.js │ │ ├── ListItem.js │ │ ├── Paragraph.js │ │ └── index.js ├── DrawerLayout │ └── index.js └── MainLayout │ ├── TopBar │ ├── Account.js │ ├── HeaderItems.js │ ├── Item.js │ └── index.js │ └── index.js ├── mixins ├── chartjs.js └── prismjs.js ├── reducers ├── accountReducer.js └── index.js ├── serviceWorker.js ├── services └── authService.js ├── store └── index.js ├── theme ├── index.js ├── shadows.js └── typography.js ├── utils ├── analytics.js ├── axios.js ├── bytesToSize.js ├── getInitials.js ├── mock.js ├── objFromArray.js ├── settings.js └── wait.js └── views └── pages ├── Error404View.js ├── HomeView ├── Hero.js ├── LandingPage.js └── index.js ├── common ├── Apply.js └── Footer.js ├── events ├── eventdefault.js └── individualEvent.js ├── login └── index.js ├── register └── Register.js └── settings └── Settings.js /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "babel-preset-react-app" 4 | ] 5 | } -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*.js] 4 | end_of_line = lf 5 | insert_final_newline = true 6 | charset = utf-8 7 | 8 | [*.js] 9 | indent_style = space 10 | indent_size = 2 11 | 12 | [Makefile] 13 | indent_style = tab -------------------------------------------------------------------------------- /.env.example: -------------------------------------------------------------------------------- 1 | REACT_APP_GA_MEASUREMENT_ID= -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/.eslintignore -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "es2021": true 5 | }, 6 | "extends": [ 7 | "eslint:recommended", 8 | "plugin:react/recommended", 9 | "plugin:prettier/recommended" 10 | ], 11 | "parserOptions": { 12 | "ecmaFeatures": { 13 | "jsx": true 14 | }, 15 | "ecmaVersion": 12, 16 | "sourceType": "module" 17 | }, 18 | "plugins": ["react"], 19 | "rules": { 20 | "prettier/prettier": [ 21 | "warn", 22 | { 23 | "endOfLine": "auto" 24 | }, 25 | { 26 | "usePrettierrc": true 27 | } 28 | ], 29 | "react/jsx-key": "warn", 30 | "react/display-name": "warn", 31 | "react/prop-types": 0, 32 | "react/react-in-jsx-scope": 0 33 | }, 34 | "settings": { 35 | "react": { 36 | "version": "detect" 37 | } 38 | } 39 | } -------------------------------------------------------------------------------- /.firebaserc: -------------------------------------------------------------------------------- 1 | { 2 | "projects": { 3 | "default": "code-for-cause-leaders" 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: 'Bug: Add_your_title_here' 5 | labels: '' 6 | assignees: '' 7 | --- 8 | 9 | 10 | 11 | ## Expected Behavior 12 | 13 | Describe the expected behavior of the issue. 14 | 15 | ## Actual Behavior 16 | 17 | A clear description of what the actual behavior is. 18 | 19 | ## Steps to Reproduce the Problem 20 | 21 | 1. 22 | 2. 23 | 3. 24 | 25 | ## Specifications 26 | 27 | Describe any relevant information related to issue 28 | 29 | - OS: Windows / Linux / MacOS 30 | - Browser: Chrome / Firefox / Safari 31 | 32 | **Screenshots** 33 | If applicable, add screenshots to help explain your problem. 34 | 35 | **Additional context** 36 | Add any other context about the problem here. 37 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: 'Feat: Add_your_title_here' 5 | labels: '' 6 | assignees: '' 7 | --- 8 | 9 | 10 | 11 | **What is your feature request related to ?** 12 | 13 | - [x] Front-end 14 | - [ ] Back-end 15 | - [ ] Other (please specify i.e. Design, Testing etc) 16 | 17 | **What is your feature request ? Describe** 18 | A description of the feature. 19 | 20 | **Describe the solution you'd like** 21 | A description of the solution you would suggest if any. 22 | 23 | **Additional context** 24 | Add any other context or screenshots about the feature request here. 25 | -------------------------------------------------------------------------------- /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ### Description 2 | 3 | 4 | 5 | ### Related Issue 6 | 7 | 8 | 9 | Fixes # [ISSUE] 10 | 11 | ### Type of Change: 12 | 13 | 14 | 15 | - Code 16 | - User Interface 17 | - New Feature 18 | - Documentation 19 | - Testing 20 | 21 | **Code/Quality Assurance Only** 22 | 23 | - Bug fix (non-breaking change which fixes an issue) 24 | - This change requires a documentation update (software upgrade on readme file) 25 | 26 | ### How Has This Been Tested? 27 | 28 | 29 | 30 | ### Checklist: 31 | 32 | 33 | 34 | - [ ] Pull request is made against `development` branch. 35 | - [ ] My code follows the style guidelines of this project. 36 | - [ ] I run `npm run format` before creating the pull request. 37 | - [ ] I have performed a self-review of my own code. 38 | - [ ] I have commented my code, particularly in hard-to-understand areas. 39 | - [ ] I have updated documentation accordingly. 40 | - [ ] My changes generate no new warnings 41 | - [ ] I have added tests to cover my changes 42 | - [ ] All new and existing tests passed 43 | 44 | - [ ] My UI is responsive 45 | - [ ] UI made replicates the design provided 46 | 47 | ### Screenshots (if appropriate): 48 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | # To get started with Dependabot version updates, you'll need to specify which 2 | # package ecosystems to update and where the package manifests are located. 3 | # Please see the documentation for all configuration options: 4 | # https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates 5 | 6 | version: 2 7 | updates: 8 | - package-ecosystem: "npm" # See documentation for possible values 9 | directory: "/" # Location of package manifests 10 | schedule: 11 | interval: "weekly" 12 | -------------------------------------------------------------------------------- /.github/workflows/firebase-hosting-merge.yml: -------------------------------------------------------------------------------- 1 | # This file was auto-generated by the Firebase CLI 2 | # https://github.com/firebase/firebase-tools 3 | 4 | name: Deploy to Firebase Hosting on merge 5 | 'on': 6 | push: 7 | branches: 8 | - development 9 | jobs: 10 | build_and_deploy: 11 | runs-on: ubuntu-latest 12 | steps: 13 | - uses: actions/checkout@v2 14 | - run: npm ci && npm run build 15 | - uses: FirebaseExtended/action-hosting-deploy@v0 16 | with: 17 | repoToken: '${{ secrets.GITHUB_TOKEN }}' 18 | firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_CODE_FOR_CAUSE_LEADERS }}' 19 | channelId: live 20 | projectId: code-for-cause-leaders 21 | -------------------------------------------------------------------------------- /.github/workflows/firebase-hosting-pull-request.yml: -------------------------------------------------------------------------------- 1 | # This file was auto-generated by the Firebase CLI 2 | # https://github.com/firebase/firebase-tools 3 | 4 | name: Deploy to Firebase Hosting on PR 5 | 'on': pull_request 6 | jobs: 7 | build_and_preview: 8 | if: '${{ github.event.pull_request.head.repo.full_name == github.repository }}' 9 | runs-on: ubuntu-latest 10 | steps: 11 | - uses: actions/checkout@v2 12 | - run: npm ci && npm run build 13 | - uses: FirebaseExtended/action-hosting-deploy@v0 14 | with: 15 | repoToken: '${{ secrets.GITHUB_TOKEN }}' 16 | firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_CODE_FOR_CAUSE_LEADERS }}' 17 | projectId: code-for-cause-leaders 18 | -------------------------------------------------------------------------------- /.github/workflows/node.js.yml: -------------------------------------------------------------------------------- 1 | # This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node 2 | # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions 3 | 4 | name: React Build 5 | 6 | on: 7 | push: 8 | branches: [ development, master ] 9 | pull_request: 10 | branches: [ development, master ] 11 | 12 | jobs: 13 | build: 14 | 15 | runs-on: ubuntu-latest 16 | 17 | strategy: 18 | matrix: 19 | node-version: [10.x, 12.x, 14.x, 15.x] 20 | # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ 21 | 22 | steps: 23 | - uses: actions/checkout@v2 24 | - name: Use Node.js ${{ matrix.node-version }} 25 | uses: actions/setup-node@v1 26 | with: 27 | node-version: ${{ matrix.node-version }} 28 | - run: npm ci 29 | - run: npm run build --if-present 30 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | /.env 17 | /.env.local 18 | /.env.development.local 19 | /.env.test.local 20 | /.env.production.local 21 | 22 | npm-debug.log* 23 | yarn-debug.log* 24 | yarn-error.log* 25 | -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 12.16.1 2 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .github/ 2 | .firebase/ 3 | public/ 4 | build/ 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "bracketSpacing": true, 3 | "printWidth": 80, 4 | "singleQuote": true, 5 | "trailingComma": "none", 6 | "tabWidth": 2, 7 | "useTabs": false, 8 | } 9 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | In the interest of fostering an open and welcoming environment, we as 6 | contributors and maintainers pledge to making participation in our project and 7 | our community a harassment-free experience for everyone, regardless of age, body 8 | size, disability, ethnicity, sex characteristics, gender identity and expression, 9 | level of experience, education, socio-economic status, nationality, personal 10 | appearance, race, religion, or sexual identity and orientation. 11 | 12 | ## Our Standards 13 | 14 | Examples of behavior that contributes to creating a positive environment 15 | include: 16 | 17 | - Using welcoming and inclusive language 18 | - Being respectful of differing viewpoints and experiences 19 | - Gracefully accepting constructive criticism 20 | - Focusing on what is best for the community 21 | - Showing empathy towards other community members 22 | 23 | Examples of unacceptable behavior by participants include: 24 | 25 | - The use of sexualized language or imagery and unwelcome sexual attention or 26 | advances 27 | - Trolling, insulting/derogatory comments, and personal or political attacks 28 | - Public or private harassment 29 | - Publishing others' private information, such as a physical or electronic 30 | address, without explicit permission 31 | - Other conduct which could reasonably be considered inappropriate in a 32 | professional setting 33 | 34 | ## Our Responsibilities 35 | 36 | Project maintainers are responsible for clarifying the standards of acceptable 37 | behavior and are expected to take appropriate and fair corrective action in 38 | response to any instances of unacceptable behavior. 39 | 40 | Project maintainers have the right and responsibility to remove, edit, or 41 | reject comments, commits, code, wiki edits, issues, and other contributions 42 | that are not aligned to this Code of Conduct, or to ban temporarily or 43 | permanently any contributor for other behaviors that they deem inappropriate, 44 | threatening, offensive, or harmful. 45 | 46 | ## Scope 47 | 48 | This Code of Conduct applies both within project spaces and in public spaces 49 | when an individual is representing the project or its community. Examples of 50 | representing a project or community include using an official project e-mail 51 | address, posting via an official social media account, or acting as an appointed 52 | representative at an online or offline event. Representation of a project may be 53 | further defined and clarified by project maintainers. 54 | 55 | ## Enforcement 56 | 57 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 58 | reported by contacting the project team at team@codeforcause.org. All 59 | complaints will be reviewed and investigated and will result in a response that 60 | is deemed necessary and appropriate to the circumstances. The project team is 61 | obligated to maintain confidentiality with regard to the reporter of an incident. 62 | Further details of specific enforcement policies may be posted separately. 63 | 64 | Project maintainers who do not follow or enforce the Code of Conduct in good 65 | faith may face temporary or permanent repercussions as determined by other 66 | members of the project's leadership. 67 | 68 | ## Attribution 69 | 70 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, 71 | available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html 72 | 73 | [homepage]: https://www.contributor-covenant.org 74 | 75 | For answers to common questions about this code of conduct, see 76 | https://www.contributor-covenant.org/faq 77 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 Code for Cause 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | CauseFolio 3 |

4 | 5 | ## Description 6 | 7 | One stop destination for showcasing the community you have built. 8 | 9 | ### Table of Contents 10 | 11 | - [Tech Stack](#tech-stack) 12 | - [Setup and Run](#setup-run) 13 | - [Setup local repo](#setup-repo) 14 | - [Setup Firebase credentials](#setup-firebase) 15 | - [Setup remote](#setup-remote) 16 | - [Update fork repo](#update-repo) 17 | - [Run app](#run-app) 18 | - [Build app](#build-app) 19 | - [Contributing and PR](#contributing) 20 | - [Project Structure](#projectstructure) 21 | - [Src Structure](#srcstructure) 22 | - [Contributors](#contributors) 23 | 24 | 25 | 26 | ## ⚙️ Tech Stack 27 | 28 | - JavaScript/TypeScript 29 | - [NodeJs](https://nodejs.org/en/) 30 | - [ReactJS](https://reactjs.org/) 31 | 32 | 33 | 34 | ## 🔨 Setup and Run 35 | 36 | 37 | 38 | ### Setup local repo 39 | 40 | Let's setup the backend server on your local machine. 41 | 42 | ### 0. Prerequisites 43 | 44 | - Install [Node.js](http://nodejs.org) 45 | 46 | ### 1. Fork repo 47 | 48 | Fork this repo to your GitHub account 49 | ![](https://i.ibb.co/wK4nFy9/Causefolio-fork.png) 50 | 51 | ### 2. Clone repo 52 | 53 | Clone the forked repo to your local machine 54 | 55 | ```bash 56 | git clone https://github.com//causefolio.git 57 | ``` 58 | 59 | Navigate to project directory 60 | 61 | ```bash 62 | cd causefolio 63 | ``` 64 | 65 | ### 3. Install Dependencies 66 | 67 | ```bash 68 | npm install 69 | ``` 70 | 71 | 72 | 73 | ### 4. Setup firebase for development (optional) 74 | 75 | A firebase account is already created, but you will not have the access to it. 76 | 77 | - To use your own firebase instance, create a new firebase project using [firebase console](https://console.firebase.google.com/). 78 | - After creating a project, go to [project settings](https://console.firebase.google.com/project/_/settings/general/). 79 | - In project settings of your newly created project there will be a section called 'Your Apps' which says 'There are no apps in your project, Select a platform to get started.' 80 | - Click on the 'WebApp' Icon, then it will ask to register a new App. 81 | ![](https://i.ibb.co/n0psH7B/Firebaseapp.png) 82 | - In the 2nd step of app registration, firebase will provide to you the firebase credentials of your app. 83 | - Now change it to provide your firebase credentials [here](https://github.com/codeforcauseorg/Code-for-cause-Leaders/blob/master/src/services/authService.js#L8-LL13) 84 | 85 | 86 | 87 | ### 5. 📡 Setup remote 88 | 89 | 0. You will have to set up remote repositories for getting latest changes from original repository 90 | 1. Specify a new remote upstream repository that will be synced with the fork using following command : 91 | 92 | ```bash 93 | $ git remote add upstream https://github.com/codeforcauseorg/causefolio.git 94 | ``` 95 | 96 | 2. Verify the new upstream repository you've specified for your fork using `git remote -v` 97 | 98 | ```console 99 | 100 | origin https://github.com//causefolio.git (fetch) 101 | origin https://github.com//causefolio.git (push) 102 | upstream https://github.com/codeforcauseorg/causefolio.git (fetch) 103 | upstream https://github.com/codeforcauseorg/causefolio.git (push) 104 | 105 | ``` 106 | 107 | Your application setup is successfully completed! 108 | 109 | 110 | 111 | ### 6. Update Fork Repo From Original Repo (Optional) 112 | 113 | 0. Follow these steps if you are done with Setup Remote ✅. 114 | 1. Update your local Master to be in synch with the original repo. 115 | 116 | ```console 117 | 118 | $ git pull upstream 119 | 120 | ``` 121 | 122 | 2. Update the forked repo master by pushing the local repo up. 123 | 124 | ```console 125 | 126 | $ git push origin 127 | 128 | ``` 129 | 130 | 131 | 132 | ### Running the app 133 | 134 | ```bash 135 | # development 136 | $ npm run start 137 | ``` 138 | 139 | 140 | 141 | ### Build Setup 142 | 143 | - After doing changes, run the command `npm run build` to build the app for production to the `build` folder. 144 | 145 | ```bash 146 | # build for production 147 | npm run build 148 | ``` 149 | 150 | 151 | 152 | ### Contributions and PR 153 | 154 | - PRs should be generated against `development`. 155 | - Remember to run `npm run format` before creating pull request. 156 | - Netlify will create a preview inside pull request. Please check if your work is fine. 157 | 158 | 159 | 160 | ## Project Structure 161 | 162 | . 163 | ├── build # Compiled files 164 | ├── src # Source files 165 | └── ... 166 | 167 | 168 | 169 | ## Src Structure 170 | 171 | . 172 | ├── ... 173 | ├── src 174 | │ ├── ... 175 | │ ├── assets # assets for the website 176 | | ├── index.js # starting point 177 | │ └── ... 178 | └── ... 179 | 180 | 181 | 182 | ## Thanks to all the contributors ❤️ 183 | 184 | 185 | 186 | 187 | -------------------------------------------------------------------------------- /design/Add event.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Add event.png -------------------------------------------------------------------------------- /design/Add speaker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Add speaker.png -------------------------------------------------------------------------------- /design/Dasboard.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Dasboard.png -------------------------------------------------------------------------------- /design/Events.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Events.png -------------------------------------------------------------------------------- /design/Individual event.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Individual event.png -------------------------------------------------------------------------------- /design/Landing Page-part-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Landing Page-part-1.png -------------------------------------------------------------------------------- /design/Landing Page-part-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Landing Page-part-3.png -------------------------------------------------------------------------------- /design/Profile Overview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Profile Overview.png -------------------------------------------------------------------------------- /design/Profile Page Content.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/design/Profile Page Content.png -------------------------------------------------------------------------------- /design/README.md: -------------------------------------------------------------------------------- 1 | # Current Designs 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /firebase.json: -------------------------------------------------------------------------------- 1 | { 2 | "hosting": { 3 | "public": "build", 4 | "ignore": [ 5 | "firebase.json", 6 | "**/.*", 7 | "**/node_modules/**" 8 | ], 9 | "rewrites": [ 10 | { 11 | "source": "**", 12 | "destination": "/index.html" 13 | } 14 | ] 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /jsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "baseUrl": "." 4 | }, 5 | "include": ["src"] 6 | } 7 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "causefolio", 3 | "author": "Code for Cause", 4 | "email": "team@codeforcause.org", 5 | "licence": "MIT", 6 | "version": "1.0.0", 7 | "private": true, 8 | "scripts": { 9 | "start": "react-scripts start", 10 | "build": "react-scripts build", 11 | "test": "react-scripts test", 12 | "eject": "react-scripts eject", 13 | "format": "prettier --write \"**/*.+(js|jsx|json|css|md)\"" 14 | }, 15 | "browserslist": { 16 | "production": [ 17 | ">0.2%", 18 | "ie 11", 19 | "not dead", 20 | "not op_mini all" 21 | ], 22 | "development": [ 23 | "ie 11", 24 | "last 1 chrome version", 25 | "last 1 firefox version", 26 | "last 1 safari version" 27 | ] 28 | }, 29 | "dependencies": { 30 | "@date-io/core": "^2.5.0", 31 | "@date-io/date-fns": "^2.10.11", 32 | "@date-io/moment": "^1.3.13", 33 | "@fortawesome/fontawesome-svg-core": "^1.2.29", 34 | "@fortawesome/free-brands-svg-icons": "^5.13.1", 35 | "@fortawesome/free-regular-svg-icons": "^5.13.1", 36 | "@fortawesome/free-solid-svg-icons": "^5.13.1", 37 | "@fortawesome/react-fontawesome": "^0.1.11", 38 | "@material-ui/core": "^4.9.9", 39 | "@material-ui/icons": "^4.9.1", 40 | "@material-ui/lab": "^4.0.0-alpha.48", 41 | "@material-ui/pickers": "^3.2.10", 42 | "@material-ui/styles": "^4.9.6", 43 | "@mdx-js/react": "^1.5.8", 44 | "@mui-treasury/components": "^1.9.1", 45 | "@mui-treasury/styles": "^1.13.0", 46 | "@react-pdf/renderer": "^1.6.8", 47 | "apexcharts": "^3.18.0", 48 | "axios": "^0.21.1", 49 | "axios-mock-adapter": "^1.17.0", 50 | "change-case": "^4.1.1", 51 | "chart.js": "^2.9.3", 52 | "clsx": "^1.1.0", 53 | "copy-to-clipboard": "^3.3.1", 54 | "date-fns": "^2.22.1", 55 | "firebase": "^8.6.7", 56 | "history": "^4.10.1", 57 | "immer": "^8.0.1", 58 | "js-cookie": "^2.2.1", 59 | "jsonwebtoken": "^8.5.1", 60 | "jss": "^10.1.1", 61 | "jss-rtl": "^0.3.0", 62 | "jwt-decode": "^2.2.0", 63 | "lodash": "^4.17.15", 64 | "moment": "^2.24.0", 65 | "notistack": "^1.0.9", 66 | "nprogress": "^0.2.0", 67 | "prismjs": "^1.20.0", 68 | "prop-types": "^15.7.2", 69 | "react": "^16.13.1", 70 | "react-apexcharts": "^1.3.7", 71 | "react-app-polyfill": "^1.0.6", 72 | "react-beautiful-dnd": "^13.0.0", 73 | "react-big-calendar": "^0.24.1", 74 | "react-chartjs-2": "^2.9.0", 75 | "react-dom": "^16.13.1", 76 | "react-draft-wysiwyg": "^1.14.4", 77 | "react-dropzone": "^10.2.2", 78 | "react-feather": "^2.0.3", 79 | "react-helmet": "^6.1.0", 80 | "react-images-upload": "^1.2.8", 81 | "react-markdown": "^4.3.1", 82 | "react-material-ui-form-validator": "^2.1.1", 83 | "react-modal-image": "^2.5.0", 84 | "react-perfect-scrollbar": "^1.5.8", 85 | "react-quill": "^1.3.5", 86 | "react-redux": "^7.2.0", 87 | "react-router": "^5.1.2", 88 | "react-router-dom": "^5.1.2", 89 | "react-router-hash-link": "^2.4.3", 90 | "react-scripts": "^4.0.3", 91 | "react-slick": "^0.28.1", 92 | "react-swipeable-views": "^0.13.9", 93 | "redux": "^4.0.5", 94 | "redux-devtools-extension": "^2.13.8", 95 | "redux-form": "^8.3.2", 96 | "redux-logger": "^3.0.6", 97 | "redux-thunk": "^2.3.0", 98 | "slick-carousel": "^1.8.1", 99 | "uuid": "^7.0.3" 100 | }, 101 | "devDependencies": { 102 | "eslint": "^7.0.0", 103 | "eslint-config-prettier": "^8.3.0", 104 | "eslint-plugin-prettier": "^3.4.0", 105 | "eslint-plugin-react": "^7.24.0", 106 | "eslint-plugin-react-hooks": "^4.2.0", 107 | "prettier": "^1.19.1", 108 | "typescript": "^4.3.2" 109 | }, 110 | "homepage": "./" 111 | } 112 | -------------------------------------------------------------------------------- /public/_redirects: -------------------------------------------------------------------------------- 1 | /* /index.html 200 -------------------------------------------------------------------------------- /public/badges/bronze-badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/badges/bronze-badge.png -------------------------------------------------------------------------------- /public/badges/gold-batch.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/badges/gold-batch.png -------------------------------------------------------------------------------- /public/badges/silver-badge.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/badges/silver-badge.png -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/favicon.ico -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 12 | 13 | 16 | CauseFolio 17 | 21 | 25 | 26 | 27 | 28 | 29 |
30 | 31 | 32 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /public/static/event/eventBanner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/event/eventBanner.png -------------------------------------------------------------------------------- /public/static/home/Footer.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /public/static/home/avatars/Anuj_garg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/avatars/Anuj_garg.jpg -------------------------------------------------------------------------------- /public/static/home/avatars/Gaurav_Beriwal.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/avatars/Gaurav_Beriwal.jpg -------------------------------------------------------------------------------- /public/static/home/avatars/kunal_kush.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/avatars/kunal_kush.jpg -------------------------------------------------------------------------------- /public/static/home/blob.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /public/static/home/codeforcause.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/codeforcause.png -------------------------------------------------------------------------------- /public/static/home/olivier.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/olivier.png -------------------------------------------------------------------------------- /public/static/home/serviceGirl.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/home/serviceGirl.png -------------------------------------------------------------------------------- /public/static/images/avatar-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/avatar-1.png -------------------------------------------------------------------------------- /public/static/images/avatar-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/avatar-2.png -------------------------------------------------------------------------------- /public/static/images/avatar-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/avatar-3.png -------------------------------------------------------------------------------- /public/static/images/bmevents.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/bmevents.png -------------------------------------------------------------------------------- /public/static/images/event_img.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/event_img.jpg -------------------------------------------------------------------------------- /public/static/images/gallery.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/google-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/google-logo.png -------------------------------------------------------------------------------- /public/static/images/icons/blog_plus.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /public/static/images/icons/calendar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/icons/calendar.png -------------------------------------------------------------------------------- /public/static/images/icons/cross.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/event.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/static/images/icons/event_calendar.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /public/static/images/icons/event_calendar_w.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 6 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /public/static/images/icons/fork_button.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /public/static/images/icons/ok1.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/static/images/icons/ok3.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /public/static/images/icons/os1.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/os2.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /public/static/images/icons/play1.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /public/static/images/icons/play2.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/play_rec.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/icons/play_rec.png -------------------------------------------------------------------------------- /public/static/images/icons/prof_event.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/icons/prof_event.png -------------------------------------------------------------------------------- /public/static/images/icons/prof_pub.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/images/icons/prof_pub.png -------------------------------------------------------------------------------- /public/static/images/icons/publication.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /public/static/images/icons/rating_star_red.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/rating_star_white.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/star_blue.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /public/static/images/icons/star_button.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /public/static/images/icons/star_orange.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /public/static/images/icons/star_yellow.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /public/static/logo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/logo.jpg -------------------------------------------------------------------------------- /public/static/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/logo.png -------------------------------------------------------------------------------- /public/static/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Logo 5 | Created with Sketch. 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /public/static/logo/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/logo/logo.png -------------------------------------------------------------------------------- /public/static/profile/icons/Vector-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/profile/icons/Vector-1.png -------------------------------------------------------------------------------- /public/static/profile/icons/Vector-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/profile/icons/Vector-2.png -------------------------------------------------------------------------------- /public/static/profile/icons/Vector-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/profile/icons/Vector-3.png -------------------------------------------------------------------------------- /public/static/profile/icons/Vector.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/profile/icons/Vector.png -------------------------------------------------------------------------------- /public/static/profile/icons/icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codeforcauseorg/causefolio/17bee5f7f09de61d19915d3589cd1e9df2456d71/public/static/profile/icons/icons.png -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Router } from 'react-router-dom'; 3 | import { createBrowserHistory } from 'history'; 4 | import { create } from 'jss'; 5 | import rtl from 'jss-rtl'; 6 | import MomentUtils from '@date-io/moment'; 7 | import { SnackbarProvider } from 'notistack'; 8 | import { 9 | createStyles, 10 | jssPreset, 11 | makeStyles, 12 | StylesProvider, 13 | ThemeProvider 14 | } from '@material-ui/core'; 15 | import { MuiPickersUtilsProvider } from '@material-ui/pickers'; 16 | import Auth from 'src/components/auth/Auth'; 17 | // import CookiesNotification from 'src/components/CookiesNotification'; 18 | // import SettingsNotification from 'src/components/SettingsNotification'; 19 | import GoogleAnalytics from 'src/components/GoogleAnalytics'; 20 | import ScrollReset from 'src/components/ScrollReset'; 21 | import useSettings from 'src/hooks/useSettings'; 22 | import { createTheme } from 'src/theme'; 23 | import Routes from 'src/Routes'; 24 | import { library } from '@fortawesome/fontawesome-svg-core'; 25 | import { fab } from '@fortawesome/free-brands-svg-icons'; 26 | import { faEnvelope } from '@fortawesome/free-solid-svg-icons'; 27 | 28 | library.add(fab, faEnvelope); 29 | 30 | const history = createBrowserHistory(); 31 | const jss = create({ plugins: [...jssPreset().plugins, rtl()] }); 32 | 33 | const useStyles = makeStyles(() => 34 | createStyles({ 35 | '@global': { 36 | '*': { 37 | boxSizing: 'border-box', 38 | margin: 0, 39 | padding: 0 40 | }, 41 | html: { 42 | '-webkit-font-smoothing': 'antialiased', 43 | '-moz-osx-font-smoothing': 'grayscale', 44 | height: '100%', 45 | width: '100%' 46 | }, 47 | body: { 48 | height: '100%', 49 | width: '100%' 50 | }, 51 | '#root': { 52 | height: '100%', 53 | width: '100%' 54 | } 55 | } 56 | }) 57 | ); 58 | 59 | function App() { 60 | useStyles(); 61 | 62 | const { settings } = useSettings(); 63 | 64 | return ( 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | {/* */} 74 | {/* */} 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | ); 83 | } 84 | 85 | export default App; 86 | -------------------------------------------------------------------------------- /src/Routes.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable react/no-array-index-key */ 2 | import React, { Suspense } from 'react'; 3 | import { Route, Switch } from 'react-router-dom'; 4 | import LoadingScreen from 'src/components/LoadingScreen'; 5 | import Navigation from 'src/components/dashboard'; 6 | import Error404View from 'src/views/pages/Error404View'; 7 | import Profile from 'src/components/Profile'; 8 | import EventDefaultPage from 'src/views/pages/events/eventdefault'; 9 | import IndividualEvent from './views/pages/events/individualEvent'; 10 | import Register from './views/pages/register/Register'; 11 | import CreateNewEvent from './components/CreateNewEvent'; 12 | import Settings from './views/pages/settings/Settings'; 13 | import LandingPage from './views/pages/HomeView/LandingPage'; 14 | import AuthGuard from './components/auth/AuthGuard'; 15 | import LoginPage from 'src/views/pages/login'; 16 | import PublicProfile from 'src/components/PublicProfile'; 17 | 18 | const renderRoutes = () => ( 19 | }> 20 | 21 | } /> 22 | } /> 23 | } /> 24 | ( 28 | 29 | 30 | 31 | )} 32 | /> 33 | ( 37 | 38 | 39 | 40 | )} 41 | /> 42 | } 46 | /> 47 | } /> 48 | ( 52 | 53 | 54 | 55 | )} 56 | /> 57 | ( 61 | 62 | 63 | 64 | )} 65 | /> 66 | ( 70 | 71 | 72 | 73 | )} 74 | /> 75 | } /> 76 | 77 | 78 | ); 79 | 80 | function Routes() { 81 | return renderRoutes({}); 82 | } 83 | 84 | export default Routes; 85 | -------------------------------------------------------------------------------- /src/actions/accountActions.js: -------------------------------------------------------------------------------- 1 | import axios from 'src/utils/axios'; 2 | import authService from 'src/services/authService'; 3 | 4 | export const LOGIN_REQUEST = '@account/login-request'; 5 | export const DISMISS_LOGIN = '@account/dismiss-login'; 6 | export const LOGIN_SUCCESS = '@account/login-success'; 7 | export const LOGIN_FAILURE = '@account/login-failure'; 8 | export const SILENT_LOGIN = '@account/silent-login'; 9 | export const LOGOUT = '@account/logout'; 10 | export const REGISTER = '@account/register'; 11 | export const UPDATE_PROFILE = '@account/update-profile'; 12 | 13 | export function login() { 14 | return async dispatch => { 15 | dispatch({ type: LOGIN_REQUEST }); 16 | }; 17 | } 18 | 19 | export function dismissLogin() { 20 | return async dispatch => { 21 | dispatch({ type: DISMISS_LOGIN }); 22 | }; 23 | } 24 | 25 | export function setUserData(user) { 26 | return dispatch => 27 | dispatch({ 28 | type: SILENT_LOGIN, 29 | payload: { 30 | user 31 | } 32 | }); 33 | } 34 | 35 | export function logout() { 36 | return async dispatch => { 37 | authService.logout(); 38 | dispatch({ 39 | type: LOGOUT 40 | }); 41 | }; 42 | } 43 | 44 | export function register() { 45 | return true; 46 | } 47 | 48 | export function updateProfile(update) { 49 | const request = axios.post('/api/account/profile', { update }); 50 | 51 | return dispatch => { 52 | request.then(response => 53 | dispatch({ 54 | type: UPDATE_PROFILE, 55 | payload: response.data 56 | }) 57 | ); 58 | }; 59 | } 60 | -------------------------------------------------------------------------------- /src/assets/css/loader.css: -------------------------------------------------------------------------------- 1 | /* Demo */ 2 | .container:root { 3 | height: 100vh; 4 | display: flex; 5 | align-items: center; 6 | justify-content: center; 7 | background: linear-gradient(#ecf0f1, #fff); 8 | } 9 | /* Animation */ 10 | @keyframes rotate { 11 | to { 12 | transform: rotate(360deg); 13 | } 14 | } 15 | /* Variables */ 16 | /* Loading Icon */ 17 | .loading { 18 | width: 100px; 19 | height: 100px; 20 | margin-top: 15.625em; 21 | margin-left: 45%; 22 | } 23 | .loading__ring { 24 | position: absolute; 25 | width: 100px; 26 | height: 100px; 27 | } 28 | .loading__ring:first-child { 29 | transform: skew(30deg, 20deg); 30 | } 31 | .loading__ring:last-child { 32 | transform: skew(-30deg, -20deg) scale(-1, 1); 33 | } 34 | .loading__ring:last-child svg { 35 | animation-delay: -0.5s; 36 | } 37 | .loading__ring svg { 38 | animation: rotate 1s linear infinite; 39 | fill: rgba(88, 74, 124, 0.9); 40 | } 41 | -------------------------------------------------------------------------------- /src/assets/css/prism.css: -------------------------------------------------------------------------------- 1 | pre { 2 | border-radius: 4px; 3 | background-color: #191c27; 4 | padding: 16px; 5 | font-size: 14px; 6 | margin-bottom: 24px; 7 | } 8 | 9 | code[class*='language-'], 10 | pre[class*='language-'] { 11 | color: rgb(191, 199, 213); 12 | font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; 13 | direction: ltr; 14 | text-align: left; 15 | white-space: pre; 16 | word-spacing: normal; 17 | word-break: normal; 18 | line-height: 1.5; 19 | tab-size: 4; 20 | hyphens: none; 21 | } 22 | 23 | /* Code blocks */ 24 | pre[class*='language-'] { 25 | padding: 1em; 26 | margin: 0.5em 0; 27 | overflow: auto; 28 | border-radius: 0.3em; 29 | } 30 | 31 | :not(pre) > code[class*='language-'], 32 | pre[class*='language-'] { 33 | background: #1d1f21; 34 | } 35 | 36 | /* Inline code */ 37 | :not(pre) > code[class*='language-'] { 38 | padding: 0.1em; 39 | border-radius: 0.3em; 40 | } 41 | 42 | .token.prolog { 43 | color: rgb(0, 0, 128); 44 | } 45 | 46 | .token.parameter { 47 | color: rgb(255, 255, 255); 48 | } 49 | 50 | .token.comment { 51 | color: rgb(106, 153, 85); 52 | } 53 | 54 | .token.doctype { 55 | color: rgb(191, 199, 213); 56 | } 57 | 58 | .token.cdata { 59 | color: rgb(191, 199, 213); 60 | } 61 | 62 | .token.punctuation { 63 | color: rgb(136, 198, 190); 64 | } 65 | 66 | .token.property { 67 | color: rgb(252, 146, 158); 68 | } 69 | 70 | .token.tag { 71 | color: rgb(252, 146, 158); 72 | } 73 | 74 | .token.class-name { 75 | color: rgb(250, 200, 99); 76 | } 77 | 78 | .token.boolean { 79 | } 80 | 81 | .token.constant { 82 | color: rgb(100, 102, 149); 83 | } 84 | 85 | .token.symbol { 86 | color: rgb(141, 200, 145); 87 | } 88 | 89 | .token.deleted { 90 | color: rgb(141, 200, 145); 91 | } 92 | 93 | .token.number { 94 | color: rgb(181, 206, 168); 95 | } 96 | 97 | .token.inserted { 98 | color: rgb(181, 206, 168); 99 | } 100 | 101 | .token.selector { 102 | color: rgb(215, 186, 125); 103 | } 104 | 105 | .token.char { 106 | color: rgb(209, 105, 105); 107 | } 108 | 109 | .token.builtin { 110 | color: rgb(197, 165, 197); 111 | } 112 | 113 | .token.changed { 114 | color: rgb(197, 165, 197); 115 | } 116 | 117 | .token.keyword { 118 | color: rgb(197, 165, 197); 119 | } 120 | 121 | .token.string { 122 | color: rgb(195, 232, 141); 123 | } 124 | 125 | .token.attr-name { 126 | color: rgb(156, 220, 254); 127 | } 128 | 129 | .token.variable { 130 | color: rgb(156, 220, 254); 131 | } 132 | 133 | .token.operator { 134 | color: #ededed; 135 | } 136 | 137 | .token.entity { 138 | color: #ffffb6; 139 | cursor: help; 140 | } 141 | 142 | .token.url { 143 | color: #96cbfe; 144 | } 145 | 146 | .language-css .token.string, 147 | .style .token.string { 148 | color: #87c38a; 149 | } 150 | 151 | .token.atrule, 152 | .token.attr-value { 153 | color: #f9ee98; 154 | } 155 | 156 | .token.function { 157 | color: rgb(121, 182, 242); 158 | } 159 | 160 | .token.regex { 161 | color: #e9c062; 162 | } 163 | 164 | .token.important { 165 | color: #fd971f; 166 | } 167 | 168 | .token.important, 169 | .token.bold { 170 | font-weight: bold; 171 | } 172 | 173 | .token.italic { 174 | font-style: italic; 175 | } 176 | .MuiDrawer-paperAnchorRight { 177 | left: 0% !important; 178 | right: 0; 179 | display: flex; 180 | align-items: center; 181 | justify-content: center; 182 | } 183 | -------------------------------------------------------------------------------- /src/components/Badge.js: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Card, Grid, Typography, Button } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(() => ({ 6 | root: { 7 | background: '#CCD2E3', 8 | borderRadius: '20px', 9 | padding: '10px 16px 13px 16px', 10 | color: '#291757', 11 | fontFamily: 'Montserrat' 12 | }, 13 | topContainer: { 14 | width: '100%', 15 | display: 'flex', 16 | justifyContent: 'space-between', 17 | marginBottom: '27px', 18 | '& > h1:nth-child(1)': { 19 | marginRight: '20px' 20 | } 21 | }, 22 | topText: { 23 | fontWeight: 'bold', 24 | fontSize: '24px', 25 | letterSpacing: '0.44px' 26 | }, 27 | buttonContainer: { 28 | display: 'flex', 29 | justifyContent: 'flex-end', 30 | padding: '0px 10px' 31 | }, 32 | badges: { 33 | display: 'flex', 34 | textAlign: 'center', 35 | fontSize: '17px', 36 | justifyContent: 'flex-start', 37 | marginRight: '8px', 38 | '& > div:not(:last-child)': { 39 | marginRight: '8px' 40 | } 41 | }, 42 | badgesText: { 43 | width: '84px', 44 | height: '48px', 45 | lineHeight: '24px', 46 | wordWrap: 'break-word', 47 | marginBottom: '14px' 48 | }, 49 | button: { 50 | backgroundColor: '#291757', 51 | width: '117px', 52 | height: '30px', 53 | color: 'white', 54 | fontWeight: 'bold', 55 | fontSize: '14px', 56 | letterSpacing: '0.05em', 57 | borderRadius: '20px' 58 | } 59 | })); 60 | 61 | function Badge() { 62 | const classes = useStyles(); 63 | const [numberOfBadgesUnlocked, setNumberOFBadgeUnlocked] = useState(0); 64 | 65 | useEffect(() => { 66 | // for demo purpose set to 6 67 | setNumberOFBadgeUnlocked(6); 68 | }, []); 69 | 70 | return ( 71 | 72 | 73 | 74 | 75 | Badges Earned 76 | 77 | 78 | {numberOfBadgesUnlocked} Unlocked 79 | 80 | 81 | 82 | 83 | {/* for demo purpose added badges statically */} 84 | 85 | badge 90 | Beginner 91 | 92 | 93 | badge 98 | Ambassador 99 | 100 | {/* 101 | badge 106 | I am Famous 107 | 108 | 109 | badge */} 113 | 114 |
115 | 118 |
119 | 120 | ); 121 | } 122 | 123 | export default Badge; 124 | -------------------------------------------------------------------------------- /src/components/CommitChart.js: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Card, Grid, Typography, Paper } from '@material-ui/core'; 4 | import { Chart, Bar } from 'react-chartjs-2'; 5 | 6 | Chart.defaults.global.legend.display = false; 7 | 8 | const useStyles = makeStyles(() => ({ 9 | root: { 10 | background: '#291757', 11 | borderRadius: '20px', 12 | padding: '10px 16px 13px 16px', 13 | color: 'white', 14 | fontFamily: 'Montserrat' 15 | }, 16 | topContainer: { 17 | width: '100%', 18 | display: 'flex', 19 | justifyContent: 'space-between', 20 | marginBottom: '27px', 21 | '& > h1:nth-child(1)': { 22 | marginRight: '20px' 23 | } 24 | }, 25 | topText: { 26 | fontWeight: 'bold', 27 | fontSize: '24px', 28 | letterSpacing: '0.44px' 29 | } 30 | })); 31 | 32 | function CommitChart() { 33 | const [commitHistory, setCommitHistory] = useState([ 34 | 0, 35 | 0, 36 | 0, 37 | 0, 38 | 0, 39 | 0, 40 | 0, 41 | 0, 42 | 0, 43 | 0, 44 | 0, 45 | 0, 46 | 0, 47 | 0, 48 | 0, 49 | 0, 50 | 0, 51 | 0, 52 | 0, 53 | 0, 54 | 0, 55 | 0, 56 | 0, 57 | 0, 58 | 0, 59 | 0, 60 | 0, 61 | 0, 62 | 0, 63 | 0 64 | ]); 65 | 66 | useEffect(() => { 67 | setCommitHistory([ 68 | 4, 69 | 2, 70 | 1, 71 | 1, 72 | 2, 73 | 5, 74 | 11, 75 | 8, 76 | 9, 77 | 3, 78 | 0, 79 | 2, 80 | 4, 81 | 5, 82 | 5, 83 | 1, 84 | 7, 85 | 11, 86 | 13, 87 | 8, 88 | 2, 89 | 12, 90 | 9, 91 | 3, 92 | 5, 93 | 6, 94 | 5, 95 | 0, 96 | 2, 97 | 6 98 | ]); 99 | }, []); 100 | 101 | const classes = useStyles(); 102 | const now = new Date(); 103 | 104 | const days = []; 105 | 106 | for (let i = 29; i >= 0; i--) { 107 | const y = new Intl.DateTimeFormat('en', { year: 'numeric' }).format( 108 | now - i * 86400000 109 | ); 110 | const m = new Intl.DateTimeFormat('en', { month: 'short' }).format( 111 | now - i * 86400000 112 | ); 113 | const d = new Intl.DateTimeFormat('en', { day: '2-digit' }).format( 114 | now - i * 86400000 115 | ); 116 | days.push(`${d}-${m}-${y}`); 117 | } 118 | 119 | const data = { 120 | labels: days, 121 | datasets: [ 122 | { 123 | label: 'Commits', 124 | borderWidth: 0, 125 | backgroundColor: '#74C7E550', 126 | data: commitHistory 127 | } 128 | ] 129 | }; 130 | 131 | const commitSum = commitHistory.reduce((a, b) => a + b); 132 | 133 | return ( 134 | 135 | 136 | Monthly Commits 137 | {commitSum} 138 | 139 | 140 | 176 | 177 | 178 | ); 179 | } 180 | 181 | export default CommitChart; 182 | -------------------------------------------------------------------------------- /src/components/GoogleAnalytics.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Helmet } from 'react-helmet'; 3 | 4 | const GA_MEASUREMENT_ID = process.env.REACT_APP_GA_MEASUREMENT_ID; 5 | 6 | function GoogleAnalytics() { 7 | return ( 8 | 9 | 25 | 26 | ); 27 | } 28 | 29 | export default GoogleAnalytics; 30 | -------------------------------------------------------------------------------- /src/components/Loader.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const Loader = () => { 4 | return ( 5 |
6 |
7 |
8 | 18 | 19 | 20 |
21 |
22 | 32 | 33 | 34 |
35 |
36 |
37 | ); 38 | }; 39 | 40 | export default Loader; 41 | -------------------------------------------------------------------------------- /src/components/LoadingScreen.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from 'react'; 2 | import NProgress from 'nprogress'; 3 | import { Box, LinearProgress, makeStyles } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(theme => ({ 6 | root: { 7 | alignItems: 'center', 8 | backgroundColor: theme.palette.background.default, 9 | display: 'flex', 10 | flexDirection: 'column', 11 | height: '100%', 12 | justifyContent: 'center', 13 | minHeight: '100%', 14 | padding: theme.spacing(3) 15 | } 16 | })); 17 | 18 | function LoadingScreen() { 19 | const classes = useStyles(); 20 | 21 | useEffect(() => { 22 | NProgress.start(); 23 | 24 | return () => { 25 | NProgress.done(); 26 | }; 27 | }, []); 28 | 29 | return ( 30 |
31 | 32 | 33 | 34 |
35 | ); 36 | } 37 | 38 | export default LoadingScreen; 39 | -------------------------------------------------------------------------------- /src/components/Logo.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | 4 | function Logo(props, variant) { 5 | if (variant === 'black') { 6 | return ( 7 | Logo 8 | ); 9 | } 10 | return ( 11 | Logo 12 | ); 13 | } 14 | Logo.propTypes = { 15 | variant: PropTypes.string 16 | }; 17 | export default Logo; 18 | -------------------------------------------------------------------------------- /src/components/Logo1.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | function Logo(props) { 4 | return ( 5 | Logo 11 | ); 12 | } 13 | 14 | export default Logo; 15 | -------------------------------------------------------------------------------- /src/components/NewEvents.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Button, Card, Grid, Typography } from '@material-ui/core'; 4 | import { useSelector } from 'react-redux'; 5 | import { firebase } from 'src/services/authService'; 6 | 7 | const useStyles = makeStyles(theme => ({ 8 | root: { 9 | background: '#CCD2E3', 10 | borderRadius: '20px', 11 | padding: '19px', 12 | color: '#291757', 13 | fontFamily: 'Montserrat', 14 | marginBottom: '21px', 15 | marginLeft: '21px', 16 | [theme.breakpoints.down('sm')]: { 17 | marginLeft: 0 18 | } 19 | }, 20 | topContainer: { 21 | display: 'flex', 22 | justifyContent: 'space-between', 23 | marginBottom: '21px' 24 | }, 25 | topText: { 26 | fontWeight: 'bold', 27 | fontSize: '24px', 28 | letterSpacing: '0.44px' 29 | }, 30 | event: { 31 | display: 'block', 32 | fontSize: '17px', 33 | marginBottom: '10px' 34 | }, 35 | eventText: { 36 | display: 'flex', 37 | fontWeight: 'bold', 38 | textAlign: 'center', 39 | alignItems: 'center', 40 | marginBottom: '10px', 41 | wordWrap: 'break-word' 42 | }, 43 | eventInfo: { 44 | display: 'block', 45 | fontSize: '10px', 46 | marginLeft: '10px', 47 | letterSpacing: '0.44px' 48 | }, 49 | eventDate: { 50 | display: 'flex', 51 | textAlign: 'left', 52 | fontSize: '10px', 53 | marginRight: '12px', 54 | marginBottom: '5px' 55 | }, 56 | rsvp: { 57 | display: 'flex', 58 | textAlign: 'left', 59 | fontSize: '12px', 60 | background: 'white', 61 | borderRadius: '5px', 62 | fontWeight: '800', 63 | padding: '1px 8px', 64 | letterSpacing: '0.44px' 65 | } 66 | })); 67 | 68 | function NewEvents() { 69 | const classes = useStyles(); 70 | const user = useSelector(state => state.account.user); 71 | const [attendingEvent, setAttendingEvent] = useState([]); 72 | 73 | const readIds = async (collection, ids) => { 74 | const reads = ids.map(id => collection.doc(id).get()); 75 | const result = await Promise.all(reads); 76 | return result.map(r => r.data()); 77 | }; 78 | 79 | useEffect(() => { 80 | const fetchAttendingEvents = async () => { 81 | if (user === undefined || user === null) return; 82 | 83 | const userID = user.uid; 84 | const db = firebase.firestore(); 85 | const userRef = await db.collection('users').doc(userID); 86 | userRef.get().then(doc => { 87 | if (doc.exists) { 88 | let data = doc.data(); 89 | readIds(db.collection('events'), data.attending).then(result => 90 | setAttendingEvent(result) 91 | ); 92 | } 93 | }); 94 | }; 95 | fetchAttendingEvents(); 96 | }, [user]); 97 | 98 | const handleClick = link => { 99 | if (link.length <= 0) return; 100 | const win = window.open(`${link}`, '_blank'); 101 | win.focus(); 102 | }; 103 | 104 | return ( 105 | 106 | 107 | 108 | 109 | Attending Events 110 | 111 | 112 | 113 | 114 | {attendingEvent.length > 0 && 115 | attendingEvent.map((event, idx) => ( 116 | 117 | event 122 | 123 | {event.eventName} 124 |
125 | 126 | {event.date} 127 | 128 |
129 | 143 | 144 | 145 | ))} 146 | 147 | 148 | ); 149 | } 150 | 151 | export default NewEvents; 152 | -------------------------------------------------------------------------------- /src/components/Page.js: -------------------------------------------------------------------------------- 1 | import React, { forwardRef, useEffect, useCallback } from 'react'; 2 | import { Helmet } from 'react-helmet'; 3 | import { useLocation } from 'react-router'; 4 | import PropTypes from 'prop-types'; 5 | import track from 'src/utils/analytics'; 6 | 7 | const Page = forwardRef(({ title, children, ...rest }, ref) => { 8 | const location = useLocation(); 9 | 10 | const sendPageViewEvent = useCallback(() => { 11 | track.pageview({ 12 | page_path: location.pathname 13 | }); 14 | }, [location]); 15 | 16 | useEffect(() => { 17 | sendPageViewEvent(); 18 | }, [sendPageViewEvent]); 19 | 20 | return ( 21 |
22 | 23 | {title} 24 | 25 | {children} 26 |
27 | ); 28 | }); 29 | 30 | Page.displayName = 'Page'; 31 | Page.propTypes = { 32 | children: PropTypes.node, 33 | title: PropTypes.string 34 | }; 35 | 36 | export default Page; 37 | -------------------------------------------------------------------------------- /src/components/Profile.js: -------------------------------------------------------------------------------- 1 | import Grid from '@material-ui/core/Grid'; 2 | import React, { useEffect, useState } from 'react'; 3 | import DrawerLayout from 'src/layouts/DrawerLayout'; 4 | import { firebase } from 'src/services/authService'; 5 | import { useSelector } from 'react-redux'; 6 | import Badge from './Badge'; 7 | import ProfileInfo from './ProfileInfo'; 8 | // import ProfilePublications from './ProfilePublications'; 9 | import ProfileEvents from './ProfileEvents'; 10 | import CommitChart from './CommitChart'; 11 | import ProjectsCarousel from './ProjectsCarousel'; 12 | import '../assets/css/loader.css'; 13 | import Loader from './Loader'; 14 | 15 | export default function Profile() { 16 | const user = useSelector(state => state.account.user); 17 | const [myProfile, setMyProfile] = useState(null); 18 | const [userEvents, setUserEvents] = useState([]); 19 | const [loading, setLoading] = useState(true); 20 | const [profileType] = useState('private'); 21 | 22 | useEffect(() => { 23 | if (user !== undefined && user !== null) { 24 | const userId = user.uid; 25 | const db = firebase.firestore(); 26 | 27 | const docRef = db.collection('users').doc(userId); 28 | 29 | // For getting user's upcoming events 30 | db.collection('events') 31 | .where('createdBy', '==', `${userId}`) 32 | .limit(2) 33 | .get() 34 | .then(userEventCollection => { 35 | setUserEvents(userEventCollection.docs.map(doc => doc.data())); 36 | }); 37 | 38 | docRef 39 | .get() 40 | .then(doc => { 41 | if (doc.exists) { 42 | const data = doc.data(); 43 | setMyProfile(data); 44 | } 45 | setLoading(false); 46 | }) 47 | 48 | .catch(error => { 49 | console.log('Error getting document:', error); 50 | }); 51 | } 52 | }, [user]); 53 | 54 | return ( 55 | 56 | {!loading ? ( 57 | <> 58 | 59 | {myProfile !== null ? ( 60 | 61 | ) : ( 62 | <>No Data 63 | )} 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | {userEvents.length > 0 && ( 76 | 77 | )} 78 | 79 | 80 | {/* */} 81 | 82 | 83 | 84 | 85 | ) : ( 86 | 87 | )} 88 | 89 | ); 90 | } 91 | -------------------------------------------------------------------------------- /src/components/ProfileEvents.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Button, Card, Grid, Typography } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(() => ({ 6 | root: { 7 | background: '#CCD2E3', 8 | borderRadius: '20px', 9 | padding: '19px', 10 | color: '#291757', 11 | fontFamily: 'Montserrat', 12 | marginBottom: '21px' 13 | }, 14 | topContainer: { 15 | display: 'flex', 16 | justifyContent: 'space-between', 17 | marginBottom: '21px' 18 | }, 19 | topText: { 20 | fontWeight: 'bold', 21 | fontSize: '24px', 22 | letterSpacing: '0.44px' 23 | }, 24 | event: { 25 | display: 'block', 26 | fontSize: '17px', 27 | marginBottom: '10px' 28 | }, 29 | eventText: { 30 | display: 'flex', 31 | fontWeight: 'bold', 32 | textAlign: 'center', 33 | alignItems: 'center', 34 | marginBottom: '10px', 35 | wordWrap: 'break-word' 36 | }, 37 | eventInfo: { 38 | display: 'block', 39 | fontSize: '10px', 40 | textAlign: 'left', 41 | marginLeft: '10px', 42 | letterSpacing: '0.44px' 43 | }, 44 | eventDate: { 45 | display: 'flex', 46 | textAlign: 'left', 47 | fontSize: '10px', 48 | marginRight: '12px', 49 | marginBottom: '5px' 50 | }, 51 | eventButton: { 52 | display: 'flex', 53 | textAlign: 'left', 54 | fontSize: '12px', 55 | background: '#291755', 56 | color: 'white', 57 | borderRadius: '5px', 58 | fontWeight: '800', 59 | padding: '1px 8px', 60 | letterSpacing: '0.44px' 61 | } 62 | })); 63 | 64 | function ProfileEvents({ userEvents }) { 65 | const classes = useStyles(); 66 | useEffect(() => {}, []); 67 | 68 | const handleClick = link => { 69 | if (link.length <= 0) return; 70 | const win = window.open(`${link}`, '_blank'); 71 | win.focus(); 72 | }; 73 | 74 | return ( 75 | 76 | 77 | 78 | 79 | Events 80 | 81 | 82 | 83 | 84 | {userEvents?.map((event, idx) => ( 85 | 86 | event 91 | 92 | {event.eventName} 93 | 94 | {event.date} 95 |
96 | {event.totalAttendees} RSVPs 97 | 98 | 112 | 113 | 114 | ))} 115 | 116 | 117 | ); 118 | } 119 | 120 | export default ProfileEvents; 121 | -------------------------------------------------------------------------------- /src/components/PublicProfile.js: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from 'react'; 2 | import { useSelector } from 'react-redux'; 3 | import { useHistory, useParams } from 'react-router'; 4 | import { makeStyles } from '@material-ui/styles'; 5 | import { firebase } from 'src/services/authService'; 6 | import Grid from '@material-ui/core/Grid'; 7 | import ProfileInfo from './ProfileInfo'; 8 | import CommitChart from './CommitChart'; 9 | import ProfileEvents from './ProfileEvents'; 10 | import ProjectsCarousel from './ProjectsCarousel'; 11 | import Loader from './Loader'; 12 | import Badge from './Badge'; 13 | import fb from 'firebase/app'; 14 | 15 | const useStyles = makeStyles(theme => ({ 16 | root: { 17 | color: '#291757', 18 | fontFamily: 'Montserrat', 19 | padding: '0px 100px', 20 | [theme.breakpoints.down('md')]: { 21 | padding: 0 22 | } 23 | } 24 | })); 25 | const PublicProfile = () => { 26 | const classes = useStyles(); 27 | const user = useSelector(state => state.account.user); 28 | const [myProfile, setMyProfile] = useState(null); 29 | const [userEvents, setUserEvents] = useState([]); 30 | const [loading, setLoading] = useState(true); 31 | const [profileType] = useState('public'); 32 | const { userID } = useParams(); 33 | const history = useHistory(); 34 | 35 | useEffect(() => { 36 | const fetchData = async () => { 37 | // if (user === undefined) return; 38 | if (fb.apps.length) { 39 | const db = await firebase.firestore(); 40 | const userRef = db.collection('users').doc(userID); 41 | 42 | userRef 43 | .get() 44 | .then(doc => { 45 | if (doc.exists) { 46 | const data = doc.data(); 47 | setMyProfile(data); 48 | setLoading(false); 49 | } else { 50 | history.push('/*'); 51 | return; 52 | } 53 | }) 54 | .catch(error => { 55 | console.log('Error getting document:', error); 56 | }); 57 | 58 | // For getting user's upcoming events 59 | db.collection('events') 60 | .where('createdBy', '==', `${userID}`) 61 | .limit(2) 62 | .get() 63 | .then(userEventCollection => { 64 | setUserEvents(userEventCollection.docs.map(doc => doc.data())); 65 | }); 66 | } 67 | }; 68 | fetchData(); 69 | }, [user, userID, history]); 70 | 71 | return ( 72 | <> 73 | {!loading ? ( 74 | 75 | 76 | {myProfile !== null ? ( 77 | 78 | ) : ( 79 | <>No Data 80 | )} 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | {userEvents.length > 0 && ( 93 | 94 | )} 95 | 96 | 97 | {/* */} 98 | 99 | 100 | 101 | 102 | ) : ( 103 | 104 | )} 105 | 106 | ); 107 | }; 108 | 109 | export default PublicProfile; 110 | -------------------------------------------------------------------------------- /src/components/Publications.js: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Card, Grid, Typography } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(() => ({ 6 | root: { 7 | background: '#CCD2E3', 8 | borderRadius: '20px', 9 | padding: '19px', 10 | color: '#291757', 11 | fontFamily: 'Montserrat', 12 | marginBottom: '21px', 13 | marginLeft: '21px' 14 | }, 15 | topContainer: { 16 | display: 'flex', 17 | justifyContent: 'space-between', 18 | marginBottom: '21px' 19 | }, 20 | topText: { 21 | fontWeight: 'bold', 22 | fontSize: '24px', 23 | letterSpacing: '0.44px' 24 | }, 25 | publication: { 26 | display: 'block', 27 | fontSize: '17px', 28 | marginBottom: '10px' 29 | }, 30 | pubText: { 31 | display: 'flex', 32 | fontWeight: 'bold', 33 | textAlign: 'left', 34 | alignItems: 'center', 35 | marginBottom: '10px', 36 | wordWrap: 'break-word' 37 | }, 38 | pubHeading: { 39 | display: 'block', 40 | fontSize: '14px', 41 | marginLeft: '10px' 42 | }, 43 | pubRead: { 44 | display: 'flex', 45 | textAlign: 'left', 46 | fontSize: '12px', 47 | marginRight: '12px' 48 | }, 49 | pubDate: { 50 | display: 'flex', 51 | textAlign: 'left', 52 | fontSize: '12px' 53 | } 54 | })); 55 | 56 | function Publications() { 57 | const classes = useStyles(); 58 | useEffect(() => {}, []); 59 | return ( 60 | 61 | 62 | 63 | 64 | Publications 65 | 66 | 67 | 68 | {/* sample blog posts */} 69 | 70 | 71 | publication 76 | 77 | 78 | Blog Title 79 | 80 |
81 | 82 | 2 MIN 83 | 84 | 85 | • 86 |  16 Jan 87 | 88 |
89 | 90 | 91 | 92 | publication 97 | 98 | 99 | Blog Title 100 | 101 |
102 | 103 | 2 MIN 104 | 105 | 106 | • 107 |  16 Jan 108 | 109 |
110 | 111 | 112 | 113 | publication 118 | 119 | 120 | Blog Title 121 | 122 |
123 | 124 | 2 MIN 125 | 126 | 127 | • 128 |  16 Jan 129 | 130 |
131 | 132 | 133 | 134 | 135 | ); 136 | } 137 | 138 | export default Publications; 139 | -------------------------------------------------------------------------------- /src/components/ScrollReset.js: -------------------------------------------------------------------------------- 1 | import { useEffect } from 'react'; 2 | import { useLocation } from 'react-router'; 3 | 4 | function ScrollReset() { 5 | const location = useLocation(); 6 | 7 | useEffect(() => { 8 | window.scrollTo(0, 0); 9 | }, [location.pathname]); 10 | 11 | return null; 12 | } 13 | 14 | export default ScrollReset; 15 | -------------------------------------------------------------------------------- /src/components/Stats.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { makeStyles } from '@material-ui/core/styles'; 3 | 4 | const useStyles = makeStyles(theme => ({ 5 | heading: { 6 | color: '#291755', 7 | marginBottom: '10px' 8 | }, 9 | main: { 10 | display: 'flex', 11 | gap: '20px', 12 | justifyContent: 'space-between', 13 | width: '100%', 14 | [theme.breakpoints.down('xs')]: { 15 | flexDirection: 'column', 16 | alignItems: 'center' 17 | } 18 | }, 19 | box: { 20 | display: 'flex', 21 | height: '80px', 22 | width: '250px', 23 | backgroundColor: '#291755', 24 | color: 'white', 25 | borderRadius: '20px', 26 | padding: '20px', 27 | alignItems: 'center', 28 | position: 'relative', 29 | fontWeight: '500', 30 | fontSize: '20px', 31 | [theme.breakpoints.down('xs')]: { 32 | height: '70px' 33 | } 34 | }, 35 | circle: { 36 | display: 'flex', 37 | justifyContent: 'center', 38 | alignItems: 'center', 39 | height: '90px', 40 | width: '90px', 41 | borderRadius: '50%', 42 | backgroundColor: 'white', 43 | color: '#291755', 44 | position: 'absolute', 45 | border: '2px solid #291755', 46 | right: '-10px', 47 | fontWeight: '900', 48 | [theme.breakpoints.down('xs')]: { 49 | height: '85px', 50 | width: '85px' 51 | } 52 | } 53 | })); 54 | 55 | const Stats = ({ conducted, attending }) => { 56 | const classes = useStyles(); 57 | 58 | return ( 59 |
60 |

Statistics

61 |
62 |
63 |

64 | events 65 |
66 | conducted 67 |

68 |
{conducted}
69 |
70 |
71 |

72 | events 73 |
74 | attended 75 |

76 |
{attending}
77 |
78 |
79 |
80 | ); 81 | }; 82 | 83 | export default Stats; 84 | -------------------------------------------------------------------------------- /src/components/UserEventStats.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Box } from '@material-ui/core'; 3 | 4 | const UserEventStats = ({ conducted, attended }) => { 5 | const box = { 6 | display: 'flex', 7 | height: '80px', 8 | width: '250px', 9 | backgroundColor: '#291755', 10 | color: 'white', 11 | borderRadius: '20px', 12 | padding: '20px', 13 | alignItems: 'center', 14 | position: 'relative', 15 | fontWeight: '500', 16 | fontSize: '20px' 17 | }; 18 | 19 | const circle = { 20 | display: 'flex', 21 | justifyContent: 'center', 22 | alignItems: 'center', 23 | height: '90px', 24 | width: '90px', 25 | borderRadius: '50%', 26 | backgroundColor: 'white', 27 | color: '#291755', 28 | position: 'absolute', 29 | border: '2px solid #291755', 30 | right: '-10px', 31 | fontWeight: '900' 32 | }; 33 | 34 | return ( 35 | 43 | 44 |

45 | events 46 |
47 | conducted 48 |

49 |
{conducted}
50 | 51 | 52 |

53 | events 54 |
55 | attended 56 |

57 |
{attended}
58 | 59 | 60 | ); 61 | }; 62 | 63 | export default UserEventStats; 64 | -------------------------------------------------------------------------------- /src/components/UserNewEvents.js: -------------------------------------------------------------------------------- 1 | import React, { useState, useEffect } from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Button, Grid, Typography } from '@material-ui/core'; 4 | import { useSelector } from 'react-redux'; 5 | import { firebase } from 'src/services/authService'; 6 | import { useHistory } from 'react-router'; 7 | 8 | const useStyles = makeStyles(theme => ({ 9 | root: { 10 | color: '#291757', 11 | fontFamily: 'Montserrat', 12 | marginBottom: '21px', 13 | marginTop: '21px' 14 | }, 15 | topContainer: { 16 | width: '150%', 17 | display: 'flex', 18 | justifyContent: 'space-between', 19 | marginBottom: '10px' 20 | }, 21 | topText: { 22 | fontWeight: 'bold', 23 | fontSize: '24px', 24 | letterSpacing: '0.44px' 25 | }, 26 | bmEvents: { 27 | display: 'flex', 28 | fontSize: '17px', 29 | marginBottom: '10px', 30 | letterSpacing: '0.44px', 31 | [theme.breakpoints.down('xs')]: { 32 | justifyContent: 'space-evenly' 33 | } 34 | }, 35 | bmText: { 36 | display: 'flex', 37 | fontWeight: 'bold', 38 | alignItems: 'center', 39 | wordWrap: 'break-word', 40 | color: 'white', 41 | textAlign: 'center', 42 | backgroundImage: `url(${'./static/images/bmevents.png'})`, 43 | backgroundRepeat: 'no-repeat', 44 | borderRadius: '20px', 45 | width: '114px', 46 | height: '147px', 47 | marginRight: '16px', 48 | marginBottom: '16px' 49 | }, 50 | eventHeading: { 51 | overflow: 'hidden', 52 | textOverflow: 'ellipsis', 53 | display: '-webkit-box', 54 | WebkitLineClamp: 2, 55 | WebkitBoxOrient: 'vertical' 56 | }, 57 | checkOut: { 58 | borderRadius: '16px', 59 | color: '#291757', 60 | fontSize: '10px', 61 | margin: '0 auto', 62 | padding: '6px', 63 | fontWeight: '800' 64 | } 65 | })); 66 | 67 | function UserNewEvents() { 68 | const classes = useStyles(); 69 | const user = useSelector(state => state.account.user); 70 | const history = useHistory(); 71 | const [newEvents, setNewEvents] = useState([]); 72 | const [eventID, setEventID] = useState([]); 73 | 74 | useEffect(() => { 75 | const fetchLatestEvents = async () => { 76 | if (user === undefined) return; 77 | const db = firebase.firestore(); 78 | // Fetch Latest Events 79 | const newEventCollection = await db 80 | .collection('events') 81 | .orderBy('createdOn') 82 | .limit(10) 83 | .get(); 84 | 85 | setNewEvents( 86 | newEventCollection.docs.map(doc => { 87 | setEventID(prevState => [...prevState, doc.id]); 88 | return doc.data(); 89 | }) 90 | ); 91 | }; 92 | fetchLatestEvents(); 93 | }, [user, history]); 94 | 95 | const handleClick = idx => { 96 | if (eventID.length <= 0) return; 97 | history.push(`/events/${eventID[idx]}`); 98 | }; 99 | 100 | return ( 101 |
102 | 103 | 104 | 105 | New Events 106 | 107 | 108 | 117 | 118 | 119 | 120 | 121 | {newEvents?.map((event, idx) => ( 122 | 123 | 135 | 140 | {event?.eventName} 141 | 142 |
143 | 144 | {event?.date} 145 | 146 | 147 | {event?.time} 148 | 149 |
150 | {eventID.length > 0 ? ( 151 | 162 | ) : ( 163 | '' 164 | )} 165 | 166 | 167 | ))} 168 | 169 |
170 | ); 171 | } 172 | 173 | export default UserNewEvents; 174 | -------------------------------------------------------------------------------- /src/components/UserUpcomingEvents.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { makeStyles } from '@material-ui/styles'; 3 | import { Button, Card, Grid, Typography } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(() => ({ 6 | root: { 7 | background: '#CCD2E3', 8 | borderRadius: '20px', 9 | padding: '19px', 10 | color: '#291757', 11 | fontFamily: 'Montserrat', 12 | marginBottom: '21px', 13 | marginLeft: '21px' 14 | }, 15 | topContainer: { 16 | display: 'flex', 17 | marginBottom: '21px' 18 | }, 19 | topText: { 20 | fontWeight: 'bold', 21 | fontSize: '20px', 22 | letterSpacing: '0.44px' 23 | }, 24 | event: { 25 | display: 'block', 26 | fontSize: '17px', 27 | marginBottom: '10px' 28 | }, 29 | eventText: { 30 | display: 'flex', 31 | fontWeight: 'bold', 32 | alignItems: 'center', 33 | marginBottom: '10px', 34 | wordWrap: 'break-word' 35 | }, 36 | eventInfo: { 37 | display: 'block', 38 | fontSize: '10px', 39 | marginLeft: '10px', 40 | letterSpacing: '0.44px' 41 | }, 42 | eventDate: { 43 | display: 'flex', 44 | textAlign: 'left', 45 | fontSize: '10px', 46 | marginRight: '12px', 47 | marginBottom: '5px' 48 | }, 49 | button: { 50 | display: 'flex', 51 | textAlign: 'left', 52 | fontSize: '12px', 53 | background: 'white', 54 | borderRadius: '5px', 55 | fontWeight: '800', 56 | padding: '1px 8px', 57 | letterSpacing: '0.44px' 58 | } 59 | })); 60 | 61 | function UserUpcomingEvents({ userEvents }) { 62 | const classes = useStyles(); 63 | 64 | return ( 65 | 66 | 67 | 68 | 69 | Your Upcoming Events 70 | 71 | 72 | 73 | {userEvents.map((event, idx) => ( 74 | 75 | 76 | event 81 | 82 | {event.eventName} 83 |
84 | 85 | {event.date} 86 | {`, Time: (${event.time})`} 87 | 88 |
89 | 96 | 97 | 98 | 99 | ))} 100 | 101 | ); 102 | } 103 | 104 | export default UserUpcomingEvents; 105 | -------------------------------------------------------------------------------- /src/components/auth/Auth.js: -------------------------------------------------------------------------------- 1 | import { useEffect } from 'react'; 2 | import { useDispatch } from 'react-redux'; 3 | import PropTypes from 'prop-types'; 4 | import { setUserData, logout } from 'src/actions/accountActions'; 5 | import authService from 'src/services/authService'; 6 | 7 | function Auth({ children }) { 8 | const dispatch = useDispatch(); 9 | 10 | useEffect(() => { 11 | const initAuth = async () => { 12 | authService.setAxiosInterceptors({ 13 | onLogout: () => dispatch(logout()) 14 | }); 15 | 16 | authService.handleAuthentication(); 17 | authService.firebase.auth().onAuthStateChanged(user => { 18 | if (user) { 19 | const userItems = JSON.stringify({ 20 | displayName: user.displayName, 21 | photoURL: user.photoURL, 22 | uid: user.uid 23 | }); 24 | localStorage.setItem('causefolioUser', userItems); 25 | } else { 26 | localStorage.setItem('causefolioUser', user); 27 | } 28 | dispatch(setUserData(user)); 29 | user.getIdToken().then(token => { 30 | authService.setSession(token); 31 | }); 32 | }); 33 | }; 34 | initAuth(); 35 | }, [dispatch]); 36 | 37 | return children; 38 | } 39 | 40 | Auth.propTypes = { 41 | children: PropTypes.any 42 | }; 43 | 44 | export default Auth; 45 | -------------------------------------------------------------------------------- /src/components/auth/AuthGuard.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Redirect } from 'react-router-dom'; 3 | import PropTypes from 'prop-types'; 4 | import { getLoggedUser } from 'src/services/authService'; 5 | 6 | function AuthGuard({ children }) { 7 | const user = getLoggedUser(); 8 | 9 | if (!user) { 10 | return ; 11 | } 12 | 13 | return children; 14 | } 15 | 16 | AuthGuard.propTypes = { 17 | children: PropTypes.any 18 | }; 19 | 20 | export default AuthGuard; 21 | -------------------------------------------------------------------------------- /src/components/auth/AuthRoute.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { useSelector } from 'react-redux'; 3 | import { Redirect } from 'react-router-dom'; 4 | import PropTypes from 'prop-types'; 5 | 6 | function AuthRoute({ component: Component, render, ...rest }) { 7 | const account = useSelector(state => state.account); 8 | 9 | if (!account.user) { 10 | return ; 11 | } 12 | 13 | return render ? render({ ...rest }) : ; 14 | } 15 | 16 | AuthRoute.propTypes = { 17 | component: PropTypes.any, 18 | render: PropTypes.func 19 | }; 20 | 21 | export default AuthRoute; 22 | -------------------------------------------------------------------------------- /src/components/dashboard.js: -------------------------------------------------------------------------------- 1 | import { Box, Grid } from '@material-ui/core'; 2 | import { makeStyles } from '@material-ui/core/styles'; 3 | import React, { useEffect, useState } from 'react'; 4 | import { useSelector } from 'react-redux'; 5 | import DrawerLayout from 'src/layouts/DrawerLayout'; 6 | import { firebase } from 'src/services/authService'; 7 | import BookmarkedEvents from './BookmarkedEvents'; 8 | import Calendar from './Calendar'; 9 | import Loader from './Loader'; 10 | import NewEvents from './NewEvents'; 11 | // import Publications from './Publications'; 12 | import Stats from './Stats'; 13 | 14 | const useStyles = makeStyles(theme => ({ 15 | content: { 16 | flexGrow: 1, 17 | backgroundColor: theme.palette.background.default 18 | } 19 | })); 20 | 21 | export default function Dashboard() { 22 | const classes = useStyles(); 23 | const user = useSelector(state => state.account.user); 24 | const [userEvents, setUserEvents] = useState([]); 25 | const [loading, setLoading] = useState(true); 26 | const [attending, setAttending] = useState(0); 27 | 28 | useEffect(() => { 29 | const fetchUserEvents = async () => { 30 | if (user === undefined || user === null) return; 31 | const userId = user.uid; 32 | const db = firebase.firestore(); 33 | const userEventCollection = await db 34 | .collection('events') 35 | .where('createdBy', '==', `${userId}`) 36 | .get(); 37 | 38 | const userRef = await db.collection('users').doc(userId); 39 | userRef.get().then(doc => { 40 | if (doc.exists) { 41 | let data = doc.data(); 42 | setAttending(data.attending.length); 43 | } 44 | }); 45 | 46 | setUserEvents( 47 | userEventCollection.docs.map(doc => doc.data()), 48 | setLoading(false) 49 | ); 50 | }; 51 | fetchUserEvents(); 52 | }, [user]); 53 | 54 | return ( 55 | 56 | {!loading ? ( 57 |
58 | 59 | {/* */} 60 | 61 | 62 | {userEvents.length > 0 && } 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | {/* */} 71 | 72 | 73 | {/* */} 74 | 75 |
76 | ) : ( 77 | 78 | )} 79 | 80 | ); 81 | } 82 | -------------------------------------------------------------------------------- /src/components/search.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { 3 | Box, 4 | Button, 5 | makeStyles, 6 | TextField, 7 | Typography 8 | } from '@material-ui/core'; 9 | 10 | const useStyles = makeStyles(() => ({ 11 | search: { 12 | width: '99px', 13 | backgroundColor: '#291757', 14 | borderRadius: '20px', 15 | marginLeft: '16px', 16 | marginTop: 12, 17 | marginBottom: 16 18 | }, 19 | textField: { 20 | marginBottom: '16px', 21 | marginTop: '8px', 22 | backgroundColor: '#CCD2E3', 23 | borderRadius: '20px', 24 | borderBlockColor: 'green', 25 | borderColor: 'green', 26 | '& .MuiOutlinedInput-notchedOutline': { 27 | borderColor: '#F2F7FF', 28 | borderRadius: '20px' 29 | } 30 | } 31 | })); 32 | 33 | export default function SearchBar() { 34 | const classes = useStyles(); 35 | 36 | return ( 37 | 38 | 39 | 40 | 41 | 44 | 45 | ); 46 | } 47 | -------------------------------------------------------------------------------- /src/config/index.js: -------------------------------------------------------------------------------- 1 | // or get from process.env.REACT_APP_{var} to handle PROD and DEV environments 2 | export const APP_VERSION = '2.0.0'; 3 | export const API_BASE_URL = '/api'; 4 | export const ENABLE_REDUX_LOGGER = false; 5 | 6 | export default {}; 7 | -------------------------------------------------------------------------------- /src/constants/index.js: -------------------------------------------------------------------------------- 1 | export const THEMES = { 2 | LIGHT: 'LIGHT', 3 | ONE_DARK: 'ONE_DARK', 4 | UNICORN: 'UNICORN' 5 | }; 6 | -------------------------------------------------------------------------------- /src/context/SettingsContext.js: -------------------------------------------------------------------------------- 1 | import React, { createContext, useState, useEffect } from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import _ from 'lodash'; 4 | import { THEMES } from 'src/constants'; 5 | import { storeSettings } from 'src/utils/settings'; 6 | 7 | const SettingsContext = createContext(); 8 | 9 | const defaultSettings = { 10 | direction: 'ltr', 11 | responsiveFontSizes: true, 12 | theme: THEMES.LIGHT 13 | }; 14 | 15 | export function SettingsProvider({ settings, children }) { 16 | const [currentSettings, setCurrentSettings] = useState( 17 | settings || defaultSettings 18 | ); 19 | 20 | const handleSaveSettings = (updatedSettings = {}) => { 21 | const mergedSettings = _.merge({}, currentSettings, updatedSettings); 22 | 23 | setCurrentSettings(mergedSettings); 24 | storeSettings(mergedSettings); 25 | }; 26 | 27 | useEffect(() => { 28 | document.dir = currentSettings.direction; 29 | }, [currentSettings]); 30 | 31 | return ( 32 | 38 | {children} 39 | 40 | ); 41 | } 42 | 43 | SettingsProvider.propTypes = { 44 | children: PropTypes.node.isRequired, 45 | settings: PropTypes.object 46 | }; 47 | 48 | export const SettingsConsumer = SettingsContext.Consumer; 49 | 50 | export default SettingsContext; 51 | -------------------------------------------------------------------------------- /src/data/CourseFeatures.js: -------------------------------------------------------------------------------- 1 | export const features = { 2 | primary: [ 3 | { 4 | line1: 'Limited', 5 | line2: 'batch Size', 6 | image: '/static/images/courses/features/oneonone.png' 7 | }, 8 | { 9 | line1: 'Quik Doubt ', 10 | line2: 'Resolution', 11 | image: '/static/images/courses/features/doubts.png' 12 | }, 13 | 14 | { 15 | line1: '60+ Hours', 16 | line2: 'Live Lectures', 17 | image: '/static/images/courses/features/live-content.png' 18 | }, 19 | { 20 | line1: 'Industry Valued', 21 | line2: 'Certification', 22 | image: '/static/images/courses/features/certificate.png' 23 | }, 24 | { 25 | line1: '15+ Effective', 26 | line2: 'Projects', 27 | image: '/static/images/courses/features/projects.png' 28 | }, 29 | { 30 | line1: 'Post Lecture', 31 | line2: 'Recordings', 32 | image: '/static/images/courses/features/recording.png' 33 | } 34 | ] 35 | }; 36 | -------------------------------------------------------------------------------- /src/data/Members.js: -------------------------------------------------------------------------------- 1 | // mentors data---------------- 2 | 3 | export default members = { 4 | anuj: { 5 | name: 'Anuj Garg', 6 | position: 'Instructor', 7 | avatar: '/static/images/members/anuj.png', 8 | linkedin: 'https://www.linkedin.com/in/keenwarrior/' 9 | }, 10 | gaurav: { 11 | name: 'Gaurav Beriwal', 12 | position: 'Instructor', 13 | avatar: '/static/images/members/gaurav.png', 14 | linkedin: 'https://www.linkedin.com/in/gauravberiwal/' 15 | }, 16 | kunal: { 17 | name: 'Kunal Kushwaha', 18 | position: 'Instructor', 19 | avatar: '/static/images/members/kunal.png', 20 | linkedin: 'https://www.linkedin.com/in/kunal-kushwaha/' 21 | }, 22 | ganga: { 23 | name: 'Ganga Chaturvedi', 24 | avatar: '/static/images/members/ganga.png', 25 | position: 'Instructor', 26 | linkedin: 'https://www.linkedin.com/in/gangachatrvedi/' 27 | }, 28 | ekta: { 29 | name: 'Ekta Mishra', 30 | avatar: '/static/images/members/ekta.png', 31 | position: 'Instructor', 32 | linkedin: 'https://www.linkedin.com/in/darecoder/' 33 | }, 34 | bharat: { 35 | name: 'Bharat Kumar', 36 | position: 'Instructor', 37 | avatar: '/static/images/members/bharat.png', 38 | linkedin: 'https://www.linkedin.com/in/bharatbbhardwaj/' 39 | } 40 | }; 41 | -------------------------------------------------------------------------------- /src/data/recommendations.js: -------------------------------------------------------------------------------- 1 | export default recommendations = [ 2 | { 3 | id: '1', 4 | name: 'Gaganpreet Kaur Kalsi', 5 | avatar: '/static/reviews/students/GaganpreetKaurKalsi.png', 6 | text: 7 | 'It was a great time learning with you. You both were amazing. Really glad that I came to know about you and connect with you both. These people are amazing. Anybody wanting to learn should definitely approach them.' 8 | }, 9 | { 10 | id: '2', 11 | name: 'Aayush Kumar', 12 | avatar: '/static/reviews/students/AayushKumar.png', 13 | text: 14 | 'It was an amazing experience with Code for Cause.and the duo combination of anuj and kunal is like more than best. they will clear your each and every doubt, and the content was also super. Excited to join Code for Cause.' 15 | }, 16 | { 17 | id: '3', 18 | name: 'Sunidhi', 19 | avatar: '/static/reviews/students/Sunidhi.png', 20 | text: 21 | "Attended the 30 days 'ML Bootcamp' in python. It was PHENOMENAL! Hands-on implementation of cool projects, in such a detailed and fun manner - the whole Bootcamp was one-of-a-kind experience. Anuj bhaiya is lit!! " 22 | }, 23 | { 24 | id: '4', 25 | name: 'Shantanu Gupta', 26 | avatar: '/static/reviews/students/ShantanuGupta.png', 27 | text: 28 | "I really found my cause to do code. What's yours?? Ever wonder.. Anuj bhaiya is osm mentor for us, He helped a lot to clear all doubts in projects asa ML basics. Really supportive mentors, and all Team members." 29 | }, 30 | { 31 | id: '5', 32 | name: 'Aryan Tripathi', 33 | avatar: '/static/reviews/students/AryanTripathi.png', 34 | text: 35 | 'Code for Cause is the best platform to learn and grow together. Rarely does someone put this much effort in order to teach others.@anuj garg @kunal kushwaha @ekta mishra @ganga chaturvedi. Your efforts deserve to be appreciated.' 36 | }, 37 | { 38 | id: '9', 39 | name: 'Pinky Yadav', 40 | avatar: '/static/reviews/students/PinkyYadav.png', 41 | text: 42 | 'I have learn a lot in the bootcamp , the mentors were extremely helpful and dedicated , it was the great learning. each and every concept so clearly and you can ask as many doubts as you have.' 43 | }, 44 | { 45 | id: '6', 46 | name: 'Sayon Sai', 47 | avatar: '/static/reviews/students/SayonSai.png', 48 | text: 49 | 'Code for Cause provides the best Machine Learning / Deep Learning / DSA tutorials not available in any other platform. I totally recommend learning from Code for Cause.' 50 | }, 51 | { 52 | id: '7', 53 | name: 'Ritik Verma', 54 | avatar: '/static/reviews/students/RitikVerma.png', 55 | text: 56 | "It's a great place to learn and succeed and most importantly if you are someone who wants to contribute to the society it's the best place you can think of ." 57 | }, 58 | { 59 | id: '8', 60 | name: 'SreeLakshmi', 61 | avatar: '/static/reviews/students/SreeLakshmi.png', 62 | text: 63 | "The effort taken by the people in this community is worth appreciating. Trust me if I do some coding today, it's because of Code for Cause!" 64 | } 65 | ]; 66 | -------------------------------------------------------------------------------- /src/hooks/useIsMountedRef.js: -------------------------------------------------------------------------------- 1 | import { useRef, useEffect } from 'react'; 2 | 3 | export default function useIsMountedRef() { 4 | const isMounted = useRef(true); 5 | 6 | useEffect( 7 | () => () => { 8 | isMounted.current = false; 9 | }, 10 | [] 11 | ); 12 | 13 | return isMounted; 14 | } 15 | -------------------------------------------------------------------------------- /src/hooks/useSettings.js: -------------------------------------------------------------------------------- 1 | import { useContext } from 'react'; 2 | import SettingsContext from 'src/context/SettingsContext'; 3 | 4 | export default function useSettings() { 5 | const context = useContext(SettingsContext); 6 | 7 | return context; 8 | } 9 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import 'react-app-polyfill/ie11'; 2 | import 'react-app-polyfill/stable'; 3 | import 'react-perfect-scrollbar/dist/css/styles.css'; 4 | import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css'; 5 | import 'react-quill/dist/quill.snow.css'; 6 | import 'nprogress/nprogress.css'; 7 | import 'src/assets/css/prism.css'; 8 | import 'src/mixins/chartjs'; 9 | import 'src/mixins/prismjs'; 10 | import { enableES5 } from 'immer'; 11 | import React from 'react'; 12 | import ReactDOM from 'react-dom'; 13 | import { Provider } from 'react-redux'; 14 | import * as serviceWorker from 'src/serviceWorker'; 15 | import { SettingsProvider } from 'src/context/SettingsContext'; 16 | import { configureStore } from 'src/store'; 17 | import { restoreSettings } from 'src/utils/settings'; 18 | import App from 'src/App'; 19 | import { BrowserRouter } from 'react-router-dom'; 20 | 21 | enableES5(); 22 | 23 | const store = configureStore(); 24 | const settings = restoreSettings(); 25 | 26 | ReactDOM.render( 27 | 28 | 29 | 30 | 31 | 32 | 33 | , 34 | document.getElementById('root') 35 | ); 36 | 37 | serviceWorker.unregister(); 38 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/TopBar.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Link as RouterLink } from 'react-router-dom'; 3 | import { AppBar, Box, Toolbar, makeStyles } from '@material-ui/core'; 4 | import Logo from 'src/components/Logo'; 5 | 6 | const useStyles = makeStyles(theme => ({ 7 | root: { 8 | backgroundColor: theme.palette.background.default, 9 | color: theme.palette.text.primary, 10 | boxShadow: 'none', 11 | borderBottom: `1px solid ${theme.palette.divider}`, 12 | zIndex: theme.zIndex.drawer + 100, 13 | paddingLeft: 70, 14 | paddingRight: 70, 15 | [theme.breakpoints.down('md')]: { 16 | paddingLeft: 15, 17 | paddingRight: 15 18 | } 19 | }, 20 | toolbar: { 21 | height: 64 22 | }, 23 | link: { 24 | fontWeight: theme.typography.fontWeightMedium 25 | } 26 | })); 27 | 28 | function TopBar() { 29 | const classes = useStyles(); 30 | 31 | return ( 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | ); 41 | } 42 | 43 | export default TopBar; 44 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import { MDXProvider } from '@mdx-js/react'; 4 | import { Container, makeStyles } from '@material-ui/core'; 5 | import TopBar from './TopBar'; 6 | import components from './mdx'; 7 | 8 | const useStyles = makeStyles(theme => ({ 9 | wrapper: { 10 | backgroundColor: theme.palette.background.default, 11 | display: 'flex', 12 | height: '100%', 13 | overflow: 'hidden', 14 | paddingTop: 64, 15 | paddingLeft: 20, 16 | [theme.breakpoints.down('md')]: { 17 | paddingLeft: 5 18 | } 19 | }, 20 | contentContainer: { 21 | flex: '1 1 auto', 22 | overflow: 'auto' 23 | }, 24 | content: { 25 | paddingBottom: 120, 26 | paddingLeft: 70, 27 | paddingRight: 70, 28 | [theme.breakpoints.down('md')]: { 29 | paddingLeft: 15, 30 | paddingRight: 15 31 | } 32 | } 33 | })); 34 | 35 | function DocsLayout({ children }) { 36 | const classes = useStyles(); 37 | 38 | return ( 39 | <> 40 | 41 | 42 |
43 |
44 | 45 | {children} 46 | 47 |
48 |
49 | 50 | ); 51 | } 52 | 53 | DocsLayout.propTypes = { 54 | children: PropTypes.any 55 | }; 56 | 57 | export default DocsLayout; 58 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/Blockquote.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { makeStyles } from '@material-ui/core'; 3 | 4 | const useStyles = makeStyles(theme => ({ 5 | root: { 6 | paddingLeft: theme.spacing(2), 7 | paddingBottom: theme.spacing(1), 8 | paddingTop: theme.spacing(1), 9 | marginBottom: theme.spacing(2), 10 | borderLeft: `4px solid ${theme.palette.text.secondary}`, 11 | '& > p': { 12 | color: theme.palette.text.secondary, 13 | marginBottom: 0 14 | } 15 | } 16 | })); 17 | 18 | function Blockquote(props) { 19 | const classes = useStyles(); 20 | 21 | return
; 22 | } 23 | 24 | export default Blockquote; 25 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/Code.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import clsx from 'clsx'; 3 | import PropTypes from 'prop-types'; 4 | import { makeStyles } from '@material-ui/core'; 5 | 6 | const useStyles = makeStyles(() => ({ 7 | root: {} 8 | })); 9 | 10 | export default function Code({ className, ...rest }) { 11 | const classes = useStyles(); 12 | 13 | return ; 14 | } 15 | 16 | Code.propTypes = { 17 | className: PropTypes.string.isRequired 18 | }; 19 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/Heading.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import { Typography, makeStyles } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(theme => ({ 6 | h1: { 7 | marginTop: theme.spacing(6), 8 | marginBottom: theme.spacing(2) 9 | }, 10 | h2: { 11 | marginTop: theme.spacing(6), 12 | marginBottom: theme.spacing(2) 13 | }, 14 | h3: { 15 | marginTop: theme.spacing(6), 16 | marginBottom: theme.spacing(2) 17 | }, 18 | h4: { 19 | marginTop: theme.spacing(4), 20 | marginBottom: theme.spacing(2) 21 | }, 22 | h5: { 23 | marginTop: theme.spacing(2), 24 | marginBottom: theme.spacing(2) 25 | }, 26 | h6: { 27 | marginTop: theme.spacing(2), 28 | marginBottom: theme.spacing(2) 29 | } 30 | })); 31 | 32 | function Heading({ children, variant, ...rest }) { 33 | const classes = useStyles(); 34 | 35 | return ( 36 | 42 | {children} 43 | 44 | ); 45 | } 46 | 47 | Heading.propTypes = { 48 | children: PropTypes.any, 49 | variant: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']) 50 | }; 51 | 52 | export default Heading; 53 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/InlineCode.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { makeStyles } from '@material-ui/core'; 3 | 4 | const useStyles = makeStyles(() => ({ 5 | root: { 6 | paddingLeft: 2, 7 | paddingRight: 2, 8 | color: '#1a1a1a', 9 | fontFamily: 10 | "Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace", 11 | fontSize: 14, 12 | backgroundColor: 'rgb(255,229,100)' 13 | } 14 | })); 15 | 16 | function CodeInline(props) { 17 | const classes = useStyles(); 18 | 19 | return ; 20 | } 21 | 22 | export default CodeInline; 23 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/List.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import { makeStyles } from '@material-ui/core'; 4 | 5 | const useStyles = makeStyles(theme => ({ 6 | root: { 7 | marginLeft: theme.spacing(4), 8 | marginBottom: theme.spacing(2) 9 | } 10 | })); 11 | 12 | function List({ variant: Component, children, ...rest }) { 13 | const classes = useStyles(); 14 | 15 | return ( 16 | 17 | {children} 18 | 19 | ); 20 | } 21 | 22 | List.propTypes = { 23 | children: PropTypes.any, 24 | variant: PropTypes.oneOf(['ul', 'ol']) 25 | }; 26 | 27 | export default List; 28 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/ListItem.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Typography, makeStyles } from '@material-ui/core'; 3 | 4 | const useStyles = makeStyles(() => ({ 5 | root: {} 6 | })); 7 | 8 | function Paragraph(props) { 9 | const classes = useStyles(); 10 | 11 | return ( 12 | 19 | ); 20 | } 21 | 22 | export default Paragraph; 23 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/Paragraph.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Typography, makeStyles } from '@material-ui/core'; 3 | 4 | const useStyles = makeStyles(theme => ({ 5 | root: { 6 | marginBottom: theme.spacing(2), 7 | '& > a': { 8 | color: theme.palette.secondary.main 9 | } 10 | } 11 | })); 12 | 13 | function Paragraph(props) { 14 | const classes = useStyles(); 15 | 16 | return ( 17 | 23 | ); 24 | } 25 | 26 | export default Paragraph; 27 | -------------------------------------------------------------------------------- /src/layouts/DocsLayout/mdx/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Divider } from '@material-ui/core'; 3 | import Heading from './Heading'; 4 | import Paragraph from './Paragraph'; 5 | import List from './List'; 6 | import ListItem from './ListItem'; 7 | import Blockquote from './Blockquote'; 8 | import Code from './Code'; 9 | import InlineCode from './InlineCode'; 10 | 11 | const components = { 12 | h1: props => , 13 | h2: props => , 14 | h3: props => , 15 | h4: props => , 16 | h5: props => , 17 | h6: props => , 18 | ul: props => , 19 | ol: props => , 20 | hr: Divider, 21 | li: ListItem, 22 | p: Paragraph, 23 | blockquote: Blockquote, 24 | code: Code, 25 | inlineCode: InlineCode 26 | }; 27 | 28 | export default components; 29 | -------------------------------------------------------------------------------- /src/layouts/MainLayout/TopBar/Account.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { useSelector, useDispatch } from 'react-redux'; 3 | 4 | import PersonIcon from '@material-ui/icons/Person'; 5 | 6 | import { 7 | Typography, 8 | Dialog, 9 | Button, 10 | Box, 11 | Avatar, 12 | Menu, 13 | MenuItem, 14 | Hidden, 15 | CircularProgress, 16 | makeStyles 17 | } from '@material-ui/core'; 18 | import { login, dismissLogin, logout } from 'src/actions/accountActions'; 19 | import Login from 'src/components/Login'; 20 | 21 | const useStyles = makeStyles(() => ({ 22 | button: { 23 | minWidth: '120px' 24 | }, 25 | dialog: { 26 | '& .MuiDialog-paper': { 27 | borderRadius: '20px' 28 | } 29 | } 30 | })); 31 | 32 | function Account() { 33 | const user = useSelector(state => state.account.user); 34 | const loginFlag = useSelector(state => state.account.login); 35 | const [anchorEl, setAnchorEl] = React.useState(null); 36 | const dispatch = useDispatch(); 37 | const classes = useStyles(); 38 | 39 | const handleCloseMenu = () => { 40 | setAnchorEl(null); 41 | }; 42 | 43 | const handleLogout = () => { 44 | handleCloseMenu(); 45 | dispatch(logout()); 46 | dispatch(dismissLogin()); 47 | }; 48 | 49 | const handleClose = () => { 50 | dispatch(dismissLogin()); 51 | }; 52 | 53 | const handleLoginOpen = () => { 54 | dispatch(login()); 55 | }; 56 | 57 | const handleOpenMenu = event => { 58 | setAnchorEl(event.currentTarget); 59 | }; 60 | 61 | const truncate = input => { 62 | const first = input.split(' ')[0]; 63 | if (first.length > 13) { 64 | return `${first.substring(0, 10)}...`; 65 | } 66 | return first; 67 | }; 68 | 69 | return ( 70 |
78 |
85 | {user ? ( 86 | 95 | 102 | {user.photoURL ? ( 103 | avatar 110 | ) : ( 111 | 118 | )} 119 | 120 | 121 | 122 | 127 | {`Hello ${truncate(user.displayName)}`} 128 | 129 | 130 | 131 | 132 | ) : ( 133 | 151 | )} 152 | 153 | 160 | 161 | 162 | 163 | 170 | 177 | Logout 178 | 179 | 180 |
181 |
182 | ); 183 | } 184 | 185 | export default Account; 186 | -------------------------------------------------------------------------------- /src/layouts/MainLayout/TopBar/HeaderItems.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { HashLink as Link } from 'react-router-hash-link'; 3 | import { Box, Typography, makeStyles } from '@material-ui/core'; 4 | import clsx from 'clsx'; 5 | 6 | const useStyles = makeStyles(() => ({ 7 | root: {}, 8 | textStyle: { 9 | color: 'black', 10 | position: 'relative', 11 | fontColor: 'blue', 12 | display: 'flex', 13 | padding: ' 19px 19px', 14 | textDecoration: 'none', 15 | '&:hover': { 16 | position: 'relative', 17 | top: '2px', 18 | borderBottom: '4px solid #A60000' 19 | } 20 | }, 21 | activeCls: { 22 | position: 'relative', 23 | top: '2px', 24 | borderBottom: '4px solid #A60000' 25 | } 26 | })); 27 | 28 | const HeaderItem = ({ link, active }) => { 29 | const classes = useStyles(); 30 | return ( 31 | 32 | 41 | 42 | {/* {title} */} 43 | 44 | 45 | 46 | ); 47 | }; 48 | 49 | export default HeaderItem; 50 | -------------------------------------------------------------------------------- /src/layouts/MainLayout/TopBar/Item.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import HeaderItem from './HeaderItems'; 3 | 4 | // eslint-disable-next-line react/prop-types 5 | const Item = ({ title, link, active, ...props }) => ( 6 | <> 7 | 8 | 9 | ); 10 | 11 | export default Item; 12 | -------------------------------------------------------------------------------- /src/layouts/MainLayout/TopBar/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Link as RouterLink } from 'react-router-dom'; 3 | import PropTypes from 'prop-types'; 4 | import clsx from 'clsx'; 5 | import { 6 | AppBar, 7 | Box, 8 | Hidden, 9 | Toolbar, 10 | Typography, 11 | makeStyles 12 | } from '@material-ui/core'; 13 | import Logo from 'src/components/Logo'; 14 | import IconButton from '@material-ui/core/IconButton'; 15 | import MenuIcon from '@material-ui/icons/Menu'; 16 | import CloseIcon from '@material-ui/icons/Close'; 17 | import Drawer from '@material-ui/core/Drawer'; 18 | import List from '@material-ui/core/List'; 19 | import ListItem from '@material-ui/core/ListItem'; 20 | import { HashLink as Link } from 'react-router-hash-link'; 21 | import Account from './Account'; 22 | import Item from './Item'; 23 | 24 | const useStyles = makeStyles(theme => ({ 25 | root: { 26 | backgroundColor: '#291755', 27 | paddingLeft: 70, 28 | paddingRight: 70, 29 | [theme.breakpoints.down('md')]: { 30 | paddingLeft: 15, 31 | paddingRight: 15 32 | } 33 | }, 34 | toolbar: { 35 | minHeight: 64, 36 | maxHeight: 64 37 | }, 38 | menuButton: { 39 | float: 'right', 40 | color: '#000', 41 | marginRight: '0px' 42 | }, 43 | list: { 44 | width: '100% !important', 45 | display: 'flex', 46 | alignItems: 'center', 47 | justifyContent: 'center' 48 | }, 49 | textStyle: { 50 | textDecoration: 'none' 51 | } 52 | })); 53 | 54 | function TopBar({ className, /*onMobileNavOpen,*/ variant, ...rest }) { 55 | const classes = useStyles(); 56 | const [state, setState] = React.useState({ 57 | top: false, 58 | left: false, 59 | bottom: false, 60 | right: false 61 | }); 62 | 63 | const { pathname } = window.location; 64 | 65 | const navItems = [ 66 | // { title: 'Team', link: '/team' } 67 | ]; 68 | 69 | const toggleDrawer = (anchor, open) => event => { 70 | if ( 71 | event.type === 'keydown' && 72 | (event.key === 'Tab' || event.key === 'Shift') 73 | ) { 74 | return; 75 | } 76 | 77 | setState({ ...state, [anchor]: open }); 78 | }; 79 | 80 | const list = () => ( 81 |
87 | 88 | {navItems.map((item, index) => ( 89 | 90 | 96 | 97 | {item.title} 98 | 99 | 100 | 101 | ))} 102 | 103 |
104 | ); 105 | const headerMoblie = () => ( 106 |
107 | 111 | 112 | 113 | 114 | 121 | 122 | 123 | 124 |
125 | ); 126 | 127 | return ( 128 | 129 | 130 | 131 | 132 | 133 | 134 | 135 | {navItems.map(item => ( 136 | 142 | ))} 143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 156 | 157 | 158 | 164 | 165 | 166 | 167 | 173 | {headerMoblie()} 174 | {list()} 175 | 176 | 177 | 178 | 179 | ); 180 | } 181 | 182 | TopBar.propTypes = { 183 | className: PropTypes.string, 184 | onMobileNavOpen: PropTypes.func 185 | }; 186 | 187 | export default TopBar; 188 | -------------------------------------------------------------------------------- /src/layouts/MainLayout/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import { makeStyles } from '@material-ui/core'; 4 | import TopBar from './TopBar'; 5 | 6 | const useStyles = makeStyles(theme => ({ 7 | root: { 8 | backgroundColor: theme.palette.background.default, 9 | display: 'flex', 10 | height: '100%', 11 | overflow: 'hidden', 12 | width: '100%' 13 | }, 14 | wrapper: { 15 | display: 'flex', 16 | flex: '1 1 auto', 17 | overflow: 'hidden', 18 | paddingTop: 64 19 | }, 20 | contentContainer: { 21 | display: 'flex', 22 | flex: '1 1 auto', 23 | overflow: 'hidden' 24 | }, 25 | content: { 26 | flex: '1 1 auto', 27 | height: '100%', 28 | overflow: 'auto' 29 | } 30 | })); 31 | 32 | function MainLayout({ children }) { 33 | const classes = useStyles(); 34 | 35 | return ( 36 |
37 | 38 |
39 |
40 |
{children}
41 |
42 |
43 |
44 | ); 45 | } 46 | 47 | MainLayout.propTypes = { 48 | children: PropTypes.any 49 | }; 50 | 51 | export default MainLayout; 52 | -------------------------------------------------------------------------------- /src/mixins/prismjs.js: -------------------------------------------------------------------------------- 1 | import 'prismjs/prism'; 2 | import 'prismjs/components/prism-bash'; 3 | import 'prismjs/components/prism-css'; 4 | import 'prismjs/components/prism-diff'; 5 | import 'prismjs/components/prism-javascript'; 6 | import 'prismjs/components/prism-json'; 7 | import 'prismjs/components/prism-jsx'; 8 | import 'prismjs/components/prism-markup'; 9 | import 'prismjs/components/prism-sass'; 10 | import 'prismjs/components/prism-scss'; 11 | -------------------------------------------------------------------------------- /src/reducers/accountReducer.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-param-reassign */ 2 | import produce from 'immer'; 3 | import { 4 | LOGIN_REQUEST, 5 | DISMISS_LOGIN, 6 | LOGIN_SUCCESS, 7 | LOGIN_FAILURE, 8 | LOGOUT, 9 | SILENT_LOGIN, 10 | UPDATE_PROFILE 11 | } from 'src/actions/accountActions'; 12 | 13 | const initialState = { 14 | user: undefined, 15 | login: undefined 16 | }; 17 | 18 | const accountReducer = (state = initialState, action) => { 19 | switch (action.type) { 20 | case LOGIN_REQUEST: { 21 | return produce(state, draft => { 22 | draft.login = true; 23 | }); 24 | } 25 | 26 | case DISMISS_LOGIN: { 27 | return produce(state, draft => { 28 | draft.login = false; 29 | }); 30 | } 31 | 32 | case LOGIN_SUCCESS: { 33 | const { user } = action.payload; 34 | 35 | return produce(state, draft => { 36 | draft.user = user; 37 | }); 38 | } 39 | 40 | case LOGIN_FAILURE: { 41 | return produce(state, () => { 42 | // Maybe store error 43 | }); 44 | } 45 | 46 | case LOGOUT: { 47 | return produce(state, draft => { 48 | draft.user = null; 49 | }); 50 | } 51 | 52 | case SILENT_LOGIN: { 53 | const { user } = action.payload; 54 | 55 | return produce(state, draft => { 56 | draft.user = user; 57 | }); 58 | } 59 | 60 | case UPDATE_PROFILE: { 61 | const { user } = action.payload; 62 | 63 | return produce(state, draft => { 64 | draft.user = user; 65 | }); 66 | } 67 | 68 | default: { 69 | return state; 70 | } 71 | } 72 | }; 73 | 74 | export default accountReducer; 75 | -------------------------------------------------------------------------------- /src/reducers/index.js: -------------------------------------------------------------------------------- 1 | import { combineReducers } from 'redux'; 2 | import { reducer as formReducer } from 'redux-form'; 3 | import accountReducer from './accountReducer'; 4 | 5 | const rootReducer = combineReducers({ 6 | account: accountReducer, 7 | form: formReducer 8 | }); 9 | 10 | export default rootReducer; 11 | -------------------------------------------------------------------------------- /src/serviceWorker.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | // This optional code is used to register a service worker. 3 | // register() is not called by default. 4 | 5 | // This lets the app load faster on subsequent visits in projection, and gives 6 | // it offline capabilities. However, it also means that developers (and users) 7 | // will only see deployed updates on subsequent visits to a page, after all the 8 | // existing tabs open on the page have been closed, since previously cached 9 | // resources are updated in the background. 10 | 11 | // To learn more about the benefits of this model and instructions on how to 12 | // opt-in, read http://bit.ly/CRA-PWA 13 | 14 | const isLocalhost = Boolean( 15 | window.location.hostname === 'localhost' || 16 | // [::1] is the IPv6 localhost address. 17 | window.location.hostname === '[::1]' || 18 | // 127.0.0.1/8 is considered localhost for IPv4. 19 | window.location.hostname.match( 20 | /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ 21 | ) 22 | ); 23 | 24 | export function register(config) { 25 | if (process.env.NODE_ENV === 'projection' && 'serviceWorker' in navigator) { 26 | // The URL constructor is available in all browsers that support SW. 27 | const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href); 28 | if (publicUrl.origin !== window.location.origin) { 29 | // Our service worker won't work if PUBLIC_URL is on a different origin 30 | // from what our page is served on. This might happen if a CDN is used to 31 | // serve assets; see https://github.com/facebook/create-react-app/issues/2374 32 | return; 33 | } 34 | 35 | window.addEventListener('load', () => { 36 | const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; 37 | 38 | if (isLocalhost) { 39 | // This is running on localhost. Let's check if a service worker still exists or not. 40 | checkValidServiceWorker(swUrl, config); 41 | 42 | // Add some additional logging to localhost, pointing developers to the 43 | // service worker/PWA documentation. 44 | navigator.serviceWorker.ready.then(() => { 45 | console.log( 46 | 'This web app is being served cache-first by a service ' + 47 | 'worker. To learn more, visit http://bit.ly/CRA-PWA' 48 | ); 49 | }); 50 | } else { 51 | // Is not localhost. Just register service worker 52 | registerValidSW(swUrl, config); 53 | } 54 | }); 55 | } 56 | } 57 | 58 | function registerValidSW(swUrl, config) { 59 | navigator.serviceWorker 60 | .register(swUrl) 61 | .then(registration => { 62 | registration.onupdatefound = () => { 63 | const installingWorker = registration.installing; 64 | if (installingWorker == null) { 65 | return; 66 | } 67 | installingWorker.onstatechange = () => { 68 | if (installingWorker.state === 'installed') { 69 | if (navigator.serviceWorker.controller) { 70 | // At this point, the updated precached content has been fetched, 71 | // but the previous service worker will still serve the older 72 | // content until all client tabs are closed. 73 | console.log( 74 | 'New content is available and will be used when all ' + 75 | 'tabs for this page are closed. See http://bit.ly/CRA-PWA.' 76 | ); 77 | 78 | // Execute callback 79 | if (config && config.onUpdate) { 80 | config.onUpdate(registration); 81 | } 82 | } else { 83 | // At this point, everything has been precached. 84 | // It's the perfect time to display a 85 | // "Content is cached for offline use." message. 86 | console.log('Content is cached for offline use.'); 87 | 88 | // Execute callback 89 | if (config && config.onSuccess) { 90 | config.onSuccess(registration); 91 | } 92 | } 93 | } 94 | }; 95 | }; 96 | }) 97 | .catch(error => { 98 | console.error('Error during service worker registration:', error); 99 | }); 100 | } 101 | 102 | function checkValidServiceWorker(swUrl, config) { 103 | // Check if the service worker can be found. If it can't reload the page. 104 | fetch(swUrl) 105 | .then(response => { 106 | // Ensure service worker exists, and that we really are getting a JS file. 107 | const contentType = response.headers.get('content-type'); 108 | if ( 109 | response.status === 404 || 110 | (contentType != null && contentType.indexOf('javascript') === -1) 111 | ) { 112 | // No service worker found. Probably a different app. Reload the page. 113 | navigator.serviceWorker.ready.then(registration => { 114 | registration.unregister().then(() => { 115 | window.location.reload(); 116 | }); 117 | }); 118 | } else { 119 | // Service worker found. Proceed as normal. 120 | registerValidSW(swUrl, config); 121 | } 122 | }) 123 | .catch(() => { 124 | console.log( 125 | 'No internet connection found. App is running in offline mode.' 126 | ); 127 | }); 128 | } 129 | 130 | export function unregister() { 131 | if ('serviceWorker' in navigator) { 132 | navigator.serviceWorker.ready.then(registration => { 133 | registration.unregister(); 134 | }); 135 | } 136 | } 137 | -------------------------------------------------------------------------------- /src/services/authService.js: -------------------------------------------------------------------------------- 1 | import jwtDecode from 'jwt-decode'; 2 | import axios from 'src/utils/axios'; 3 | 4 | import firebase from 'firebase'; 5 | require('firebase/auth'); 6 | 7 | class AuthService { 8 | // Configure Firebase. 9 | config = { 10 | apiKey: 'AIzaSyBogaqI7q74Wml7AD90VVm_89o1cgFFQCo', 11 | authDomain: 'code-for-cause-leaders.firebaseapp.com', 12 | projectId: 'code-for-cause-leaders', 13 | storageBucket: 'code-for-cause-leaders.appspot.com', 14 | messagingSenderId: '58409560329', 15 | appId: '1:58409560329:web:60ffc3c128d3b155a18bd8', 16 | measurementId: 'G-49RJ8QM95E' 17 | // ... 18 | }; 19 | 20 | // Configure FirebaseUI. 21 | uiConfig = { 22 | // Popup signin flow rather than redirect flow. 23 | signInFlow: 'popup', 24 | signInOptions: [firebase.auth.GoogleAuthProvider.PROVIDER_ID], 25 | callbacks: { 26 | // Avoid redirects after sign-in. 27 | signInSuccessWithAuthResult: () => false 28 | } 29 | }; 30 | 31 | firebase = firebase; 32 | 33 | user = {}; 34 | 35 | setAxiosInterceptors = ({ onLogout }) => { 36 | axios.interceptors.response.use( 37 | response => response, 38 | error => { 39 | if (error.response && error.response.status === 401) { 40 | this.setSession(null); 41 | 42 | if (onLogout) { 43 | onLogout(); 44 | } 45 | } 46 | 47 | return Promise.reject(error); 48 | } 49 | ); 50 | }; 51 | 52 | handleAuthentication() { 53 | this.firebase.initializeApp(this.config); 54 | } 55 | 56 | signInWithEmailAndPassword(email, password) { 57 | return this.firebase.auth().signInWithEmailAndPassword(email, password); 58 | } 59 | 60 | login = () => { 61 | this.keycloak.init().then(authenticated => { 62 | if (!authenticated) { 63 | this.keycloak.login(); 64 | } 65 | }); 66 | }; 67 | 68 | loginInWithToken = () => 69 | new Promise((resolve, reject) => { 70 | axios 71 | .get('/api/account/me') 72 | .then(response => { 73 | if (response.data.user) { 74 | resolve(response.data.user); 75 | } else { 76 | reject(response.data.error); 77 | } 78 | }) 79 | .catch(error => { 80 | reject(error); 81 | }); 82 | }); 83 | 84 | logout = () => { 85 | this.firebase.auth().signOut(); 86 | this.setSession(null); 87 | }; 88 | 89 | setSession = accessToken => { 90 | if (accessToken) { 91 | localStorage.setItem('accessToken', accessToken); 92 | axios.defaults.headers.common.Authorization = `Bearer ${accessToken}`; 93 | } else { 94 | localStorage.removeItem('accessToken'); 95 | delete axios.defaults.headers.common.Authorization; 96 | } 97 | }; 98 | 99 | getAccessToken = () => localStorage.getItem('accessToken'); 100 | 101 | isValidToken = accessToken => { 102 | if (!accessToken) { 103 | return false; 104 | } 105 | 106 | const decoded = jwtDecode(accessToken); 107 | const currentTime = Date.now() / 1000; 108 | 109 | return decoded.exp > currentTime; 110 | }; 111 | 112 | isAuthenticated = () => !!this.keycloak.authenticated; 113 | } 114 | 115 | const authService = new AuthService(); 116 | 117 | export default authService; 118 | export { firebase }; 119 | 120 | export const signInWithGoogle = () => { 121 | const provider = new firebase.auth.GoogleAuthProvider(); 122 | provider.setCustomParameters({ prompt: 'select_account' }); 123 | return firebase.auth().signInWithPopup(provider); 124 | }; 125 | 126 | export const getLoggedUser = () => { 127 | return JSON.parse(localStorage.getItem('causefolioUser')); 128 | }; 129 | -------------------------------------------------------------------------------- /src/store/index.js: -------------------------------------------------------------------------------- 1 | import { applyMiddleware, createStore, compose } from 'redux'; 2 | import thunkMiddleware from 'redux-thunk'; 3 | import { composeWithDevTools } from 'redux-devtools-extension'; 4 | import { createLogger } from 'redux-logger'; 5 | import rootReducer from 'src/reducers'; 6 | import { ENABLE_REDUX_LOGGER } from 'src/config'; 7 | 8 | const loggerMiddleware = createLogger(); 9 | 10 | export function configureStore(preloadedState = {}) { 11 | const middlewares = [thunkMiddleware]; 12 | 13 | if (ENABLE_REDUX_LOGGER) { 14 | middlewares.push(loggerMiddleware); 15 | } 16 | 17 | const middlewareEnhancer = composeWithDevTools( 18 | applyMiddleware(...middlewares) 19 | ); 20 | 21 | const enhancers = [middlewareEnhancer]; 22 | const composedEnhancers = compose(...enhancers); 23 | 24 | const store = createStore(rootReducer, preloadedState, composedEnhancers); 25 | 26 | return store; 27 | } 28 | -------------------------------------------------------------------------------- /src/theme/index.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-console */ 2 | import _ from 'lodash'; 3 | import { colors, createMuiTheme, responsiveFontSizes } from '@material-ui/core'; 4 | import typography from './typography'; 5 | import { softShadows } from './shadows'; 6 | import { THEMES } from '../constants'; 7 | 8 | const baseConfig = { 9 | direction: 'ltr', 10 | typography, 11 | overrides: { 12 | MuiLinearProgress: { 13 | root: { 14 | borderRadius: 3, 15 | overflow: 'hidden' 16 | } 17 | }, 18 | MuiListItemIcon: { 19 | root: { 20 | minWidth: 32 21 | } 22 | }, 23 | MuiChip: { 24 | root: { 25 | backgroundColor: 'rgba(0,0,0,0.075)' 26 | } 27 | }, 28 | MuiButton: { 29 | root: { 30 | '&:hover': { 31 | backgroundColor: '#150934' 32 | } 33 | } 34 | } 35 | } 36 | }; 37 | 38 | const themeConfigs = [ 39 | { 40 | name: THEMES.LIGHT, 41 | overrides: { 42 | MuiInputBase: { 43 | input: { 44 | '&::placeholder': { 45 | opacity: 1, 46 | color: colors.blueGrey[600] 47 | } 48 | } 49 | } 50 | }, 51 | palette: { 52 | type: 'light', 53 | action: { 54 | active: colors.blueGrey[600] // small icons 55 | }, 56 | background: { 57 | default: colors.common.white, 58 | dark: '#f4f6f8', 59 | paper: '#291757' 60 | }, 61 | primary: { 62 | main: colors.indigo[600], 63 | active: '#150934' // for header and loader 64 | }, 65 | secondary: { 66 | main: '#A60000' // for button and selected 67 | }, 68 | text: { 69 | // for text classes 70 | primary: colors.blueGrey[900], 71 | secondary: colors.common.white 72 | } 73 | }, 74 | shadows: softShadows 75 | } 76 | ]; 77 | 78 | export function createTheme(settings = {}) { 79 | let themeConfig = themeConfigs.find(theme => theme.name === settings.theme); 80 | 81 | if (!themeConfig) { 82 | console.warn(new Error(`The theme ${settings.theme} is not valid`)); 83 | [themeConfig] = themeConfigs; 84 | } 85 | 86 | let theme = createMuiTheme( 87 | _.merge({}, baseConfig, themeConfig, { direction: settings.direction }) 88 | ); 89 | 90 | if (settings.responsiveFontSizes) { 91 | theme = responsiveFontSizes(theme); 92 | } 93 | 94 | return theme; 95 | } 96 | -------------------------------------------------------------------------------- /src/theme/shadows.js: -------------------------------------------------------------------------------- 1 | export const softShadows = [ 2 | 'none', 3 | '0 0 0 1px rgba(63,63,68,0.05), 0 1px 2px 0 rgba(63,63,68,0.15)', 4 | '0 0 1px 0 rgba(0,0,0,0.31), 0 2px 2px -2px rgba(0,0,0,0.25)', 5 | '0 0 1px 0 rgba(0,0,0,0.31), 0 3px 4px -2px rgba(0,0,0,0.25)', 6 | '0 0 1px 0 rgba(0,0,0,0.31), 0 3px 4px -2px rgba(0,0,0,0.25)', 7 | '0 0 1px 0 rgba(0,0,0,0.31), 0 4px 6px -2px rgba(0,0,0,0.25)', 8 | '0 0 1px 0 rgba(0,0,0,0.31), 0 4px 6px -2px rgba(0,0,0,0.25)', 9 | '0 0 1px 0 rgba(0,0,0,0.31), 0 4px 8px -2px rgba(0,0,0,0.25)', 10 | '0 0 1px 0 rgba(0,0,0,0.31), 0 5px 8px -2px rgba(0,0,0,0.25)', 11 | '0 0 1px 0 rgba(0,0,0,0.31), 0 6px 12px -4px rgba(0,0,0,0.25)', 12 | '0 0 1px 0 rgba(0,0,0,0.31), 0 7px 12px -4px rgba(0,0,0,0.25)', 13 | '0 0 1px 0 rgba(0,0,0,0.31), 0 6px 16px -4px rgba(0,0,0,0.25)', 14 | '0 0 1px 0 rgba(0,0,0,0.31), 0 7px 16px -4px rgba(0,0,0,0.25)', 15 | '0 0 1px 0 rgba(0,0,0,0.31), 0 8px 18px -8px rgba(0,0,0,0.25)', 16 | '0 0 1px 0 rgba(0,0,0,0.31), 0 9px 18px -8px rgba(0,0,0,0.25)', 17 | '0 0 1px 0 rgba(0,0,0,0.31), 0 10px 20px -8px rgba(0,0,0,0.25)', 18 | '0 0 1px 0 rgba(0,0,0,0.31), 0 11px 20px -8px rgba(0,0,0,0.25)', 19 | '0 0 1px 0 rgba(0,0,0,0.31), 0 12px 22px -8px rgba(0,0,0,0.25)', 20 | '0 0 1px 0 rgba(0,0,0,0.31), 0 13px 22px -8px rgba(0,0,0,0.25)', 21 | '0 0 1px 0 rgba(0,0,0,0.31), 0 14px 24px -8px rgba(0,0,0,0.25)', 22 | '0 0 1px 0 rgba(0,0,0,0.31), 0 16px 28px -8px rgba(0,0,0,0.25)', 23 | '0 0 1px 0 rgba(0,0,0,0.31), 0 18px 30px -8px rgba(0,0,0,0.25)', 24 | '0 0 1px 0 rgba(0,0,0,0.31), 0 20px 32px -8px rgba(0,0,0,0.25)', 25 | '0 0 1px 0 rgba(0,0,0,0.31), 0 22px 34px -8px rgba(0,0,0,0.25)', 26 | '0 0 1px 0 rgba(0,0,0,0.31), 0 24px 36px -8px rgba(0,0,0,0.25)' 27 | ]; 28 | 29 | export const strongShadows = [ 30 | 'none', 31 | '0 0 1px 0 rgba(0,0,0,0.70), 0 3px 4px -2px rgba(0,0,0,0.50)', 32 | '0 0 1px 0 rgba(0,0,0,0.70), 0 2px 2px -2px rgba(0,0,0,0.50)', 33 | '0 0 1px 0 rgba(0,0,0,0.70), 0 3px 4px -2px rgba(0,0,0,0.50)', 34 | '0 0 1px 0 rgba(0,0,0,0.70), 0 3px 4px -2px rgba(0,0,0,0.50)', 35 | '0 0 1px 0 rgba(0,0,0,0.70), 0 4px 6px -2px rgba(0,0,0,0.50)', 36 | '0 0 1px 0 rgba(0,0,0,0.70), 0 4px 6px -2px rgba(0,0,0,0.50)', 37 | '0 0 1px 0 rgba(0,0,0,0.70), 0 4px 8px -2px rgba(0,0,0,0.50)', 38 | '0 0 1px 0 rgba(0,0,0,0.70), 0 5px 8px -2px rgba(0,0,0,0.50)', 39 | '0 0 1px 0 rgba(0,0,0,0.70), 0 6px 12px -4px rgba(0,0,0,0.50)', 40 | '0 0 1px 0 rgba(0,0,0,0.70), 0 7px 12px -4px rgba(0,0,0,0.50)', 41 | '0 0 1px 0 rgba(0,0,0,0.70), 0 6px 16px -4px rgba(0,0,0,0.50)', 42 | '0 0 1px 0 rgba(0,0,0,0.70), 0 7px 16px -4px rgba(0,0,0,0.50)', 43 | '0 0 1px 0 rgba(0,0,0,0.70), 0 8px 18px -8px rgba(0,0,0,0.50)', 44 | '0 0 1px 0 rgba(0,0,0,0.70), 0 9px 18px -8px rgba(0,0,0,0.50)', 45 | '0 0 1px 0 rgba(0,0,0,0.70), 0 10px 20px -8px rgba(0,0,0,0.50)', 46 | '0 0 1px 0 rgba(0,0,0,0.70), 0 11px 20px -8px rgba(0,0,0,0.50)', 47 | '0 0 1px 0 rgba(0,0,0,0.70), 0 12px 22px -8px rgba(0,0,0,0.50)', 48 | '0 0 1px 0 rgba(0,0,0,0.70), 0 13px 22px -8px rgba(0,0,0,0.50)', 49 | '0 0 1px 0 rgba(0,0,0,0.70), 0 14px 24px -8px rgba(0,0,0,0.50)', 50 | '0 0 1px 0 rgba(0,0,0,0.70), 0 16px 28px -8px rgba(0,0,0,0.50)', 51 | '0 0 1px 0 rgba(0,0,0,0.70), 0 18px 30px -8px rgba(0,0,0,0.50)', 52 | '0 0 1px 0 rgba(0,0,0,0.70), 0 20px 32px -8px rgba(0,0,0,0.50)', 53 | '0 0 1px 0 rgba(0,0,0,0.70), 0 22px 34px -8px rgba(0,0,0,0.50)', 54 | '0 0 1px 0 rgba(0,0,0,0.70), 0 24px 36px -8px rgba(0,0,0,0.50)' 55 | ]; 56 | -------------------------------------------------------------------------------- /src/theme/typography.js: -------------------------------------------------------------------------------- 1 | export default { 2 | fontFamily: ['"Montserrat"'].join(','), 3 | 4 | h1: { 5 | fontWeight: 500, 6 | fontSize: 35, 7 | letterSpacing: '-0.24px' 8 | }, 9 | h2: { 10 | fontWeight: 500, 11 | fontSize: 29, 12 | letterSpacing: '-0.24px' 13 | }, 14 | h3: { 15 | fontWeight: 500, 16 | fontSize: 24, 17 | letterSpacing: '-0.06px' 18 | }, 19 | h4: { 20 | fontWeight: 500, 21 | fontSize: 20, 22 | letterSpacing: '-0.06px' 23 | }, 24 | h5: { 25 | fontWeight: 600, 26 | fontSize: 16, 27 | letterSpacing: '-0.05px' 28 | }, 29 | h6: { 30 | fontWeight: 600, 31 | fontSize: 14, 32 | letterSpacing: '-0.05px' 33 | }, 34 | overline: { 35 | fontWeight: 500 36 | } 37 | }; 38 | -------------------------------------------------------------------------------- /src/utils/analytics.js: -------------------------------------------------------------------------------- 1 | function track(...args) { 2 | if (process.env.NODE_ENV !== 'production') { 3 | return; 4 | } 5 | 6 | if (!window.gtag) { 7 | return; 8 | } 9 | 10 | window.gtag(...args); 11 | } 12 | 13 | function pageview(props) { 14 | track('config', process.env.REACT_APP_GA_MEASUREMENT_ID, props); 15 | } 16 | 17 | function event(type, props) { 18 | track('event', type, props); 19 | } 20 | 21 | export default { 22 | pageview, 23 | event 24 | }; 25 | -------------------------------------------------------------------------------- /src/utils/axios.js: -------------------------------------------------------------------------------- 1 | import axios from 'axios'; 2 | 3 | const instance = axios.create(); 4 | 5 | export default instance; 6 | -------------------------------------------------------------------------------- /src/utils/bytesToSize.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable no-restricted-properties */ 2 | export default (bytes, decimals = 2) => { 3 | if (bytes === 0) return '0 Bytes'; 4 | 5 | const k = 1024; 6 | const dm = decimals < 0 ? 0 : decimals; 7 | const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']; 8 | 9 | const i = Math.floor(Math.log(bytes) / Math.log(k)); 10 | 11 | return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`; 12 | }; 13 | -------------------------------------------------------------------------------- /src/utils/getInitials.js: -------------------------------------------------------------------------------- 1 | export default (name = '') => 2 | name 3 | .replace(/\s+/, ' ') 4 | .split(' ') 5 | .slice(0, 2) 6 | .map(v => v && v[0].toUpperCase()) 7 | .join(''); 8 | -------------------------------------------------------------------------------- /src/utils/mock.js: -------------------------------------------------------------------------------- 1 | import AxiosMockAdapter from 'axios-mock-adapter'; 2 | import axios from './axios'; 3 | 4 | const instance = new AxiosMockAdapter(axios, { delayResponse: 0 }); 5 | 6 | export default instance; 7 | -------------------------------------------------------------------------------- /src/utils/objFromArray.js: -------------------------------------------------------------------------------- 1 | const objFromArray = (arr, key = 'id') => 2 | arr.reduce((accumulator, current) => { 3 | accumulator[current[key]] = current; 4 | return accumulator; 5 | }, {}); 6 | 7 | export default objFromArray; 8 | -------------------------------------------------------------------------------- /src/utils/settings.js: -------------------------------------------------------------------------------- 1 | export function restoreSettings() { 2 | let settings = null; 3 | 4 | try { 5 | const storedData = localStorage.getItem('settings'); 6 | 7 | if (storedData) { 8 | settings = JSON.parse(storedData); 9 | } 10 | } catch (err) { 11 | // If stored data is not a strigified JSON this might fail, 12 | // that's why we catch the error 13 | } 14 | 15 | return settings; 16 | } 17 | 18 | export function storeSettings(settings) { 19 | localStorage.setItem('settings', JSON.stringify(settings)); 20 | } 21 | -------------------------------------------------------------------------------- /src/utils/wait.js: -------------------------------------------------------------------------------- 1 | export const wait = time => new Promise(res => setTimeout(res, time)); 2 | 3 | export default wait; 4 | -------------------------------------------------------------------------------- /src/views/pages/Error404View.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import { Link as RouterLink } from 'react-router-dom'; 3 | import { 4 | Box, 5 | Button, 6 | Container, 7 | Typography, 8 | useTheme, 9 | useMediaQuery, 10 | makeStyles 11 | } from '@material-ui/core'; 12 | import Page from 'src/components/Page'; 13 | 14 | const useStyles = makeStyles(theme => ({ 15 | root: { 16 | backgroundColor: theme.palette.background.dark, 17 | minHeight: '100%', 18 | display: 'flex', 19 | alignItems: 'center', 20 | padding: theme.spacing(3), 21 | paddingTop: 80, 22 | paddingBottom: 80 23 | }, 24 | image: { 25 | maxWidth: '100%', 26 | width: 560, 27 | maxHeight: 300, 28 | height: 'auto' 29 | } 30 | })); 31 | 32 | function Error404View() { 33 | const classes = useStyles(); 34 | const theme = useTheme(); 35 | const mobileDevice = useMediaQuery(theme.breakpoints.down('sm')); 36 | 37 | return ( 38 | 39 | 40 | 45 | 404: The page you are looking for isn’t here 46 | 47 | 48 | You either tried some shady route or you came here by mistake. 49 | Whichever it is, try using the navigation. 50 | 51 | 52 | Under development 57 | 58 | 59 | 67 | 68 | 69 | 70 | ); 71 | } 72 | 73 | export default Error404View; 74 | -------------------------------------------------------------------------------- /src/views/pages/HomeView/LandingPage.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import PropTypes from 'prop-types'; 3 | import clsx from 'clsx'; 4 | import ArrowForwardOutlinedIcon from '@material-ui/icons/ArrowForwardOutlined'; 5 | import { 6 | Box, 7 | Grid, 8 | Typography, 9 | makeStyles, 10 | Button, 11 | AppBar 12 | } from '@material-ui/core'; 13 | import TopBar from 'src/layouts/MainLayout/TopBar'; 14 | import HomeView from '.'; 15 | import { HashLink } from 'react-router-hash-link'; 16 | 17 | const useStyles = makeStyles(theme => ({ 18 | root: { 19 | backgroundColor: '#FFF', 20 | height: '100vh', 21 | color: '#000', 22 | overflow: 'hidden', 23 | [theme.breakpoints.down('md')]: { 24 | paddingTop: 0, 25 | paddingBottom: 0 26 | } 27 | }, 28 | extraPadding: { 29 | [theme.breakpoints.down('sm')]: { 30 | padding: '0 30px' 31 | }, 32 | textAlign: 'justify' 33 | }, 34 | image: { 35 | perspectiveOrigin: 'left center', 36 | transformStyle: 'preserve-3d', 37 | perspective: 1500, 38 | width: '60vh', 39 | display: 'flex', 40 | '& > img': { 41 | maxWidth: '100%', 42 | backfaceVisibility: 'hidden' 43 | }, 44 | [theme.breakpoints.down('sm')]: { 45 | maxWidth: '40vh' 46 | } 47 | }, 48 | hide: { 49 | display: 'none' 50 | }, 51 | Button: { 52 | textTransform: 'capitalize' 53 | }, 54 | container: { 55 | paddingTop: '10vh', 56 | margin: '0 5px', 57 | [theme.breakpoints.down('md')]: { 58 | minHeight: '87%' 59 | }, 60 | [theme.breakpoints.down('sm')]: { 61 | margin: '0', 62 | paddingTop: '2vh', 63 | padding: '0 4vw', 64 | display: 'flex', 65 | justifyContent: 'center' 66 | } 67 | }, 68 | footer: { 69 | padding: 0, 70 | left: 0, 71 | bottom: 0, 72 | height: '30vh', 73 | [theme.breakpoints.down('sm')]: { 74 | height: '8vh' 75 | } 76 | } 77 | })); 78 | 79 | function LandingPage({ className, ...rest }) { 80 | const classes = useStyles(); 81 | return ( 82 | <> 83 |
84 | 85 | 86 | 87 |
88 | 96 | 105 | 111 | 115 | 116 | 117 | CauseFolio 118 |
Where Leaders Live 119 | 120 | 121 | 122 | 123 | A community driven event management platform where 124 |
community leaders showcase their real portfolio 125 | 126 | 127 | 128 | 129 | 142 | 143 | 144 | 145 | 146 | 147 | 153 |
154 | codeforcauseimg 159 |
160 | 161 | 162 | 163 | 164 | 165 | codeforcauseimg 172 | 173 | 174 |
175 |
176 |
179 | 180 | 181 | ); 182 | } 183 | 184 | LandingPage.propTypes = { 185 | className: PropTypes.string 186 | }; 187 | 188 | export default LandingPage; 189 | -------------------------------------------------------------------------------- /src/views/pages/HomeView/index.js: -------------------------------------------------------------------------------- 1 | import { makeStyles } from '@material-ui/core'; 2 | import React from 'react'; 3 | import Page from 'src/components/Page'; 4 | import Hero from './Hero'; 5 | import Footer from '../common/Footer'; 6 | const useStyles = makeStyles(() => ({ 7 | root: { 8 | backgroundColor: '#291755', 9 | overflowX: 'hidden', 10 | display: 'flex', 11 | flexDirection: 'column', 12 | minHeight: 'calc(100vh - 64px)' 13 | }, 14 | hero: { 15 | flexGrow: 1 16 | } 17 | })); 18 | 19 | function HomeView() { 20 | const classes = useStyles(); 21 | 22 | return ( 23 | 24 | 25 |