Merge pull request #169 from Sun-Mountain/164-typescript

164 - [Feature] Change frontend to TypeScript

api/app/controllers/application_controller.rb

@@ -20,7 +20,7 @@ def configure_permitted_parameters
     devise_parameter_sanitizer.permit(:sign_up) do |user|
       user.permit(
         :first_name, :last_name, :preferred_username,
-        :email, :password, :password_confirmation, :current_password
+        :email, :password, :password_confirmation
       )
     end
   end
@@ -41,6 +41,10 @@ def authenticate_user
     end
   end
 
+  def authenticate_password(account_update_params)
+    @user.valid_password?(account_update_params[:current_password])
+  end
+
   def deny_content_type_json
     return unless request.content_type == 'application/json'
 

api/app/controllers/events_controller.rb

@@ -5,7 +5,7 @@ class EventsController < ApplicationController
   before_action :find_event, only: %i[show update destroy]
 
   def index
-    @events = Event.all.where(user_id: @user.id).order(startDate: :asc).partition { |e| e.startDate < Date.today() }
+    @events = Event.all.where(user_id: @user.id).order(start_date: :asc).partition { |e| e.start_date < Date.today() }
     render json: { past: @events[0], upcoming: @events[1] }, status: 201
   end
 
@@ -34,14 +34,14 @@ def destroy
   end
 
   def all_public
-    @public_events = Event.all.where(private: false).order(startDate: :asc).partition { |e| e.startDate < Date.today() }
+    @public_events = Event.all.where(private: false).order(start_date: :asc).partition { |e| e.start_date < Date.today() }
     render json: { past: @public_events[0], upcoming: @public_events[1] }, status: 201
   end
 
   private
 
   def event_params
-    params.permit(:eventTitle, :description, :private, :allDay, :startDate, :endDate, :startTime, :endTime, :user_id, :uid, :created_at)
+    params.require(:event).permit(:event_title, :description, :private, :all_day, :start_date, :end_date, :start_time, :end_time, :user_id, :uid, :created_at)
   end
 
   def find_event

api/app/controllers/users/registrations_controller.rb

@@ -6,20 +6,45 @@ class Users::RegistrationsController < Devise::RegistrationsController
 
   private
 
+  def account_update_params
+    devise_parameter_sanitizer.sanitize(:account_update)
+  end
+
+  def delete_response
+    render json: {
+      status: { code: 204, message: "Account deleted successfully."}
+    }, status: :ok
+  end
+
+  def register_user(resource)
+    render json: {
+      status: {code: 201, message: "Signed up sucessfully."},
+      data: UserSerializer.new(resource).serializable_hash[:data][:attributes]
+    }, status: :ok
+  end
+
   def respond_with(resource, _opts = {})
     if request.method == "POST" && resource.persisted?
+      register_user(resource)
+    elsif request.method == "PUT" && resource.persisted?
+      update_user(resource)
+    else
       render json: {
-        status: {code: 201, message: "Signed up sucessfully."},
-        data: UserSerializer.new(resource).serializable_hash[:data][:attributes]
-      }, status: :ok
-    elsif request.method == "DELETE"
+        status: {code: 422, message: "Could not complete action. #{resource.errors.full_messages.to_sentence}"}
+      }, status: 503
+    end
+  end
+
+  def update_user(resource)
+    if authenticate_password(account_update_params) && @user&.update(account_update_params.except("current_password"))
       render json: {
-        status: { code: 204, message: "Account deleted successfully."}
+        status: {code: 200, message: "Account updated successfully."},
+        data: UserSerializer.new(@user).serializable_hash[:data][:attributes]
       }, status: :ok
+    elsif !authenticate_password
+      render json: { err: @user.errors.full_messages }, status: 401
     else
-      render json: {
-        status: {code: 422, message: "User couldn't be created successfully. #{resource.errors.full_messages.to_sentence}"}
-      }, status: 503
+      render json: { err: @user.errors.full_messages }, status: 503
     end
   end
 end

api/app/controllers/users_controller.rb

@@ -14,7 +14,6 @@ def show
   end
 
   def update
