adding categories, groups and types

api/categories/controllers.py

@@ -31,6 +31,5 @@ def post(self):
 
     def get(self):
         categories = CategoriesModel.query.all()
-        _categories = []
-        _categories.append([category.to_dict() for category in categories])
+        _categories = [category.to_dict() for category in categories]
         return make_response(jsonify({'categories': _categories}), 200)

api/categories/models.py

@@ -1,29 +1,54 @@
 from app import db
 from api.base.models import Base
 
-# - Categories
-#     - User ID
-#     - Categories Group ID
-#     - Categories Type ID
-#     - Name
-
 class CategoriesModel(Base):
+    """
+    CategoriesModel represents the categories table in the database.
+
+    Attributes:
+        user_id (str): The ID of the user associated with the category.
+        name (str): The name of the category.
+        categories_group_id (str): The ID of the categories group.
+        categories_type_id (str): The ID of the categories type.
+    """
+
     __tablename__ = 'categories'
     user_id = db.Column('user_id', db.Text, db.ForeignKey('user.id'), nullable=False)
+    name = db.Column(db.String(255), nullable=False)
     categories_group_id = db.Column('categories_group_id', db.Text, db.ForeignKey('categories_group.id'), nullable=False)
     categories_type_id = db.Column('categories_type_id', db.Text, db.ForeignKey('categories_type.id'), nullable=False)
-    name = db.Column(db.String(255), nullable=False)
 
     def __init__(self, user_id, categories_group_id, categories_type_id, name):
+        """
+        Initialize a CategoriesModel instance.
+
+        Args:
+            user_id (str): The ID of the user associated with the category.
+            categories_group_id (str): The ID of the categories group.
+            categories_type_id (str): The ID of the categories type.
+            name (str): The name of the category.
+        """
         self.user_id = user_id
         self.categories_group_id = categories_group_id
         self.categories_type_id = categories_type_id
         self.name = name
 
     def __repr__(self):
+        """
+        Return a string representation of the CategoriesModel instance.
+
+        Returns:
+            str: String representation of the category.
+        """
         return '<Categories %r>' % self.name
-    
+
     def to_dict(self):
+        """
+        Convert the CategoriesModel instance to a dictionary.
+
+        Returns:
+            dict: Dictionary representation of the category.
+        """
         return {
             'id': self.id,
             'user_id': self.user_id,
@@ -35,9 +60,15 @@ def to_dict(self):
         }
 
     def save(self):
+        """
+        Save the CategoriesModel instance to the database.
+        """
         db.session.add(self)
         db.session.commit()
 
     def delete(self):
+        """
+        Delete the CategoriesModel instance from the database.
+        """
         db.session.delete(self)
-        db.session.commit()
+        db.session.commit()

api/categories_group/controllers.py

@@ -25,6 +25,5 @@ def post(self):
 
     def get(self):
         categories_group = CategoriesGroupModel.query.all()
-        _categories_group = []
-        _categories_group.append([category_group.to_dict() for category_group in categories_group])
+        _categories_group = [category_group.to_dict() for category_group in categories_group]
         return make_response(jsonify({'categories_group': _categories_group}), 200)

api/categories_type/controllers.py

@@ -25,6 +25,5 @@ def post(self):
 
     def get(self):
         categories_type = CategoriesTypeModel.query.all()
-        _categories_type = []
-        _categories_type.append([category_type.to_dict() for category_type in categories_type])
+        _categories_type = [category_type.to_dict() for category_type in categories_type]
         return make_response(jsonify({'categories_type': _categories_type}), 200)

app/__init__.py

@@ -29,6 +29,8 @@ def create_app():
     app.register_blueprint(institution_blueprint)
     from app.institution_account.controllers import institution_account_blueprint
     app.register_blueprint(institution_account_blueprint)
+    from app.categories.controllers import categories_blueprint
+    app.register_blueprint(categories_blueprint)
 
     # Models
     from api.user.models import User

app/categories/controllers.py

