├── public ├── logo.png ├── robots.txt ├── manifest.json └── index.html ├── src ├── images │ └── ruler │ │ ├── ketu.png │ │ ├── mars.png │ │ ├── moon.png │ │ ├── rahu.png │ │ ├── sun.png │ │ ├── jupiter.png │ │ ├── mercury.png │ │ ├── saturn.png │ │ └── venus.png ├── setupTests.js ├── reportWebVitals.js ├── index.jsx ├── index.scss ├── Result.jsx ├── Result.scss ├── App.scss ├── table1.json ├── table2.json └── App.jsx ├── README.md ├── .gitignore ├── .github └── workflows │ └── node.js.yml └── package.json /public/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/public/logo.png -------------------------------------------------------------------------------- /public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /src/images/ruler/ketu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/ketu.png -------------------------------------------------------------------------------- /src/images/ruler/mars.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/mars.png -------------------------------------------------------------------------------- /src/images/ruler/moon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/moon.png -------------------------------------------------------------------------------- /src/images/ruler/rahu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/rahu.png -------------------------------------------------------------------------------- /src/images/ruler/sun.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/sun.png -------------------------------------------------------------------------------- /src/images/ruler/jupiter.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/jupiter.png -------------------------------------------------------------------------------- /src/images/ruler/mercury.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/mercury.png -------------------------------------------------------------------------------- /src/images/ruler/saturn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/saturn.png -------------------------------------------------------------------------------- /src/images/ruler/venus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/slmnsh/nakshatra/main/src/images/ruler/venus.png -------------------------------------------------------------------------------- /src/setupTests.js: -------------------------------------------------------------------------------- 1 | // jest-dom adds custom jest matchers for asserting on DOM nodes. 2 | // allows you to do things like: 3 | // expect(element).toHaveTextContent(/react/i) 4 | // learn more: https://github.com/testing-library/jest-dom 5 | import '@testing-library/jest-dom'; 6 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Nakshatra - Astrology app 2 | 3 | ## How to run locally 4 | 5 | ```zsh 6 | git clone https://github.com/salmannotkhan/nakshatra.git 7 | cd nakshatra 8 | npm install 9 | npm start # to start local server at `localhost:3000` 10 | npm run build # to create production build run 11 | ``` 12 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "Nakshatra", 3 | "name": "Astrology App", 4 | "icons": [ 5 | { 6 | "src": "logo.png", 7 | "type": "image/png", 8 | "sizes": "512x512" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /.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.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/reportWebVitals.js: -------------------------------------------------------------------------------- 1 | const reportWebVitals = onPerfEntry => { 2 | if (onPerfEntry && onPerfEntry instanceof Function) { 3 | import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { 4 | getCLS(onPerfEntry); 5 | getFID(onPerfEntry); 6 | getFCP(onPerfEntry); 7 | getLCP(onPerfEntry); 8 | getTTFB(onPerfEntry); 9 | }); 10 | } 11 | }; 12 | 13 | export default reportWebVitals; 14 | -------------------------------------------------------------------------------- /src/index.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import ReactDOM from "react-dom"; 3 | import "./index.scss"; 4 | import App from "./App"; 5 | import reportWebVitals from "./reportWebVitals"; 6 | 7 | ReactDOM.render( 8 | 9 | 10 | , 11 | document.getElementById("root") 12 | ); 13 | 14 | // If you want to start measuring performance in your app, pass a function 15 | // to log results (for example: reportWebVitals(console.log)) 16 | // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals 17 | reportWebVitals(); 18 | -------------------------------------------------------------------------------- /src/index.scss: -------------------------------------------------------------------------------- 1 | @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,300;0,400;0,500;0,600;1,300&display=swap"); 2 | 3 | * { 4 | margin: 0; 5 | padding: 0; 6 | font-family: "Poppins", sans-serif; 7 | } 8 | html, 9 | body, 10 | #root { 11 | min-height: 100%; 12 | max-height: 100%; 13 | height: 100%; 14 | overflow: hidden; 15 | } 16 | 17 | body { 18 | background-image: linear-gradient(to top, blue, darkblue 80%); 19 | color: white; 20 | } 21 | 22 | #root { 23 | position: relative; 24 | display: flex; 25 | align-items: center; 26 | } 27 | -------------------------------------------------------------------------------- /src/Result.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import "./Result.scss"; 3 | 4 | export default function Result({ 5 | showResult, 6 | number, 7 | nakshatra, 8 | ruler, 9 | setShowResult, 10 | }) { 11 | return ( 12 |
13 |
14 | Number:
15 |

