Skip to content

CMPE 352 ‐ Final Milestone Report

Jump to bottom
Eren Donmez edited this page Sep 24, 2024 · 1 revision

1 Executive Summary

1.1 Summary of the project and current status

1.1.1 Summary

Our project is to create a vibrant and interactive discussion forum dedicated to the Turkish Football League, "Süper Lig." By integrating features like team based communities, personalized user profiles, and content-sharing capabilities, our platform caters specifically to football fans. Utilizing the Wikidata API and semantic browsing, we aim to significantly enhance the search functionality within the app, allowing users to find information and content more efficiently and intuitively. Users can register and personalize their accounts, engage with others by creating or interacting with posts and comments within their favorite team's community, and enjoy a rich social experience around their football passion. Key functionalities include account management, community subscriptions, and interactive posting with options for images, tags, and emotional reactions. Our aim is to enhance the social media landscape for Süper Lig enthusiasts, offering a web and mobile application that centralizes fan discussions, fosters community spirit, and keeps fans connected with the latest in football, all within a team focused environment.

1.1.2 Status

Currently, we have finalized the overall structure with the exception of couple requirements from our first SRS. Main features we have not implemented were Tags, Delete posts/comments, Follow and Notifications. Furthermore, our web app is completely up-to-date and provides all features to users. Mobile app on the other hand could not be finished within the given period and therefore lacks several features. Removed/Missing Requirements from our first design are:

Account

  • 1.1.1.2.2 Users shall be able to recover their account if they have forgotten their password.
  • 1.1.2.1.3 Users shall be able to change their username once a month.

Community

  • 1.1.3.1 Users shall be able to subscribe or unsubscribe to any community.

Post

  • 1.1.4.3 Users shall be able to add tags to their own posts.
  • 1.1.4.7 Users shall be able to tag other users in the post.

Comment

  • 1.1.5.3 Users shall be able to tag other users in the comment.
  • 1.1.5.4 Users shall be able to reply a comment with their comment.

Profile

  • 1.1.6.2.3 People who follow the user and the people the user follows.

Notifications

  • 1.2.3.1 Users shall be notified when one of the following happens:
  • 1.2.3.1.1 They are tagged in a post or a comment.
  • 1.2.3.1.2 One of their posts or comments has been liked.
  • 1.2.3.1.3 A new comment has been written to one of their posts.
  • 1.2.3.1.4 A new reply has been given to one of their comments.

1.1.3 Description of the basic functionality

It can be seen here

1.2 URL To

1.2.1 GitHub Code Repository

https://github.com/bounswe/bounswe2024group8/tree/main

1.2.2 Release Tag

https://github.com/bounswe/bounswe2024group8/releases/tag/Group8-Practice-App-Release-v0.2

1.2.3 Application deployed using Docker

1.2.4 Link to the APK file for mobile application

https://drive.google.com/file/d/1RakdBe-3GqBkslnBlcJThm6xkVibOb0j/view?usp=sharing

1.2.5 Documented API

Our API Documentation can be found here

1.2.6 Final SRS

Here is the link to our Final Software Requirement Specifications

1.2.7 Final Design Diagrams

1.2.8 Project Plan (including RAM)

Here is the link to our Project Plan on GitHub Roadmap.

Here is the link to our Responsibility Assignment Matrix

1.2.9 Meeting Notes

1.3 Instructions for building and deploying the application using Docker

We have created a README file as a guide for building and deploying the application that can be seen here.

1.4 Test Information

There is no limitation to test our app. You can signup with a valid email and a password, then choose your favorite team once and for all. After that you can enjoy all you can. You can share a post in your community's page, comment on other posts in your community, put reactions to these posts and communities as well. There is just one limitation: If you try to react or comment to any other post shared in a different community you will see you are not allowed. This is intentional. That is the main focus here to gather fanatics in one place and heat up the togetherness of the team they love. However if you want to heat up the rivalry between your enemy teams you can always have a chance to share your post globally. This way every user regardless which team they fancy can comment and react on this post. So while using our app you can feel the heat of rivalry and feeling of being a famly with a bunch of strangers to the most extend.

Here are couple credentials to enjoy our website, if you do not want to create an account for yourselves:

1.5 Challenges encountered and strategies we used to address them

