refactor lib directory

Author: Dohyun-s

README.md

@@ -1,18 +1,47 @@
 # BookRecs-Front
-Book Recommendation App Frontend
 
-Installation
-1. download flutter in codespace extension pacakge.
-2. sh install.sh
-Command
-3. flutter run -d web-server --web-hostname=0.0.0.0
+This Flutter application allows users to:
 
+- View current popular books from **Aladin API**
+- Search for books by keyword
+- Bookmark favorite books
 
+## features
 
-For BE
+- 🎯 Home screen displaying daily featured books
+- 🔍 Book search using GraphQL
+- 📚 Bookmark functionality to save your favorite books
+- 📱 Responsive and elegant UI using custom themes and styles
+
+## Getting Started
+
+### 🚀 Installation
+```bash
+git clone <this-repo-url>
+cd myapp
+flutter pub get
+flutter run -d web-server --web-hostname=0.0.0.0
+```
+
+📁 `lib/component/graphql_client.dart` line 7
+
+Set up the GraphQL client for querying data from your backend API:
+```dart
+final HttpLink httpLink = HttpLink(
+  'https://your-backend-api/graphql', // Replace with your actual backend GraphQL endpoint
+);
+```
+
+### 🔧 Build Android app
+```bash
+docker build .
+flutter build apk
+```
+
+### For Backend Installation
 1. git clone https://github.com/BCTP001/be
 2. make be/.env and add your aladin api
-3. npm run dev
+3. sh run.sh
 
