Skip to content

Commit 0f848d9

Browse files
committed
Moved from TS to JS
Added signin & signup pages & basic components
1 parent 50cb1b6 commit 0f848d9

38 files changed

+2097
-3579
lines changed

Procfile

+1
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
11
web: rails server
22
worker: bundle exec good_job start
3+
ui: cd frontend && npm run dev

app/controllers/api/v1/users_controller.rb

+3-3
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ class UsersController < ApplicationController
88

99
# serves as signup
1010
def create
11-
result = User::AddToSystem.call(params: user_params)
11+
result = UserInteractor::AddToSystem.call(params: user_params)
1212
if result.success?
1313
render json: result.user, status: :created
1414
else
@@ -45,7 +45,7 @@ def verify
4545
return render json: { errors: I18n.t('user.errors.verify') }, status: :not_found unless user
4646

4747
user.update(reset_password_token: nil)
48-
render json: { success: true }, status: :ok
48+
render json: { success: 'Verified successfully, please login now!' }, status: :ok
4949
end
5050

5151
private
@@ -60,7 +60,7 @@ def user_params
6060
end
6161

6262
def login_params
63-
params.permit(:email, :password)
63+
params.permit!
6464
end
6565
end
6666
end
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
# frozen_string_literal: true
22

3-
module User
3+
module UserInteractor
44
class AddToSystem
55
include Interactor::Organizer
66

7-
organize User::Create, Mail::VerifyUser
7+
organize UserInteractor::Create, Mail::VerifyUser
88
end
99
end

app/interactors/user/create.rb renamed to app/interactors/user_interactor/create.rb

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# frozen_string_literal: true
22

3-
module User
3+
module UserInteractor
44
class Create
55
include Interactor
66

app/models/user.rb

-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@
1414
# reset_password_token :string
1515
# role :integer default("customer"), not null
1616
# sign_in_count :integer default(0), not null
17-
# tokens :jsonb
1817
# created_at :datetime not null
1918
# updated_at :datetime not null
2019
#

config/initializers/cors.rb

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
# Read more: https://github.com/cyu/rack-cors
44
Rails.application.config.middleware.insert_before 0, Rack::Cors do
55
allow do
6-
origins 'example.com'
6+
origins '*'
77

88
resource '*',
99
headers: :any,

db/migrate/20220314040904_create_users.rb

-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,6 @@ def change
1212
t.datetime :reset_password_sent_at
1313
t.integer :sign_in_count, default: 0, null: false
1414
t.string :provider, default: 'email', null: false
15-
t.jsonb :tokens
1615
t.timestamps
1716
end
1817
end

db/schema.rb

+51-56
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

frontend/.eslintrc.json

-3
This file was deleted.

frontend/.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
v16.5.0

frontend/components/Footer.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export default function Footer() {
2+
return (
3+
<footer className='p-5 w-full text-center bg-gray-900 text-white'>
4+
<p className='font-semibold'>&copy; {new Date().getFullYear()}</p>
5+
</footer>
6+
);
7+
}

frontend/components/Header.js