{number}

16 |
17 |
18 | Nakshatra: 19 |

{nakshatra}

20 |
21 |
22 | 30 | Ruler:

{ruler}

31 |
32 | 33 |
34 | ); 35 | } 36 | -------------------------------------------------------------------------------- /.github/workflows/node.js.yml: -------------------------------------------------------------------------------- 1 | 2 | # This workflow will do a clean install of node dependencies, cache/restore them, build the source code and run tests across different versions of node 3 | # For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions 4 | 5 | name: Deployment CI 6 | 7 | on: 8 | push: 9 | branches: [ main ] 10 | pull_request: 11 | branches: [ main ] 12 | 13 | jobs: 14 | build: 15 | 16 | runs-on: ubuntu-latest 17 | 18 | strategy: 19 | matrix: 20 | node-version: [16.x] 21 | # See supported Node.js release schedule at https://nodejs.org/en/about/releases/ 22 | 23 | steps: 24 | - uses: actions/checkout@v2 25 | - name: Use Node.js ${{ matrix.node-version }} 26 | uses: actions/setup-node@v2 27 | with: 28 | node-version: ${{ matrix.node-version }} 29 | cache: 'npm' 30 | - run: npm ci 31 | - run: npm run build --if-present 32 | - name: GitHub Pages action 33 | uses: peaceiris/actions-gh-pages@v3.7.3 34 | with: 35 | github_token: ${{ secrets.GITHUB_TOKEN }} 36 | publish_dir: ./build 37 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nakshatra", 3 | "version": "0.1.0", 4 | "private": true, 5 | "homepage": ".", 6 | "dependencies": { 7 | "@testing-library/jest-dom": "^5.16.1", 8 | "@testing-library/react": "^12.1.2", 9 | "@testing-library/user-event": "^13.5.0", 10 | "react": "^17.0.2", 11 | "react-dom": "^17.0.2", 12 | "react-scripts": "5.0.0", 13 | "sass": "^1.45.2", 14 | "web-vitals": "^2.1.2" 15 | }, 16 | "scripts": { 17 | "start": "react-scripts start", 18 | "build": "react-scripts build", 19 | "test": "react-scripts test", 20 | "eject": "react-scripts eject" 21 | }, 22 | "eslintConfig": { 23 | "extends": [ 24 | "react-app", 25 | "react-app/jest" 26 | ] 27 | }, 28 | "browserslist": { 29 | "production": [ 30 | ">0.2%", 31 | "not dead", 32 | "not op_mini all" 33 | ], 34 | "development": [ 35 | "last 1 chrome version", 36 | "last 1 firefox version", 37 | "last 1 safari version" 38 | ] 39 | } 40 | } 41 | -------------------------------------------------------------------------------- /src/Result.scss: -------------------------------------------------------------------------------- 1 | .result { 2 | display: flex; 3 | justify-content: space-around; 4 | align-items: center; 5 | position: absolute; 6 | right: 33%; 7 | z-index: 1; 8 | transform: translateX(300%); 9 | flex-direction: column; 10 | min-width: 300px; 11 | border: 1px solid darkblue; 12 | background-color: rgb(31, 31, 179); 13 | border-radius: 10px; 14 | padding: 25px; 15 | box-shadow: 5px 5px 5px darkblue; 16 | transition: transform 1s ease; 17 | text-align: center; 18 | div { 19 | display: inherit; 20 | flex-direction: inherit; 21 | align-items: center; 22 | margin: 10px; 23 | img { 24 | height: 100px; 25 | width: 100px; 26 | margin: 10px; 27 | } 28 | } 29 | 30 | button { 31 | display: none; 32 | } 33 | &.show { 34 | transform: translateX(75%); 35 | } 36 | } 37 | 38 | @media (max-width: 856px) { 39 | .result { 40 | left: 50%; 41 | margin-inline: auto; 42 | button { 43 | display: block; 44 | background-color: #e6dc47; 45 | color: #204; 46 | font-size: 14pt; 47 | font-weight: 800; 48 | align-self: center; 49 | min-width: 50%; 50 | cursor: pointer; 51 | transition: box-shadow 0.5s ease; 52 | margin: 15px; 53 | padding: 10px; 54 | border: 1px solid darkgray; 55 | border-radius: 10px; 56 | } 57 | &.show { 58 | transform: translateX(-50%); 59 | } 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 10 | 11 | 12 | 13 | 14 | 18 | 19 | 28 | Nakshatra - Astrology app 29 | 30 | 31 | 32 |
33 | 43 | 44 | -------------------------------------------------------------------------------- /src/App.scss: -------------------------------------------------------------------------------- 1 | form { 2 | display: flex; 3 | position: absolute; 4 | flex-direction: column; 5 | width: 400px; 6 | border: 1px solid darkblue; 7 | background-color: rgb(31, 31, 179); 8 | border-radius: 10px; 9 | padding: 25px; 10 | left: 50%; 11 | transform: translateX(-50%); 12 | box-shadow: 5px 5px 5px darkblue; 13 | transition: left 1s ease; 14 | &.slide { 15 | left: 33%; 16 | } 17 | h1 { 18 | margin-bottom: 10px; 19 | } 20 | .degree-minutes { 21 | display: flex; 22 | div { 23 | display: flex; 24 | flex-direction: column; 25 | width: 50%; 26 | input { 27 | max-width: 75%; 28 | -moz-appearance: textfield; 29 | &.invalid { 30 | border: 1px solid #c15; 31 | background-color: lightsalmon; 32 | } 33 | &::-webkit-inner-spin-button { 34 | display: none; 35 | } 36 | } 37 | } 38 | } 39 | .error { 40 | background-color: #c15; 41 | border-radius: 10px; 42 | padding: 10px 15px; 43 | color: white; 44 | width: 85%; 45 | margin-inline: auto; 46 | margin-bottom: 10px; 47 | } 48 | label { 49 | font-weight: 500; 50 | } 51 | input, 52 | select { 53 | margin: 15px; 54 | padding: 10px; 55 | border: 1px solid darkgray; 56 | border-radius: 10px; 57 | &:focus { 58 | outline: none; 59 | border: 1px solid black; 60 | } 61 | } 62 | input[type="number"] { 63 | text-align: right; 64 | } 65 | input[type="submit"] { 66 | background-color: #e6dc47; 67 | color: #204; 68 | font-size: 14pt; 69 | font-weight: 800; 70 | align-self: center; 71 | min-width: 50%; 72 | cursor: pointer; 73 | transition: box-shadow 0.5s ease; 74 | &:hover { 75 | box-shadow: 5px 5px 5px darkblue; 76 | } 77 | } 78 | } 79 | 80 | @media (max-width: 856px) { 81 | form { 82 | max-width: 300px; 83 | &.slide { 84 | left: 50%; 85 | } 86 | } 87 | } 88 | -------------------------------------------------------------------------------- /src/table1.json: -------------------------------------------------------------------------------- 1 | { 2 | "Saturn": { 3 | "Ar": 5, 4 | "Ta": 7, 5 | "Ge": 1, 6 | "Ca": 4, 7 | "Le": 2, 8 | "Vi": 5, 9 | "Li": 5, 10 | "Sc": 4, 11 | "Sa": 4, 12 | "Cp": 3, 13 | "Aq": 4, 14 | "Pi": 4 15 | }, 16 | "Jupiter": { 17 | "Ar": 3, 18 | "Ta": 2, 19 | "Ge": 1, 20 | "Ca": 3, 21 | "Le": 4, 22 | "Vi": 5, 23 | "Li": 3, 24 | "Sc": 4, 25 | "Sa": 3, 26 | "Cp": 5, 27 | "Aq": 8, 28 | "Pi": 4 29 | }, 30 | "Mars": { 31 | "Ar": 8, 32 | "Ta": 2, 33 | "Ge": 5, 34 | "Ca": 5, 35 | "Le": 4, 36 | "Vi": 4, 37 | "Li": 3, 38 | "Sc": 4, 39 | "Sa": 4, 40 | "Cp": 4, 41 | "Aq": 4, 42 | "Pi": 7 43 | }, 44 | "Sun": { 45 | "Ar": 3, 46 | "Ta": 3, 47 | "Ge": 4, 48 | "Ca": 4, 49 | "Le": 2, 50 | "Vi": 4, 51 | "Li": 4, 52 | "Sc": 5, 53 | "Sa": 3, 54 | "Cp": 6, 55 | "Aq": 8, 56 | "Pi": 3 57 | }, 58 | "Venus": { 59 | "Ar": 3, 60 | "Ta": 4, 61 | "Ge": 4, 62 | "Ca": 4, 63 | "Le": 5, 64 | "Vi": 4, 65 | "Li": 2, 66 | "Sc": 4, 67 | "Sa": 5, 68 | "Cp": 3, 69 | "Aq": 6, 70 | "Pi": 3 71 | }, 72 | "Mercury": { 73 | "Ar": 3, 74 | "Ta": 4, 75 | "Ge": 2, 76 | "Ca": 5, 77 | "Le": 3, 78 | "Vi": 6, 79 | "Li": 7, 80 | "Sc": 1, 81 | "Sa": 3, 82 | "Cp": 4, 83 | "Aq": 6, 84 | "Pi": 8 85 | }, 86 | "Moon": { 87 | "Ar": 2, 88 | "Ta": 3, 89 | "Ge": 6, 90 | "Ca": 2, 91 | "Le": 2, 92 | "Vi": 6, 93 | "Li": 2, 94 | "Sc": 2, 95 | "Sa": 2, 96 | "Cp": 4, 97 | "Aq": 8, 98 | "Pi": 2 99 | }, 100 | "Ascendant": { 101 | "Ar": 2, 102 | "Ta": 7, 103 | "Ge": 1, 104 | "Ca": 2, 105 | "Le": 2, 106 | "Vi": 7, 107 | "Li": 8, 108 | "Sc": 1, 109 | "Sa": 5, 110 | "Cp": 3, 111 | "Aq": 6, 112 | "Pi": 9 113 | } 114 | } 115 | -------------------------------------------------------------------------------- /src/table2.json: -------------------------------------------------------------------------------- 1 | [ 2 | { 3 | "min": "00 Ar 00", 4 | "max": "13 Ar 20", 5 | "nakshatra": "Aswini", 6 | "ruler": "Ketu" 7 | }, 8 | { 9 | "min": "13 Ar 20", 10 | "max": "26 Ar 40", 11 | "nakshatra": "Bharani", 12 | "ruler": "Venus" 13 | }, 14 | { 15 | "min": "26 Ar 40", 16 | "max": "10 Ta 00", 17 | "nakshatra": "Krittika", 18 | "ruler": "Sun" 19 | }, 20 | { 21 | "min": "10 Ta 00", 22 | "max": "23 Ta 20", 23 | "nakshatra": "Rohini", 24 | "ruler": "Moon" 25 | }, 26 | { 27 | "min": "23 Ta 20", 28 | "max": "06 Ge 40", 29 | "nakshatra": "Mrigashira", 30 | "ruler": "Mars" 31 | }, 32 | { 33 | "min": "06 Ge 40", 34 | "max": "20 Ge 00", 35 | "nakshatra": "Ardra", 36 | "ruler": "Rahu" 37 | }, 38 | { 39 | "min": "20 Ge 00", 40 | "max": "03 Ca 20", 41 | "nakshatra": "Purnavasu", 42 | "ruler": "Jupiter" 43 | }, 44 | { 45 | "min": "03 Ca 20", 46 | "max": "16 Ca 40", 47 | "nakshatra": "Pushyani", 48 | "ruler": "Saturn" 49 | }, 50 | { 51 | "min": "16 Ca 40", 52 | "max": "00 Le 00", 53 | "nakshatra": "Aslesha", 54 | "ruler": "Mercury" 55 | }, 56 | { 57 | "min": "00 Le 00", 58 | "max": "13 Le 20", 59 | "nakshatra": "Megha", 60 | "ruler": "Ketu" 61 | }, 62 | { 63 | "min": "13 Le 20", 64 | "max": "26 Le 40", 65 | "nakshatra": "Purva Phalguni", 66 | "ruler": "Venus" 67 | }, 68 | { 69 | "min": "26 Le 40", 70 | "max": "10 Vi 00", 71 | "nakshatra": "Uttara Phalguni", 72 | "ruler": "Sun" 73 | }, 74 | { 75 | "min": "10 Vi 00", 76 | "max": "23 Vi 20", 77 | "nakshatra": "Hasta", 78 | "ruler": "Moon" 79 | }, 80 | { 81 | "min": "23 Vi 20", 82 | "max": "06 Li 40", 83 | "nakshatra": "Chitra", 84 | "ruler": "Mars" 85 | }, 86 | { 87 | "min": "06 Li 40", 88 | "max": "20 Li 00", 89 | "nakshatra": "Swati", 90 | "ruler": "Rahu" 91 | }, 92 | { 93 | "min": "20 Li 00", 94 | "max": "03 Sc 20", 95 | "nakshatra": "Vishakha", 96 | "ruler": "Jupiter" 97 | }, 98 | { 99 | "min": "03 Sc 20", 100 | "max": "16 Sc 40", 101 | "nakshatra": "Anuradha", 102 | "ruler": "Saturn" 103 | }, 104 | { 105 | "min": "16 Sc 40", 106 | "max": "00 Sa 00", 107 | "nakshatra": "Jyeshta", 108 | "ruler": "Mercury" 109 | }, 110 | { 111 | "min": "00 Sa 00", 112 | "max": "13 Sa 20", 113 | "nakshatra": "Mula", 114 | "ruler": "Ketu" 115 | }, 116 | { 117 | "min": "13 Sa 20", 118 | "max": "26 Sa 40", 119 | "nakshatra": "Purvashadha", 120 | "ruler": "Venus" 121 | }, 122 | { 123 | "min": "26 Sa 40", 124 | "max": "10 Cp 00", 125 | "nakshatra": "Uttarashadha", 126 | "ruler": "Sun" 127 | }, 128 | { 129 | "min": "10 Cp 00", 130 | "max": "23 Cp 20", 131 | "nakshatra": "Shravana", 132 | "ruler": "Moon" 133 | }, 134 | { 135 | "min": "23 Cp 20", 136 | "max": "06 Aq 40", 137 | "nakshatra": "Dhanishta", 138 | "ruler": "Mars" 139 | }, 140 | { 141 | "min": "06 Aq 40", 142 | "max": "20 Aq 00", 143 | "nakshatra": "Satabhisha", 144 | "ruler": "Rahu" 145 | }, 146 | { 147 | "min": "20 Aq 00", 148 | "max": "03 Pi 20", 149 | "nakshatra": "Purva Bhadra", 150 | "ruler": "Jupiter" 151 | }, 152 | { 153 | "min": "03 Pi 20", 154 | "max": "16 Pi 40", 155 | "nakshatra": "Uttara Bhadra", 156 | "ruler": "Saturn" 157 | }, 158 | { 159 | "min": "16 Pi 40", 160 | "max": "00 Ar 00", 161 | "nakshatra": "Revati", 162 | "ruler": "Mercury" 163 | } 164 | ] 165 | -------------------------------------------------------------------------------- /src/App.jsx: -------------------------------------------------------------------------------- 1 | import "./App.scss"; 2 | import { useState, useEffect, useReducer } from "react"; 3 | import table1 from "./table1.json"; 4 | import table2 from "./table2.json"; 5 | import Result from "./Result"; 6 | 7 | const reducer = (state, action) => { 8 | if (action.type === "minutes" || action.type === "degree") { 9 | return { ...state, [action.type]: Number(action.value) }; 10 | } 11 | return { ...state, [action.type]: action.value }; 12 | }; 13 | 14 | const initialState = { 15 | planet: "Saturn", 16 | degree: 0, 17 | minutes: 0, 18 | zodiac: "Ar", 19 | number: 0, 20 | nakshatra: "", 21 | ruler: "", 22 | }; 23 | 24 | function App() { 25 | const [state, dispatch] = useReducer(reducer, initialState); 26 | const [error, setError] = useState({}); 27 | const [showResult, setShowResult] = useState(false); 28 | 29 | const createRatio = (degree = 30, minutes = 60) => { 30 | const degreeRatio = (degree * 100) / 30; 31 | const minutesRatio = minutes / 60; 32 | return degreeRatio + minutesRatio; 33 | }; 34 | 35 | const validateForm = () => { 36 | if (state.degree > 30 || state.degree < 0) { 37 | setError({ 38 | type: "degree", 39 | message: "Degree must be between 0 to 30", 40 | }); 41 | return false; 42 | } 43 | if (state.minutes > 60 || state.minutes < 0) { 44 | setError({ 45 | type: "minutes", 46 | message: "Minutes must be between 0 to 60", 47 | }); 48 | return false; 49 | } 50 | if (state.degree === 30 && state.minutes > 0) { 51 | setError({ 52 | type: "minutes", 53 | message: 54 | "Values must be between 0 degree 0 minutes - 30 degree 0 minutes", 55 | }); 56 | return false; 57 | } 58 | setError({}); 59 | return true; 60 | }; 61 | 62 | const setPlanet = () => { 63 | var planet; 64 | const currentRatio = createRatio(state.degree, state.minutes); 65 | if (currentRatio <= createRatio(3, 45)) planet = "Saturn"; 66 | else if (currentRatio <= createRatio(7, 30)) planet = "Jupiter"; 67 | else if (currentRatio <= createRatio(11, 15)) planet = "Mars"; 68 | else if (currentRatio <= createRatio(15, 0)) planet = "Sun"; 69 | else if (currentRatio <= createRatio(18, 45)) planet = "Venus"; 70 | else if (currentRatio <= createRatio(22, 30)) planet = "Mercury"; 71 | else if (currentRatio <= createRatio(26, 15)) planet = "Moon"; 72 | else if (currentRatio <= createRatio(30, 0)) planet = "Ascendant"; 73 | dispatch({ type: "planet", value: planet }); 74 | }; 75 | 76 | useEffect(() => { 77 | if (validateForm()) { 78 | setPlanet(); 79 | } 80 | // eslint-disable-next-line 81 | }, [state.degree, state.minutes]); 82 | 83 | const handleSubmit = (e) => { 84 | e.preventDefault(); 85 | if (error.message) return false; 86 | const number = table1[state.planet][state.zodiac]; 87 | dispatch({ type: "number", value: number }); 88 | const { degree, minutes, zodiac } = state; 89 | const output2 = table2.filter((row) => { 90 | const [minDegree, minZodiac, minMinutes] = row.min.split(" "); 91 | const [maxDegree, maxZodiac, maxMinutes] = row.max.split(" "); 92 | const currentRatio = createRatio(degree, minutes); 93 | var minRatio = createRatio(minDegree, minMinutes); 94 | var maxRatio = createRatio(maxDegree, maxMinutes); 95 | if (minZodiac === zodiac) { 96 | if (maxZodiac !== zodiac) { 97 | maxRatio = createRatio(); 98 | } 99 | } else if (maxZodiac === zodiac) { 100 | minRatio = 0; 101 | maxRatio = createRatio(maxDegree, maxMinutes); 102 | } else { 103 | return false; 104 | } 105 | return currentRatio < maxRatio && minRatio <= currentRatio; 106 | }); 107 | if (output2.length) { 108 | const [{ ruler, nakshatra }] = output2; 109 | dispatch({ type: "ruler", value: ruler }); 110 | dispatch({ type: "nakshatra", value: nakshatra }); 111 | setShowResult(true); 112 | } 113 | }; 114 | return ( 115 | <> 116 |
119 |

120 | Nakshatra 121 |

122 | 123 | 142 |
143 |
144 | 145 | 156 | dispatch({ 157 | type: e.target.name, 158 | value: e.target.value, 159 | }) 160 | } 161 | /> 162 |
163 |
164 | 165 | 176 | dispatch({ 177 | type: e.target.name, 178 | value: e.target.value, 179 | }) 180 | } 181 | /> 182 |
183 |
184 | {error.message ? ( 185 |
{error.message}
186 | ) : null} 187 | 188 | 211 | 212 |
213 | 220 | 221 | ); 222 | } 223 | 224 | export default App; 225 | --------------------------------------------------------------------------------