@@ -0,0 +1,60 @@
+from flask import Blueprint, render_template, url_for, session
+from flask_login import login_required
+import requests
+
+categories_blueprint = Blueprint('categories', __name__)
+
+@categories_blueprint.route('/categories')
+@login_required
+def categories():
+    """
+    Render the categories page.
+
+    This view function fetches the categories from an external API and renders
+    the categories/index.html template with the fetched categories and the user ID
+    from the session.
+
+    Returns:
+        str: Rendered HTML template for the categories page.
+    """
+    api_url = url_for('categories', _external=True)
+    response = requests.get(api_url, timeout=15)
+    _categories = response.json().get('categories', [])
+    user_id = session.get('_user_id')
+    return render_template('categories/index.html', categories=_categories, user_id=user_id)
+
+@categories_blueprint.route('/categories/group')
+@login_required
+def categories_group():
+    """
+    Fetch and return the categories group.
+
+    This view function fetches the categories group from an external API and returns
+    the categories group as a JSON response.
+
+    Returns:
+        list: List of categories group.
+    """
+    api_url = url_for('categories_group', _external=True)
+    response = requests.get(api_url, timeout=15)
+    _categories_group = response.json().get('categories_group', [])
+    user_id = session.get('_user_id')
+    return render_template('categories/group.html', categories_group=_categories_group, user_id=user_id)
+
+@categories_blueprint.route('/categories/type')
+@login_required
+def categories_type():
+    """
+    Fetch and return the categories type.
+
+    This view function fetches the categories type from an external API and returns
+    the categories type as a JSON response.
+
+    Returns:
+        list: List of categories type.
+    """
+    api_url = url_for('categories_type', _external=True)
+    response = requests.get(api_url, timeout=15)
+    _categories_type = response.json().get('categories_type', [])
+    user_id = session.get('_user_id')
+    return render_template('categories/type.html', categories_type=_categories_type, user_id=user_id)

app/static/js/categories/group.js

@@ -0,0 +1,28 @@
+function groupsFormSubmit(event) {
+    event.preventDefault();
+
+    const groupName = document.getElementById('categoryGroupName').value;
+    const user_id = document.getElementById('user_id').value;
+
+    const data = {
+        name: groupName,
+        user_id: user_id
+    };
+
+    fetch('/api/categories_group', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(data),
+    })
+        .then(response => response.json())
+        .then(data => {
+            console.log('Success:', data);
+            // redirect to the types page
+            window.location.href = '/categories/group';
+        })
+        .catch((error) => {
+            console.error('Error:', error);
+        });
+}

app/static/js/categories/type.js

@@ -0,0 +1,28 @@
+function typesFormSubmit(event) {
+    event.preventDefault();
+
+    const typeName = document.getElementById('categoryTypeName').value;
+    const user_id = document.getElementById('user_id').value;
+
+    const data = {
+        name: typeName,
+        user_id: user_id
+    };
+
+    fetch('/api/categories_type', {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(data),
+    })
+        .then(response => response.json())
+        .then(data => {
+            console.log('Success:', data);
+            // redirect to the types page
+            window.location.href = '/categories/type';
+        })
+        .catch((error) => {
+            console.error('Error:', error);
+        });
+}

app/templates/categories/group.html