+74
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
import { useState } from 'react';
2+
import Link from 'next/link';
3+
import { Menu } from 'react-feather';
4+
import { useUser } from '../store/user';
5+
import { Button } from './shared';
6+
import { useCookies } from 'react-cookie';
7+
8+
export default function Header() {
9+
const { user, addUser } = useUser();
10+
const [showMenu, setShowMenu] = useState(false);
11+
const toggleMenu = () => setShowMenu(!showMenu);
12+
const [cookies, setCookie, removeCookie] = useCookies(['user']);
13+
14+
const signOut = () => {
15+
removeCookie('user');
16+
addUser(null);
17+
};
18+
19+
return (
20+
<>
21+
<header className='w-full flex items-center md:justify-between py-2 px-5 bg-slate-800 text-white'>
22+
<h1 className='font-bold text-3xl'>
23+
<Link href='/'>
24+
<a>NXR</a>
25+
</Link>
26+
</h1>
27+
<Menu className='visible md:hidden' onClick={toggleMenu} />
28+
<nav className='hidden md:flex ml-10 md:ml-20 font-semibold'>
29+
<ul className='flex space-x-5 md:space-x-10 text-lg'>
30+
<li>
31+
<Link href='/dashboard'>
32+
<a className='hover:underline underline-offset-2 px-4 py-1 tracking-wider'>
33+
Dashboard
34+
</a>
35+
</Link>
36+
</li>
37+
<li>
38+
<Link href='/about'>
39+
<a className='hover:underline underline-offset-2 px-4 py-1 tracking-wider'>
40+
About
41+
</a>
42+
</Link>
43+
</li>
44+
</ul>
45+
</nav>
46+
{user?.token?.length ? (
47+
<Button onClick={signOut}>Sign out</Button>
48+
) : (
49+
<Link href='/auth/signin'>
50+
<a>
51+
<Button className='bg-slate-800'>Sign in</Button>
52+
</a>
53+
</Link>
54+
)}
55+
</header>
56+
{showMenu && (
57+
<nav className='py-5 font-semibold bg-yellow-200'>
58+
<ul className='flex flex-col items-end space-y-2'>
59+
<li>
60+
<Link href='/dashboard'>
61+
<a className='px-3 py-2 underline tracking-wider'>Dashboard</a>
62+
</Link>
63+
</li>
64+
<li>
65+
<Link href='/about'>
66+
<a className='px-3 py-1 underline tracking-wider'>About</a>
67+
</Link>
68+
</li>
69+
</ul>
70+
</nav>
71+
)}
72+
</>
73+
);
74+
}

frontend/components/Layout.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { useCookies } from 'react-cookie';
2+
3+
import Footer from './Footer';
4+
import Header from './Header';
5+
6+
export default function Layout({ children }) {
7+
const [cookies, setCookie, removeCookie] = useCookies(['user']);
8+
9+
return (
10+
<div className='flex flex-col'>
11+
<Header />
12+
<main>{children}</main>
13+
<Footer />
14+
</div>
15+
);
16+
}

frontend/components/shared/Button.js

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import { Loader } from 'react-feather';
2+
3+
// button variant based on color
4+
const COLOR_VARIANT_MAP = {
5+
solid: {
6+
primary: 'bg-blue-500 hover:bg-blue-700 text-white',
7+
secondary: 'bg-gray-500 hover:bg-gray-700 text-white',
8+
success: 'bg-green-500 hover:bg-green-700 text-white',
9+
danger: 'bg-red-500 hover:bg-red-700 text-white',
10+
warning: 'bg-orange-500 hover:bg-orange-700 text-white',
11+
info: 'bg-teal-500 hover:bg-teal-700 text-white',
12+
light: 'bg-gray-100 hover:bg-gray-200 text-gray-800',
13+
dark: 'bg-gray-800 hover:bg-gray-900 text-white',
14+
},
15+
outlined: {
16+
primary: 'border-2 border-blue-800 text-blue-800',
17+
secondary: 'border-2 border-gray-800 text-gray-800',
18+
success: 'border-2 border-green-800 text-green-800',
19+
danger: 'border-2 border-red-800 text-red-800',
20+
warning: 'border-2 border-orange-800 text-orange-800',
21+
info: 'border-2 border-teal-800 text-teal-800',
22+
light: 'border-2 border-gray-100 text-gray-800',
23+
dark: 'border-2 border-gray-900 text-black',
24+
},
25+
};
26+
27+
const COMMON_CLASS =
28+
'px-6 py-2 flex justify-center uppercase tracking-wider font-bold transition-all hover:ring-2 ring-offset-2 ring-black focus:outline-none focus:shadow-outline';
29+
30+
export default function Button({
31+
loading,
32+
children,
33+
block = false,
34+
color = 'dark',
35+
variant = 'solid',
36+
className = '',
37+
...rest
38+
}) {
39+
return (
40+
<button
41+
className={`${
42+
COLOR_VARIANT_MAP[variant][color]
43+
} ${COMMON_CLASS} space-x-5 ${block ? 'w-full' : ''} ${
44+
loading ? 'bg-gray-500 cursor-not-allowed' : ''
45+
} ${className}`}
46+
{...rest}
47+
>
48+
<span>{children}</span>
49+
{loading && (
50+
<span className='animate-spin'>
51+
<Loader />
52+
</span>
53+
)}
54+
</button>
55+
);
56+
}

0 commit comments

Comments
 (0)