Add members #40

nabilasherif · 2024-07-31T09:06:08Z

Description
Add members page
Changes

modified components styles
connected with the backend

Related issues
#19

maayarosama · 2024-08-11T12:10:35Z

client/src/api/axios.ts

+async function Search(searchInput:any) {
+  await AuthClient.get(`/members/search/${searchInput}`)
+  .then(response=>{
+    console.log('Search results:', response.data);


remove console logs

maayarosama · 2024-08-14T09:23:01Z

client/src/api/axios.ts

+  await AuthClient.get(`/members/search/${searchInput}`)
+  .then(response=>{
+    return response.data;
+  })
+  .catch(error=>{
+    console.error(error);
+  })
+}


Suggested change

await AuthClient.get(`/members/search/${searchInput}`)

.then(response=>{

return response.data;

})

.catch(error=>{

console.error(error);

})

}

return await AuthClient.get(`/members/search/${searchInput}`)

}

and handle it with try and catch when you call it

maayarosama · 2024-08-14T09:23:59Z

client/src/pages/AddMembers.vue

+            <v-row >
+                <p class="mt-2 text-h4 text-blue-darken-4" variant="h5">ALL MEMBERS</p>
+                <v-spacer></v-spacer>
+                <v-btn color="primary" @click="addMemberDialog=true">


add loading prop

maayarosama · 2024-08-14T09:25:48Z

client/src/pages/AddMembers.vue

+                        <v-card-actions>
+                            <v-spacer></v-spacer>
+                            <v-btn color="info" @click="addMemberDialog = false">Close</v-btn>
+                            <v-btn color="success" @click="addMember">ADD+</v-btn>


Add loading and disabled prop

maayarosama · 2024-08-14T09:28:42Z

client/src/pages/AddMembers.vue