As we approached the date of the final milestone, the biggest challenge we encountered as a team was about planning and the distribution of tasks. Even though we had done some planning about tasks before the second milestone, it eventually turned out that we were too optimistic about the amount of work that could be done. As exams and project deadlines from other classes piled up for most of our members, we realized that we couldn't implement everything that we conceptualized in the initial requirements document, and had to make some choices about which features to drop.

1.6 Lessons learned (reflections)

As a team, we learned about the importance of effective communication and collaboration. We realized that having clear and regular communication channels significantly improves the development process. We also learned to adapt and pivot our strategies when encountering unexpected challenges. The integration of various technologies, such as the Wikidata API for enhanced search functionalities and Docker for deployment, taught us valuable technical skills and problem solving approaches. Additionally, we gained insights into user experience design and the importance of careful testing to ensure a smooth and reliable application performance. Overall, this project enhanced our teamwork, technical abilities, and adaptability in a dynamic development environment.

2 Contributions by Team Members

Ersel Çanakçılı

Contributions

Summary Of My Work For The Last Milestone

After the 2nd Milestone , we started to discuss where we are and what should we do to satisfy our requirements.

After we had a meeting for the last milestone, Dağhan Erdönmez and me shared the frontend task. Dağhan started to create a profile page for users and I started to implement community pages for each team in our application[#152]. I created a community page template then using this template I created communities. Also I added an icon to the navigation bar to allow users to navigate to their favorite team’s community page.

Since all users are allowed to see all the communities in our application, we needed to enable them to access these communities. Because of that, I created a simple community sidebar to our feed page and added all the communties’ links here[#166].

After we had done with these tasks, we had a conversation with Dağhan Erdönmez and shared the remaining tasks. Dağhan started to implement commenting to posts and I started to implement like,dislike and bookmark features to our posts. I initially communicated with the backend team to clearly understand how these features are implemented in the backend then started implementing it. Also in our application users can like or dislike someone else’s comments so I implemented this feature which was similar to like or dislike a post[#179].

Important Issues

  1. Issue #152 - Create Community Page: Implementation of community page for each team in the application which includes posts of the users that are members of the community and the community header which describes the community.
  2. Issue #166 -Implement Community Sidebar: İmplementation of a sidebar to the feed page which allows users to visit all the communities in the application.
  3. Issue [#179]. -Implement Comment Like Dislike: İmplementation of the like,dislike functions to both the posts and comments. Users can react both posts and comments if the post or the comment is shared in the their community or shared globally. Users can also bookmark a post.

Important Pull Requests

Since we almost work as 4-5 people and 2 poeple in frontend, we were always in contact via discord and whatsapp with Dağhan, Yekta and Oğuz. All the merges handled by them so I dont have a pull request for the Milestone 3.

Wiki Documentation

I have participated almost all the meeting and took meeting notes when it is my turn. Also with Yekta and Oğuz, we created class diagrams. Lastly, I kept our RAM up to date.

API

I haven’t implemented an API function but since I’m in the frontend team we used the API functions implemented by our backend team. Here is a example function that implements the liking functionality.

const handleLike = () => {
   
      console.log(comment.reactionType);
      console.log(comment.commentId);
      if (reaction === "LIKE") {
        axios
          .post(
            `${import.meta.env.VITE_API_URL}/api/v1/posts/comment/${comment.commentId}/react?reactionType=NONE`,{},
    
            {
              headers: {
                Authorization: `Bearer ${localStorage.getItem("authToken")}`,
              },
            }
          )
          .then((response) => {
            setReaction("NONE");
            setLikeCount(response.data.likes); // Decrement like count if unliking
            setDislikeCount(response.data.dislikes);
          })
          .catch((error) => {
            console.log("unlike error");
          });
      } else {
        axios
          .post(
            `${import.meta.env.VITE_API_URL}/api/v1/posts/comment/${comment.commentId}/react?reactionType=LIKE`,{},
            {
              headers: {
                Authorization: `Bearer ${localStorage.getItem("authToken")}`,
              },
            }
          )
          .then((response) => {
            setReaction("LIKE");
            setLikeCount(response.data.likes); // Increment like count if liking
            setDislikeCount(response.data.dislikes);
          })
          .catch((error) => {
            console.log("like error");
          });
      }
    
  };

Significant Other Works

Other than implementing frontend, I was responsible for keeping the RAM up to date. Also, throughout the project, I was in contact with backend and Dağhan to present the application in its best form possible.

Challenges Faced

Since I was not experienced enough in the frontend devolopment and haven’t used React before understanding its structure and working principles took most of my time when I tried to create pages for the application. After I understood the effects of using states and hooks of React I did my best to implement our frontend but still I need to do practice. Also being in a project with 10 people and communicating effectively was harder than I expected.

Onur Çerli

Contributions

Summary Of My Work For The Last Milestone

In the final milestone of our project, I focused on adding new features and making fix-updates on the mobile project according to the updated version of the backend as I was a member of the mobile development team.

I initially started with updating our register screen which was previously taking username, password, email and team information to register a user as stated in the requirements we prepared before. Then, we as group 8 decided to take email, password, first name, last name and team information for registration and backend was updated accordingly. So, I updated the design and backend integration for the register screen and also updated any other parts of the mobile app that is affected by the update on registration operation (Corresponding issue#151). Afterwards, I continued with the creation of a new screen for showing community information and posts related to the corresponding community. I designed a screen and made backend connection but I was not able to finish both the design and backend integration as I was not able to focus on the project thanks to other projects and some personal issues and as backend was still working and making changes on the related endpoint(Corresponding issue: #153). Other than that, I tried to help the mobile team with their problems and made minor bug-fixes and changes on the project.

Important Issues

(Note: I only have 2 issues since the customer milestone2 as I was not able to work on the project enough.)

Important Pull Requests

  • I did not make any pull request since the customer milestone 2 because I worked on a newly created branch(mobile-community) out of our mobile branch and merged it on local with the dev to get the backend updates and then pushed it to the repo. We ,as the mobile development team, made a pr after finalizing the development for updating the mobile in our main branch and Eren was the one making the pr. So, I did not make any pr.

You can view my Wiki Documentation by clicking the link.

Sezer Çot

Contributions

Eren Dönmez

Contributions

Summary of my work

In the time between the second and third milestones, firstly, I implemented a main menu for the post creation page in the mobile app (#167). I then connected the feed page (which was initially filled with static placeholder posts) to the backend so that we could fetch and display posts from our database (#171). I also helped Deniz, who implemented a post creation page, to connect it to the backend. After our implementation phase was done, I gathered the features implemented by all members of the mobile team and merged them all into our main development branch, while dealing with conflicts. I also generated an APK file to be included in our final milestone deliverable (#182). Finally, I updated the project's use case diagram to comply with the features implemented in our final release (#190), and filled out section 1.5 in this report (#189).

Important Issues

Important PRs

Wiki documentation

Challenges faced

The biggest challenge I personally faced was about time management when we approached the final milestone. Unfortunately I had other deadlines very close to the final milestone date, so I had to divide my time among those, and work very long hours for a few days. Even though this was a very tiring experience, it made me realize that I had to have more conservative expectations of how much work I can complete in a limited time window, especially while working on a collaborative project such as this one.

Yekta Eren Ercul

Contributions

Summary Of My Work For The Last Milestone

In the final milestone of our project, I focused on enhancing the backend functionalities and refining the user experience in our application.

Initially, I improved community interaction capabilities. This involved adding a new layer for community services, controllers, and repositories, which enabled functionalities like retrieving community details and posts associated with specific communities. Key methods implemented include getCommunityByName and getPostsOfCommunity, which can be found here and here respectively, addressing the requirements in issue #156.

Following this, I improved the user profile logic by enabling functionalities such as fetching posts created by users, posts reacted to by users, and fetching user details by ID. The implementations for these are found here and here, and were essential in resolving issue #157.

To further refine the data returned from our endpoints, I created custom response structures for posts and comments. These implementations, which involve necessary JPA query methods and model adjustments, are detailed here and here. These were developed in response to issues #158 and #159. These were complex JPA Queries as it needed to show the user-specific statistics.

Security enhancements included implementing a change password functionality, which can be found here, addressing the security needs outlined in issue #160. Additionally, I integrated an endpoint for users to upload profile pictures, improving user interaction and personalization capabilities, detailed in issue #161.

I also refactored the posts to support image uploads, enhancing the content creation experience, as documented in issue #162. Furthermore, I added functionality to retrieve bookmarked posts, improving the user's ability to manage content, which can be reviewed in issue #163 however front part couldn't finish this part so it is just an endpoint for now.

Lastly, I implemented unit tests for user and post services, ensuring robust and error-free functionalities. These tests are crucial for maintaining code quality and can be explored further in issues #164 and #165. And finally for the Milestone I have written the Test information regarding the issue #193 and updated our requirements in accordance with what we achieved #192 .

Important Issues

  1. Issue #158 - Enhanced Post Response: Implementation of complex JPA Queries to include like, dislike, comment counts, and bookmark information in the post response, affecting all endpoints returning post objects. Since this was including like dislike comment count and bookmark infos in the post for the User surfing in our website it was really important to implement early on. View Issue
  2. Issue #161 - Upload Profile Picture Endpoint: Significant for enhancing user interaction by allowing image uploads in posts, achieved by configuring PostgreSQL to accept images using @Lob annotations and hibernate configuration (auto-commit) to resolve lob error when fetching rows with image. This was again very important since the frontend is affected by images in the post and it lets User's create more colorful posts with images. It was hard to implement the image acceptance to Postgres but with some configurations and using @Lob annotations at Model level solved our problem. View Issue
  3. Issue #156 - Community Service Implementation: Rapid development of the community creation feature, critical for the core functionality of the app, including endpoints for community posts and user registrations to communities. Creating Communities was the core soul of our app. So Implementing this was very important and it needed to be implemented fast in order for other endpoints to continue and to be refactored. I have implemented this within 3 hours besides adding community Posts endpoint and saving Users to community when registering. View Issue

Important Pull Requests

I haven't got any pull request bu this has some explanation: First of all I wrote backend only with Oguz Kagnici so we were just 2 people. On top of that when we write our parts we were writing together in a Discord Meeting. Or if we didn't write together we certainly were helding a meeting in Discord before pushing or merging our commits. This way we didn't need any pull request. On top of that some conflicts on branch management that remained from previous Milestones led us not being able to use main branch and this led me to become the supervisor of branches for deploy. So basically everyone merged or pushed their commits under my supervision to hold the integrity of the branches. At the last day I manage to resolve the issue with main branch and now it can be used again.

API Functions I implemented

  • {{baseURL}}/api/v1/users/:id (GET) : Gets User by providing userId to path
  • {{baseURL}}/api/v1/users/:id/profile-picture (PUT) : Updates PP of User with given userId in path and updates the image with the image given in form-data body.
  • {{baseURL}}/api/v1/users/:userId/change-password?password=2 (PUT) : Changes the password with given one in the query parameter of the user with given Id. If the authenticated user doesn't match this Id it won't chang ethe password.
  • {{baseURL}}/api/v1/communities/:communityName (GET) : Gets Community by name by providing it to the path variable. Returns the Community Object.
  • {{baseURL}}/api/v1/comments/post/:postId (GET) : Gets Comment of a Post with given Id. Return Custom CommentResponse which I mentioned earlier with statistics of authorized user.

These all returns Custom PostResponse with statistics regarding the authorized User. (If the user liked, disliked, bookmarked this Post)

  • {{baseURL}}/api/v1/posts/community/:communityTeam (GET) : Gets Posts postedAt specifiec Community
  • {{baseURL}}/api/v1/posts/user/:userId (GET) : Gets Posts posted by User with given Id.
  • {{baseURL}}/api/v1/posts/user/:userId/bookmarked (GET) : Get Posts that are bookmarked for the User with id.
  • {{baseURL}}/api/v1/posts/user/:userId/reacted (GET) : Get Posts User Reacted to

Refactored these endpoints after the second Milestone: -{{baseURL}}/api/v1/posts (POST): Creates Post with addition to add image. -{{baseURL}}/api/v1/posts/feed (GET) : Gets the feed customized to authorized User.

All of the endpoints under the url /api/v1/posts can be seen in this folder and /api/v1/users/ under this , /api/v1/communities/ under this and /api/v1/comments/ under this

Significant Other Works

All of the Dockerfile for backend frontend and database was made by me with the help of Oguz Kagnici at the previous Milestone. This time again I was controlling the deploys and branch management and we faced issues while deploying our backend to GCP. To solve this problem I have changed our Dockerfile a little bit to make the build part of the deploy faster by prebuilding the Maven dependencies can be seen in this file at the line : "RUN mvn dependency:go-offline" . This change saved us since it was 3 am midnight on demo session day and we managed to deploy successfully.

Also with every new endpoint implemented I have provided corresponding updated Postman import file to the all of the group members.

Unit Tests

For Unit Tests I used Junit and Mockito from my previous experiences. I also give a small tutorial Oguz how to write them in a Discord meeting. We divided the unit tests and wrote them in a very fast way. And at the end Oguz and I checked the other one's tests to be sure again in a Discord meeting. The Unit test structure and focuses were on this: The Service layer is the most important since all of the businness logic happens there so we needed to write Unit tests for services. I have wrote tests for User and Post Services. My main focus was to test all of the possible exceptions and all of the possible success scenarios. This way I was able to achieve a high percentage of coverage for the Unit Tests.

// Example Unit Test Code Snippet
@ExtendWith(MockitoExtension.class)
public class PostServiceTest {

    @InjectMocks  // To be tested service
    private PostService postService;

    @Mock  // Mocking other dependencies to create a test environment
    private PostRepository postRepository;

    @Test  // As understandable from its name it is a test case for the success scenario
    public void searchPost_ReturnsResultsBasedOnLocation_WhenLocationIsPresent() {
        // Arrange
        User user = new User();
        String param = "Soccer";
        WikidataTeamDto teamDto = WikidataTeamDto.builder()
                .teamName("Team1")
                .location("Location1")
                .build();
        List<Post> posts = new ArrayList<>();
        posts.add(new Post());

        when(wikidataService.search(param)).thenReturn(teamDto);
        when(postRepository.findByTextLikeIgnoreCaseParams(param, teamDto.getLocation())).thenReturn(posts);

        // Act
        SearchResponse result = postService.searchPost(user, param);

        // Assert
        assertEquals(1, result.getPosts().size()); // Assuming convertPostsToPostResponses returns the same number of posts
        assertEquals(teamDto, result.getTeam());
    }

    @Test   // And again this is an example for a fail scenario
    public void create_ThrowsException_WhenUserNotAllowedToPost() {
        // Arrange
        Team userTeam = Team.GALATASARAY;
        Team postTeam = Team.BESIKTAS;
        Community community = Community.builder()
                .team(userTeam)
                .build();

        User user = User.builder()
                .community(community)
                .build();
        PostCreateRequest request = new PostCreateRequest();
        request.setPostedAt(postTeam);

        // Act & Assert
        assertThatThrownBy(() -> postService.create(user, request))
                .isInstanceOf(FanaticDatabaseException.class)
                .hasMessageContaining("User can only post to their own community or global feed");
    }

}

All of my other Unit tests followed this pattern.

Dağhan Erdönmez

Contributions

Summary of My Work for The Last Milestone

Since the 2nd Milestone, I have worked on adding new features to the frontend matching with the new features added to the backend.

First of all, I have converted our static feed which was shown in the 2nd Milestone demo into a dynamic feed which sends a request to get the feed from the backend and displays them as a list of individual post objects.

I have also added a comment feature to the posts, where users can comment to posts which they are allowed to do so(by our restriction system) and view other comments made by other users. Again, communication with API endpoints and processing the data accordingly are implemented by me.

Another critical feature I have implemented is user profile pages which can be seen here and here. On a profile page, visitors can view the user's information and their posts displayed in a feed format. Receiving the information from the backend is also implemented by me.

I have helped my teammates fixed the settings page and especially its bugs caused because of its CSS.

I have written all of our CSS files (or fixed the draft versions made by my teammate). But that was not a flaw of Ersel Çanakçılı. It was just how we decided to do it in the first place considering our skill varieties.

I have also made updates to our interfaces and storage system according to changes made in other files.

I have also numerous other changes to previously implemented files (pages/components) to encapsulate newly added features which can be seen via my commits.

Important Issues

Important pull requests

I don't have a meaningful pull request in the time frame between the 2nd and Final Milestones. The reason is, in our project Backend and Frontend teams have always worked in separate branches where there were no intersecting file changes. So as the frontend team, we have always been able to simply merge their improvements to our branch without any conflicts. On the other hand, inside the frontend team, Ersel Çanakçılı and I were always in touch via Discord. We have always shared the tasks such that we were never working on the same files. So again, we were always able to just merge our changes immediately via creating a commit to our frontend development branch. Having this said, I have a really unnecessary pull request where I just created and accepted it myself, as there were no conflicts.

API

I have not really implemented an API function myself as I was working on the frontend. However I can share a code snippet where I send a request to an API endpoint implemented by our backend team.

Here is a function that handles commenting on a post action:

const handleAddComment = (commentText: string) => {
    const body = {
      postId: props.id,
      text: commentText,
    };

    axios
      .post(`${import.meta.env.VITE_API_URL}/api/v1/posts/comment`, body, {
        headers: {
          Authorization: `Bearer ${localStorage.getItem("authToken")}`,
        },
      })
      .then((response) => {
        const newComment: Comment = {
          commentId: response.data.id, 
          text: commentText,
          user: {
            id: 1, 
            firstName: response.data.user.firstName,
            lastName: response.data.user.lastName,
            profilePicture: response.data.user.profilePicture,
          },
          likes: 0,
          dislikes: 0,
          createdAt: new Date().toISOString(),
          reactionType: "NONE",
        };
        setComments([newComment, ...comments]);
      })
      .catch((error) => {
        console.log(error);
      });

    console.log(`New comment for post ${props.id}:`, commentText);
};

I have implemented many HTTP request functions like this one, as frontend is always in communication with backend to receive data.

Significant Other Work

  • For the most part, I have created the scenario data for our demo. i.e. Creating new accounts, posting on those accounts in a way that can exhibit the features that we have added.
  • Even though I was in a fairly passive position, I have accompanied my teammates during the deployment process.
  • I have communicated with the backend team to help them spot mistakes or add new features by describing what we need in frontend in terms of API endpoints.

My Wiki Page and Personal Effort Table

Dağhan Erdönmez

Challenges Face During the Implementation

By far the most challenging part was not being able to predict what I will need in the future phase of the development. This was because of me being inexperienced with React and its unique features that I am not familiar at all from regular programming languages I know. I always knew what to implement and had a way of doing it in my mind, but most of the time I was just wrong about the implementation method or there were way more easy/efficient methods to do it. This made me lose so much time and spend so much unnecessary effort.

Oğuz Kağnıcı

Contributions

Summary Of My Work For The Last Milestone

In the final milestone of our project, my task was to mainly add new backend features and improve the existing ones, along with several bug fixes. I have also worked on preparing presentation scenarios for our demo session.

Initially, I started with creating a reaction functionality to our posts in the app. This reactions include like, dislike and bookmark.To achieve this, I have implemented several classes, namely Reaction and ReactionRepository, which can be found here and here. Besides that, I also had to modify the existing classes and add new methods to make new features fully operational. Key methods implemented include reactToPost and reactToComment, which can be found here and here respectively, addressing the requirements in issue #144 and in issue #149. I have created the necessary endpoints in here to be able to interact with my new features.

Afterwards, I have created the comment feature from scratch, which involved creating a new controller, new service and a new model that allows users to comment to the posts they are allowed to. The implementations for these are found here, here and here, addressing the issue #149.

Then, to further enhance the Wikidata search capabilities, I have revised our SPARQL queries, which allowed us to search teams with player names and search cities with team names. These implementations, are shown here and here. These were developed in response to issue #148.

As a slight remark, I have updated our Team List to allow users to choose their favorite teams in Super Lig. Furthermore, I have fixed several bugs regarding the CommentRepository, resolving the issue #174

Finally, I implemented unit tests for the comment service, ensuring nothing unexpected is encountered during our time in development and overall user experience. Unit tests are essential additions to our codebase to maintain reliability and can be explored further in issue #174.

Important Issues

  1. Issue #144 - Implement Like, Dislike and Bookmark for Posts: Implementation of user reactions required many classes to be implemented from the ground up, as there was no infrastructure regarding these functionalities leading to the final milestone. Therefore it was essential to form a structure that can be also used for comments section. View Issue
  2. Issue #149 - Implement Comments: Comments were also a significant part of our initial design and therefore had to be implemented without any compromises. Again, since we had no previous infrastructure regarding the comments from previous milestone, I had to modify and develop almost every layer of our backend structure, which required careful attention to make comments in harmony with every other aspect of our app such as posts and reactions. View Issue
  3. Issue #148 - Improve Wikidata Service: Wikidata and semantic browsing was the absolute constituent element of our project and had to be handled in detail to present users a convincing experience. I therefore improved the SPARQL query capabilities to let users make use of the search function even more. It is now possible in our app to see posts about the city of the team if the team is being searched. Similarly, it is possible to see the posts regarding a team, if a player of that team is being searched. View Issue

Important Pull Requests

As mentioned above, we have carried out the whole development process in contact with Yekta Ercul to gain more speed and efficiency, as we were lacking people on our team. Therefore, all of our push and merge actions were in seamless coordination. Hence, I also do not have any pull requests for the final milestone.

Wiki Documentation

I have actively participated in all of our scheduled meetings and took notes in 7th and 10th. Furthermore, I have created the final sequence diagrams for this milestone.

API Functions I implemented

  • {{baseURL}}/api/v1/posts/comment (POST) : Creates a comment with for a post with a content and post ID specified in form-data body.
Request & Response:
{
"postId": id,  
"text": "text"
}

{
    "id": id,
    "text": "text",
    "user": user,
    "post": post,
    "likes": 0,
    "dislikes": 0,
    "createdAt": "time"
}
  • {{baseURL}}/api/v1/posts/:postId/react (POST) : Reacts to the post given in path with the reaction details shared in form-data.
Request & Response:
{
"reactionType":"LIKE",  // LIKE,DISLIKE,NONE
"bookmark": true
}

{
    "postId": id,
    "likes": 1,
    "dislikes": 0,
    "bookmarked": true
}
  • {{baseURL}}/api/v1/posts/comment/:commentId/react?reactionType=type (POST) : Reacts to the comment given in path with the reaction given in parameters.
Response:
{
    "commentId": id,
    "likes": 1,
    "dislikes": 0
}

Unit Tests

After receiving a brief introduction to unit tests from Yekta, I have created unit tests for CommentService class with one-to-one correspondence to ones by Yekta.

// Example Unit Test Code Snippet
public class CommentServiceTest {

    @InjectMocks
    private CommentService commentService;

    @Mock
    private CommentRepository commentRepository;

    @Mock
    private PostService postService;

    @Mock
    private PostRepository postRepository;

    @Mock
    private ReactionRepository reactionRepository;

    @BeforeEach
    public void setup() {
        MockitoAnnotations.openMocks(this);
    }

    @Test
    public void createComment_ThrowsException_WhenUserNotAllowedToComment() {
        // Arrange
        Team userTeam = Team.GALATASARAY;
        Team postTeam = Team.BESIKTAS;
        Community community = Community.builder()
                .team(userTeam)
                .build();

        User user = User.builder()
                .community(community)
                .build();

        Post post = Post.builder()
                .id(1L)
                .postedAt(postTeam)
                .build();

        CommentCreateRequest request = new CommentCreateRequest();
        request.setPostId(1L);

        // Act
        when(postRepository.findPostById(1L)).thenReturn(post);

        // Assert
        assertThatThrownBy(() -> commentService.createComment(user, request))
                .isInstanceOf(FanaticDatabaseException.class)
                .hasMessageContaining("User is not allowed to comment on this post");
    }

    @Test
    public void getCommentElseThrow_ThrowsException_WhenCommentNotFound() {
        // Arrange
        Long commentId = 1L;
        when(commentRepository.findById(commentId)).thenReturn(null);

        // Act & Assert
        assertThatThrownBy(() -> commentService.getCommentElseThrow(commentId))
                .isInstanceOf(FanaticDatabaseException.class)
                .hasMessageContaining("Comment not found with id: " + commentId);

    }

All of my other Unit tests followed this pattern.

Significant Other Works

I assisted Yekta with the final milestone deployment and branch management. Then, I prepared a high level presentation flow for our demo session with various example scenarios and I was the main spokesperson during the demo. Finally, I have created the final release of our project that can be found here and written the API documentation that can be found here.

Challenges Faced

The biggest challenge that I have faced for this milestone was obviously the amount of worked I had to do. Due to the lack of communication among our team, we could not divide tasks into equal parts and me and few of my team mates had to put a huge effort for this project. Besides, that lack of experience regarding backend development and java spring specifically made me struggle a little.

Deniz Ulaş Poyraz

Contributions

Summary Of My Work For The Last Milestone

After attending the meetings and taking note of what our mobile app misses, I tried to distribute the tasks by writing them down to our group chat. Unfortunately no one responded to my messages, so I started doing some tasks on my own. I completed the settings page by adding change password, delete account and change profile picture features. I then completed the create post page by adding a tags modal and a community checkbox. I then created a profile page for all users where they can follow eachother, see their posted, liked, disliked and bookmarked posts. Finally I implemented comment interactions by creating a comment component(like dislike bookmark). I implemented all of these features with proper functions which I thought we will use when we're connecting the app to backend.(Check mobile posts branch commit history to see all features.) Only page missing was the community page and I asked our team members to do it. After our back end server became ready, I spent hours trying to connect our app to the backend. But I kept getting a network error and couldn't solve it. Unfortunately my personal computer was the issue and I couldn't connect our application to backend which was the easiest thing out of all.

Important Issues

(These issues were opened after our second milestone.)

Important Pull Requests

  • I did not make any pull requests since I branched after most changes and continued commiting on these branches for a long time.

My Wiki Documentation

Ceylanberk Tola

Contributions # Milestone Summary

Web Enhancements and User Experience Refinement

In the final milestone of our project, the focus was on strengthening the web part of our application. Below are the key tasks completed:

API Requests

  • Learning and Implementation:
    • Gained proficiency in making API requests, an essential skill for enhancing frontend-backend communication.

Settings Page Creation

  • Complete Creation:
    • Created the settings page from scratch, focusing on both functionality and design to improve user experience.

New Features Implementation

  • Change Password:
    • Implemented the change password feature, allowing users to update their passwords securely.
    const handlePasswordChange = async () => {
  if (!newPassword) return;
  console.log(localStorage.getItem("authToken"));
  const id = localStorage.getItem("id");
  try {
    await axios.put(
      `${import.meta.env.VITE_API_URL}/api/v1/users/${id}/change-password?password=${newPassword}`,{},
      {
        headers: {
          Authorization: `Bearer ${localStorage.getItem("authToken")}`,
        },
      }
    );
    alert("Password updated successfully!");
    setNewPassword("");
  } catch (error) {
    console.error("Error updating password:", error);
    alert("Error updating password");
  }
};
  • Change Profile Photo:
    • Added functionality for users to change their profile photos, enhancing user personalization.
    const handleProfilePictureUpload = async () => {
  if (!selectedFile) return;
  const id = localStorage.getItem("id");
  const formData = new FormData();
  formData.append("profilePicture", selectedFile);

  try {
    await axios.put(`${import.meta.env.VITE_API_URL}/api/v1/users/${id}/profile-picture`, formData, {
      headers: {
        Authorization: `Bearer ${localStorage.getItem("authToken")}`,
        "Content-Type": "multipart/form-data",
      },
    });
    alert("Profile picture updated successfully!");
  } catch (error) {
    console.error("Error updating profile picture", error);
    alert("Error updating profile picture");
  }
};

Relevant Issue

Honor Code Statements

Oğuz Kağnıcı

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Oğuz Kağnıcı declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Yekta Eren Ercul

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Yekta Eren Ercul declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Dağhan Erdönmez

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Dağhan Erdönmez declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Ersel Çanakçılı

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Ersel Çanakçılı declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Onur Çerli

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Onur Çerli declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Eren Dönmez

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Eren Dönmez declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Ceylanberk Tola

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Ceylanberk Tola declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

Deniz Ulaş Poyraz

Related to the submission of all the project deliverables for the project of the CMPE 352 course, during the 2024 Spring semester, reported in this report, I, Deniz Ulaş Poyraz declare that:

  • I am a student in the Computer Engineering program at Boğaziçi University and am registered for the CMPE 352 course during the 2024 Spring semester.

  • All the material that I am submitting related to my project (including but not limited to the project repository, the final project report, and supplementary documents) have been exclusively prepared by myself.

  • I have prepared this material individually without the assistance of anyone else with the exception of permitted peer assistance which I have explicitly disclosed in this report.

🏠Home

Final Milestone Project Artifacts

🛠️Project

🔍Labs

📁Assignments

📝Meeting Notes

👥Team Members

📄Templates

⚽️352 Material

352 Material

🛠️Project

🔍Research

📁Assignments

📝Meeting Notes

👥Team Members

📄Templates

Clone this wiki locally