-For navigation bar reference
-https://github.com/eric-taix/fluid-nav-bar
+Implements the fluid navigation bar using `fluid_nav_bar`. For reference, see:
+[https://github.com/eric-taix/fluid-nav-bar](https://github.com/eric-taix/fluid-nav-bar)

myapp/lib/README.md

@@ -0,0 +1,12 @@
+## Structure
+
+The app is structured into multiple parts:
+
+### 📁 `lib/component`
+These files contain supporting classes for content diretory.
+### 📁 `lib/content`
+This folder holds the widget files that represent different screens used in main.dart.
+### 📁 `lib/fluid-nav-bar`
+Contains the implementation of the fluid (liquid-style) navigation bar.
+### 📁 `main.dart`
+The entry point of the application. It runs the app and integrates content and components.

myapp/lib/component/graphql_client.dart

@@ -3,14 +3,15 @@ import 'package:flutter/material.dart';
 
 class GraphQLService {
   static ValueNotifier<GraphQLClient>? _client;
-  static const String _baseUrl = "https://redesigned-carnival-xp6v4wpj9pw2jv-4000.app.github.dev/";
+  static const String _baseUrl =
+      "https://redesigned-carnival-xp6v4wpj9pw2jv-4000.app.github.dev/";
 
   /// Get or initialize GraphQL client
   static ValueNotifier<GraphQLClient> getClient() {
     if (_client == null) {
       // Initialize GraphQL client
       final HttpLink httpLink = HttpLink(_baseUrl);
-      
+
       // Create the GraphQL client
       _client = ValueNotifier<GraphQLClient>(
         GraphQLClient(
@@ -19,16 +20,17 @@ class GraphQLService {
         ),
       );
     }
-    
+
     return _client!;
   }
 
   /// Sign in with username and password
-  /// 
+  ///
   /// Returns user data and token on success, null on failure
-  static Future<Map<String, dynamic>?> signIn(String username, String password) async {
+  static Future<Map<String, dynamic>?> signIn(
+      String username, String password) async {
     final GraphQLClient client = getClient().value;
-    
+
     const String signInMutation = '''
       mutation SignIn(\$username: String!, \$password: String!) {
         signIn(username: \$username, password: \$password) {
@@ -40,15 +42,15 @@ class GraphQLService {
         }
       }
     ''';
-    
+
     final MutationOptions options = MutationOptions(
       document: gql(signInMutation),
       variables: {
         'username': username,
         'password': password,
       },
     );
-    
+
     try {
       final QueryResult result = await client.mutate(options);
       if (result.hasException) {
@@ -63,11 +65,12 @@ class GraphQLService {
   }
 
   /// Sign up with name, username and password
-  /// 
+  ///
   /// Returns user data on success, null on failure
-  static Future<Map<String, dynamic>?> signUp(String name, String username, String password) async {
+  static Future<Map<String, dynamic>?> signUp(
+      String name, String username, String password) async {
     final GraphQLClient client = getClient().value;
-    
+
     const String signUpMutation = '''
       mutation SignUp(\$name: String!, \$username: String!, \$password: String!) {
         signUp(name: \$name, username: \$username, password: \$password) {
@@ -77,7 +80,7 @@ class GraphQLService {
         }
       }
     ''';
-    
+
     final MutationOptions options = MutationOptions(
       document: gql(signUpMutation),
       variables: {
@@ -86,7 +89,7 @@ class GraphQLService {
         'password': password,
       },
     );
-    
+
     try {
       final QueryResult result = await client.mutate(options);
       if (result.hasException) {
@@ -99,23 +102,23 @@ class GraphQLService {
       return null;
     }
   }
-  
+
   /// Sign out current user
-  /// 
+  ///
   /// Returns success status
   static Future<bool> signOut() async {
     final GraphQLClient client = getClient().value;
-    
+
     const String signOutMutation = '''
       mutation SignOut {
         signOut
       }
     ''';
-    
+
     final MutationOptions options = MutationOptions(
       document: gql(signOutMutation),
     );
-    
+
     try {
       final QueryResult result = await client.mutate(options);
       if (result.hasException) {
@@ -130,28 +133,26 @@ class GraphQLService {
   }
 
   /// Create a new shelf with given name
-  /// 
+  ///
   /// Returns success message
   static Future<Map<String, dynamic>?> createShelf(String shelfName) async {
     final GraphQLClient client = getClient().value;
-    
+
     const String createShelfMutation = '''
       mutation CreateShelf(\$request: CreateShelfRequest!) {
         createShelf(request: \$request) {
           msg
         }
       }
     ''';
-    
+
     final MutationOptions options = MutationOptions(
       document: gql(createShelfMutation),
       variables: {
-        'request': {
-          "shelfName": shelfName
-        }
+        'request': {"shelfName": shelfName}
       },
     );
-    
+
     try {
       final QueryResult result = await client.mutate(options);
       if (result.hasException) {
@@ -166,11 +167,12 @@ class GraphQLService {
   }
 
   /// Update shelf contents with contain and exclude lists
-  /// 
+  ///
   /// Returns updated shelf info
-  static Future<Map<String, dynamic>?> updateShelf(String shelfName, List<String> containList, List<String> excludeList) async {
+  static Future<Map<String, dynamic>?> updateShelf(String shelfName,
+      List<String> containList, List<String> excludeList) async {
     final GraphQLClient client = getClient().value;
-    
+
     const String updateShelfMutation = '''
       mutation UpdateShelf(\$request: UpdateShelfRequest!) {
         updateShelf(request: \$request) {
@@ -179,7 +181,7 @@ class GraphQLService {
         }
       }
     ''';
-    
+
     final MutationOptions options = MutationOptions(
       document: gql(updateShelfMutation),
       variables: {
@@ -190,7 +192,7 @@ class GraphQLService {
         }
       },
     );
-    
+
     try {
       final QueryResult result = await client.mutate(options);
       if (result.hasException) {
@@ -205,11 +207,11 @@ class GraphQLService {
   }
 
   /// Get books in a shelf by shelf name
-  /// 
+  ///
   /// Returns list of books
   static Future<List<dynamic>> getBooksInShelf(String shelfName) async {
     final GraphQLClient client = getClient().value;
-    
+
     const String getBooksQuery = '''
       query GetBooksInShelf(\$request: GetBooksInShelfRequest!) {
         getBooksInShelf(request: \$request) {
@@ -234,31 +236,29 @@ class GraphQLService {
         }
       }
     ''';
-    
+
     final QueryOptions options = QueryOptions(
       document: gql(getBooksQuery),
       variables: {
-        'request': {
-          "shelfName": shelfName
-        }
+        'request': {"shelfName": shelfName}
       },
     );
-    
+
     try {
       final QueryResult result = await client.query(options);
       if (result.hasException) {
         debugPrint('GraphQL Error: ${result.exception.toString()}');
         return [];
       }
-      
+
       if (result.data != null && result.data!['getBooksInShelf'] != null) {
         return result.data!['getBooksInShelf'] as List<dynamic>;
       }
-      
+
       return [];
     } catch (e) {
       debugPrint('Error in getBooksInShelf: $e');
       return [];
     }
   }
-}
+}