+            // take userinfo
+        };
+
+        const SearchMember = async () => {


implement notifier here

Mahmoud-Emad

Good job ya Nabila, some comments

Mahmoud-Emad · 2024-08-22T12:46:03Z

client/src/pages/AddMembers.vue

+          required: true,
+        },
+        project_id: {
+          type: string,


Please use String instead

Mahmoud-Emad · 2024-08-22T12:47:48Z

client/src/api/axios.ts

-  baseURL: import.meta.env.VITE_APP_ENDPOINT, 
+  baseURL: import.meta.env.VITE_APP_ENDPOINT,


Load it from the window instead

Mahmoud-Emad · 2024-08-22T13:01:00Z

client/src/api/axios.ts

+  return await AuthClient.get(`/members/search/${searchInput}`)
+}
+async function getProjectMembers (projectId:any) {
+  return await AuthClient.get(`/members/project/${projectId}/members/`)


use members without projects, should be /api/members/all/
use this endpoint /members/project/${projectId}/members/ only inside an active project

Mahmoud-Emad · 2024-08-22T13:01:44Z

client/src/pages/AddMembers.vue

+  <div style="margin-left: 7cm; margin-right: 7cm;">
+    <v-container>
+      <v-row>


You need to load the navbar here

Mahmoud-Emad · 2024-08-22T13:02:05Z

client/src/pages/AddMembers.vue

+          color="primary"
+          @click="addMemberDialog=true"
+        >
+          INVITE MEMBERS


Suggested change

INVITE MEMBERS

Invite member

Mahmoud-Emad · 2024-08-22T13:02:16Z

client/src/pages/AddMembers.vue

+  <div style="margin-left: 7cm; margin-right: 7cm;">
+    <v-container>
+      <v-row>
+        <p class="mt-2 text-h4 text-blue-darken-4" variant="h5">ALL MEMBERS</p>


Suggested change

ALL MEMBERS

All members

Mahmoud-Emad · 2024-08-22T13:03:03Z

client/src/pages/AddMembers.vue

+                v-model="inviteNewMember.first_name"
+                density="compact"
+                placeholder="First Name"
+                prepend-inner-icon="mdi-account-outline"
+                variant="outlined"


Add the validation rules, and apply it to all inputs

Mahmoud-Emad · 2024-08-22T13:03:38Z

client/src/pages/AddMembers.vue

+              <p>Permission</p>
+              <v-select
+                :items="['Full access', 'Admin access']"
+                label="Select"
+              />


Suggested change

Permission

<v-select

:items="['Full access', 'Admin access']"

label="Select"

/>

<v-select

:items="['Full access', 'Admin access']"

label="Permission"

/>

also, use an enum to normalizre the value, the backend require an exact pattern see the enum there

class PERMISSION_CHOICES(models.TextChoices): FULL_ACCESS = "full_access", "Full access" ADMIN_ACCESS = "admin_access", "Admin access"

so you need to send the full_access or admin_access as the value

Suggested change

Permission

<v-select

:items="['Full access', 'Admin access']"

label="Select"

/>

<v-select

:items="[{name: "Full access" value: 'full_access'}, {name: 'Admin access', value: 'admin_access'}]"

label="Permission"

/>

Mahmoud-Emad · 2024-08-22T15:30:08Z

client/src/pages/AddMembers.vue

+      const inviteNewMember = ref({
+        first_name: '',
+        last_name: '',
+        email: '',
+      })


Better to define an interface for the data

Mahmoud-Emad · 2024-08-22T15:30:41Z

client/src/pages/AddMembers.vue

+          notifier.notify({
+            title: 'success',
+            description: 'member added successfully',
+            showProgressBar: true,
+            timeout: 7_000,
+            type: 'success',
+          })


The message will be returned from the backend

Mahmoud-Emad · 2024-08-27T07:56:05Z

client/src/api/axios.ts

+  baseURL: window.location.origin,
  timeout: 1000,
  headers: {
    'Content-Type': 'application/json',
-    'Authorization': 'Bearer ' + localStorage.getItem("token"),
+    Authorization: 'Bearer ' + localStorage.getItem('token'),
  },
-});
+})

 const BaseClient: AxiosInstance = axios.create({
-  baseURL: import.meta.env.VITE_APP_ENDPOINT,
+  baseURL: window.location.origin,


We should use window.env.SERVER_DOMAIN_NAME_API instead

Mahmoud-Emad · 2024-08-27T07:57:35Z

client/src/api/axios.ts


-export { AuthClient, BaseClient };
+async function search (searchInput:any) {


As we agreed we need to define the types of the parameters

Mahmoud-Emad · 2024-08-27T07:58:18Z

server/test_tracker/views/member.py

@@ -39,7 +39,7 @@ class GetMemberApiView(GenericAPIView):
    """

    serializer_class = MemberSerializers
-    permission_classes = (IsHost,)
+    # permission_classes = (IsHost,)


Please don't commit the commented code

intial template

814183b

nabilasherif marked this pull request as draft August 1, 2024 09:34

nabilasherif marked this pull request as ready for review August 8, 2024 11:59

nabilasherif added 2 commits August 8, 2024 16:53

"add members" style modifications

2979965

"add members" style modifications

f0b1832

nabilasherif force-pushed the addmembers branch from 3f60e34 to f0b1832 Compare August 8, 2024 14:03

nabilasherif changed the title ~~intial template~~ Add members Aug 8, 2024

displaying members

78d3090

maayarosama requested changes Aug 11, 2024

View reviewed changes

remove console log

1db5db6

nabilasherif requested a review from maayarosama August 12, 2024 09:30

nabilasherif added 3 commits August 12, 2024 12:34

remove -

cf549d2

 instead of <v-typography>

e935a6a

invite member dialog

dedfb89

maayarosama requested changes Aug 14, 2024

View reviewed changes

get members, added props, notifier

45ce05a

Mahmoud-Emad requested changes Aug 22, 2024

View reviewed changes

validations, addmember BE, select BE connection

1b47dd6

nabilasherif requested a review from Mahmoud-Emad August 25, 2024 11:47

Mahmoud-Emad requested changes Aug 27, 2024

View reviewed changes

nabilasherif added 2 commits August 29, 2024 11:52

changed project api directory structure

4f8decf

rm comments from be, merged with dev2, defined datatypes

7b46a93

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add members #40

Add members #40

nabilasherif commented Jul 31, 2024 •

edited

Loading

maayarosama Aug 11, 2024

maayarosama Aug 14, 2024

maayarosama Aug 14, 2024

maayarosama Aug 14, 2024

maayarosama Aug 14, 2024

Mahmoud-Emad left a comment

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 22, 2024

Mahmoud-Emad Aug 27, 2024

Mahmoud-Emad Aug 27, 2024

Mahmoud-Emad Aug 27, 2024

		baseURL: import.meta.env.VITE_APP_ENDPOINT,
		baseURL: import.meta.env.VITE_APP_ENDPOINT,

	<p class="mt-2 text-h4 text-blue-darken-4" variant="h5">ALL MEMBERS</p>
	<p class="mt-2 text-h4 text-blue-darken-4" variant="h5">All members</p>


		export { AuthClient, BaseClient };
		async function search (searchInput:any) {

Add members #40

Are you sure you want to change the base?

Add members #40

Conversation

nabilasherif commented Jul 31, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Mahmoud-Emad left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

nabilasherif commented Jul 31, 2024 •

edited

Loading