-
     if authenticate_password && @user&.update(user_params)
       render json: {
         status: {code: 200, message: "Account updated successfully."},
@@ -28,22 +27,22 @@ def update
   end
 
   def destroy
-    return if @user&.authenticate(params[:password]) && @user&.destroy
+    return if authenticate_password && @user&.destroy
 
     render json: { err: @user.errors.full_messages }, status: 503
   end
 
   private
 
   def authenticate_password
-    @user.valid_password?(params[:current_password])
+    @user.valid_password?(user_params[:current_password])
   end
 
   def find_user
     @user = User.find(params[:id])
   end
 
   def user_params
-    params.permit(:id, :email, :first_name, :last_name, :preferred_username, :password, :password_confirmation)
+    params.require(:user).permit(:id, :email, :first_name, :last_name, :preferred_username, :current_password, :password, :password_confirmation)
   end
 end

api/app/models/event.rb

@@ -5,7 +5,7 @@ class Event < ApplicationRecord
   before_create :assign_event_uid
   # before_save :parse_date
 
-  validates :eventTitle, :startDate, :user, presence: true
+  validates :event_title, :start_date, :user, presence: true
 
   private
 
@@ -17,7 +17,7 @@ def assign_event_uid
   end
 
   def parse_date
-    startDateStr = self.startDate
-    self.startDate = Date.parse(startDateStr)
+    startDateStr = self.start_date
+    self.start_date = Date.parse(startDateStr)
   end
 end

api/db/migrate/20230314201544_create_events.rb

@@ -2,14 +2,14 @@ class CreateEvents < ActiveRecord::Migration[7.0]
   def change
     create_table :events do |t|
       t.string :uid,      null: false
-      t.string :eventTitle,    null: false
+      t.string :event_title,    null: false
       t.text :description
       t.boolean :private, default: false, null: false
-      t.boolean :allDay,  default: true, null: false
-      t.date :startDate,  null: false
-      t.date :endDate
-      t.time :startTime
-      t.time :endTime
+      t.boolean :all_day,  default: true, null: false
+      t.date :start_date,  null: false
+      t.date :end_date
+      t.time :start_time
+      t.time :end_time
       t.references :user, null: false, foreign_key: true
 
       t.timestamps

api/spec/factories/events.rb

@@ -3,8 +3,8 @@
 FactoryBot.define do
   factory :event do
     association :user
-    sequence(:eventTitle) { |n| "title_#{n}" }
+    sequence(:event_title) { |n| "title_#{n}" }
 
-    startDate { Date.today() + 1.day }
+    start_date { Date.today() + 1.day }
   end
 end

api/spec/models/event_spec.rb

@@ -9,21 +9,21 @@
     it { is_expected.to be_valid }
   end
 
-  describe '#eventTitle' do
+  describe '#event_title' do
     it 'is required' do
-      subject.eventTitle = nil
+      subject.event_title = nil
       expect(subject).to_not be_valid
     end
   end
 
-  describe '#startDate' do
+  describe '#start_date' do
     it 'is required' do
-      subject.startDate = nil
+      subject.start_date = nil
       expect(subject).to_not be_valid
     end
 
     it 'must be a date' do
-      subject.startDate = "This is a string"
+      subject.start_date = "This is a string"
       expect(subject).to_not be_valid
     end
   end

frontend/.eslintrc.js

@@ -6,5 +6,9 @@ module.exports = {
   extends: [
     'plugin:vue/vue3-essential',
     'eslint:recommended',
+    '@vue/eslint-config-typescript',
   ],
+  rules: {
+    'vue/multi-word-component-names': 'off',
+  },
 }

frontend/Dockerfile

@@ -1,4 +1,3 @@
-# stage1 as builder
 FROM node:lts-alpine as builder
 
 WORKDIR /lettuce-meet-frontend

frontend/README.md

@@ -1,4 +1,4 @@
-# essentials
+# default
 
 ## Project setup
 
@@ -39,19 +39,6 @@ npm run build
 pnpm build
 ```
 
-### Lints and fixes files
-
-```
-# yarn
-yarn lint
-
-# npm
-npm run lint
-
-# pnpm
-pnpm lint
-```
-
 ### Customize configuration
 
 See [Configuration Reference](https://vitejs.dev/config/).

frontend/index.html

@@ -2,15 +2,15 @@
 <html lang="en">
 
 <head>
-  <meta charset="UTF-8" />
-  <link rel="shortcut icon" type="image/png" href="./static/flavicon.png"/>
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Lettuce Meet</title>
+    <meta charset="UTF-8" />
+    <link rel="shortcut icon" type="image/png" href="./static/flavicon.png"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Lettuce Meet</title>
 </head>
 
 <body>
-  <div id="app"></div>
-  <script type="module" src="/src/main.js"></script>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
 </body>
 
 </html>