@@ -0,0 +1,145 @@
+{% extends "partials/base.html" %}
+{% block title %}Category Groups{% endblock title %}
+{% block extra_css %}
+{% endblock extra_css %}
+{% block content %}
+<div class="main-content">
+
+    <div class="page-content">
+        <div class="container-fluid">
+
+            <!-- start page title -->
+            <div class="row">
+                <div class="col-12">
+                    <div
+                        class="page-title-box d-sm-flex align-items-center justify-content-between bg-galaxy-transparent">
+                        <h4 class="mb-sm-0">Categories</h4>
+
+                        <div class="page-title-right">
+                            <ol class="breadcrumb m-0">
+                                <li class="breadcrumb-item"><a href="javascript: void(0);">Pages</a></li>
+                                <li class="breadcrumb-item active">Categories</li>
+                            </ol>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+            <!-- end page title -->
+            <div class="row">
+                <div class="col-xl-12">
+                    <div class="card">
+                        <div class="card-header align-items-center d-flex">
+                            <h4 class="card-title mb-0 flex-grow-1">Groups</h4>
+
+                            <div class="flex-shrink-0">
+                                <div class="hstack gap-2 ">
+                                    <button type="button" class="btn btn-success btn-icon waves-effect waves-light"
+                                        data-bs-toggle="modal" data-bs-target="#CategoriesModalgrid"><i
+                                            class="ri-add-box-line"></i></button>
+                                    <div class="live-preview">
+                                        <div class="modal fade" id="CategoriesModalgrid" tabindex="-1"
+                                            aria-labelledby="CategoriesModalgridLabel">
+                                            <div class="modal-dialog">
+                                                <div class="modal-content">
+                                                    <div class="modal-header">
+                                                        <h5 class="modal-title" id="CategoriesModalgridLabel">Add
+                                                            Groups</h5>
+                                                        <button type="button" class="btn-close" data-bs-dismiss="modal"
+                                                            aria-label="Close"></button>
+                                                    </div>
+                                                    <div class="modal-body">
+                                                        <form action="" onsubmit="groupsFormSubmit(event)">
+                                                            <input type="hidden" id="user_id" value="{{ user_id }}">
+                                                            <div class="row g-3">
+                                                                <div class="col-xxl-12">
+                                                                    <div>
+                                                                        <label for="categoryGroupName" class="form-label">Category Group Name</label>
+                                                                        <input type="text" class="form-control"
+                                                                            id="categoryGroupName"
+                                                                            placeholder="Enter Category Group Name">
+                                                                    </div>
+                                                                </div>
+                                                                <div class="col-lg-12">
+                                                                    <div class="hstack gap-2 justify-content-end">
+                                                                        <button type="button" class="btn btn-light"
+                                                                            data-bs-dismiss="modal">Close</button>
+                                                                        <button type="submit"
+                                                                            class="btn btn-primary">Submit</button>
+                                                                    </div>
+                                                                </div>
+                                                                <!--end col-->
+                                                            </div>
+                                                            <!--end row-->
+                                                        </form>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                        </div><!-- end card header -->
+
+
+
+                        <div class="card-body">
+                            <p class="text-muted mb-4">Add Groups with the + button</p>
+
+                            <div class="live-preview">
+                                <div class="table-responsive table-card">
+                                    <table class="table align-middle table-nowrap table-striped-columns mb-0">
+                                        <thead class="table-light">
+                                            <tr>
+                                                <th scope="col" style="width: 46px;">
+                                                    <div class="form-check">
+                                                        <input class="form-check-input" type="checkbox" value=""
+                                                            id="cardtableCheck">
+                                                        <label class="form-check-label" for="cardtableCheck"></label>
+                                                    </div>
+                                                </th>
+                                                <th scope="col">Name</th>
+
+                                                <th scope="col" style="width: 150px;">Action</th>
+                                            </tr>
+                                        </thead>
+                                        <tbody>
+                                            {% for groups in categories_group %}
+                                            <tr>
+                                                <td>
+                                                    <div class="form-check">
+                                                        <input class="form-check-input" type="checkbox" value=""
+                                                            id="cardtableCheck01">
+                                                        <label class="form-check-label" for="cardtableCheck01"></label>
+                                                    </div>
+                                                </td>
+
+                                                <td>{{ groups.name }}</td>
+                                                <td>
+                                                    <button type="button" class="btn btn-sm btn-light">Details</button>
+                                                </td>
+                                            </tr>
+                                            {% endfor %}
+                                        </tbody>
+                                    </table>
+                                </div>
+                            </div>
+                        </div><!-- end card-body -->
+                    </div><!-- end card -->
+                </div><!-- end col -->
+            </div><!-- end row -->
+
+        </div>
+        <!-- container-fluid -->
+    </div>
+
+    {% block footer %}
+    {% include "partials/footer.html" %}
+    {% endblock footer %}
+</div>
+<!-- end main content-->
+{% endblock content %}
+{% block extra_js %}
+<script src="{{ url_for('static', filename='js/categories/group.js') }}"></script>
+{% endblock extra_js %}