☑️ Contract Listing

1. Module Overview

• Module Name: Client Contract Listing
• Purpose: The Client Contract Listing module provides a centralized view of all client contracts created within the system. It enables authorized users to view, search, create, edit, duplicate, and delete contract templates that are used for client onboarding and project initiation. This module serves as the primary interface for managing contract templates before they are sent to clients for signing.
• Business Goals:
  • Provide agency users with a consolidated view of all client contract templates across brands.
  • Enable efficient contract template management through intuitive listing, search, and action functionalities.
  • Support brand-level organization of contracts for multi-brand agencies.
  • Streamline the contract creation workflow by providing quick access to create, edit, duplicate, and delete operations.
  • Maintain clear visibility into contract status (Draft vs. Published) and usage metrics (signature count).

2. Roles & Permissions

• Roles and permissions - draft

3. User Flow

• Click Here to view the detail user flow

4. Functional Logic

4.1 Client Contract Definition

A Client Contract Template is a customizable, reusable document structure created manually by agency users that serves as the foundation for generating client-specific contracts for projects and events.

Client contract templates are created from scratch by agency users using the "+ Create New" button; the system does not auto-generate or pre-configure client contracts.

Users build templates by adding contract clauses, Smart Fields for dynamic data population (client name, event details, brand info, pricing), Input Fields for client-provided information, signature placeholders, and brand header with logo and contact details.

Template Status: Templates exist in Draft (editable, not available for sending) or Published (finalized, available for sending to clients).

4.1 Initial State — No Contracts Created

• When no client contracts exist under Templates → Contracts for any brand, the listing area displays an empty-state view prompting the user to begin setup.
  • If no brand has been created, the system first instructs the user to create a brand before proceeding.
  • If brands already exist, but no contracts are configured, the system shows the empty-state message:
    "No client contracts found. Kindly proceed to create one."
• The page header ("Contracts") and top-level tabs (Client Contracts, Service Agreement) remain visible and active.
• The listing table area remains empty until at least one contract is created.
• The "+ Create New" button remains accessible in the header for users with appropriate permissions.

4.1.1 Transition to Populated State

• Once at least one client contract (Draft or Published) is created, the module automatically transitions from the empty state to the Populated Listing View.
• The table displays available contracts with their metadata (Name, Status, Brand, Created, Signs, Edit Icon, and Kebab Action Menu).
• Pagination becomes active when records exceed the selected rows-per-page threshold.
• The "+ Create New" button remains accessible for users with permission.

4.2 Client Contract Listing

• The Client Contracts tab under Templates → Contracts displays all contracts created and saved as templates or published for Agreement.
• Each contract listed represents a standardized agreement prepared by the agency for client onboarding and project initiation.
• Agency Owners and Admins have full visibility across all brands and can create, edit, duplicate, or delete client contracts.
• Project Managers have restricted access based on brand-level permissions.

4.2.1 Table Columns

• Name
  • Shows the contract title entered during creation.
  • Displayed as left-aligned text.
• Status
  • Indicates whether the contract is in Draft or Published state.
  • Displayed using a color-coded status tag.
• Brand
  • Displays the brand associated with the contract.
  • Shown as plain text.
• Created
  • Shows the contract’s creation date.
  • Uses the date format configured in User Profile Settings (e.g., MMM DD, YYYY).
• Signs
  • Displays the total count of completed signatures for that contract.
  • Count increments only when both clientsr(s) and agency have completed signing
  • Partially signed or pending agreements are not included in the count.
• Actions
  • Provides quick actions for each row.
  • Includes Edit Template and a Kebab Menu for additional options.

4.2.2 Status Display Logic

• Draft

  • Shown with a yellow tag.
  • Indicates the contract is editable and not yet published.

• Published

  • Shown with a green tag.
  • Indicates the contract is finalized and ready for client signing.

4.2.3 Actions Column Logic

• Edit Template Button: Displayed as a clickable button with edit icon, allowing users to open the contract in the Contract Builder module for editing.
• Kebab Menu (⋮): Contains additional actions:
  • Edit: Opens the contract in Contract Builder for editing (same as Edit Template button).
  • Duplicate: Creates a copy of the contract with the naming convention "Copy of [Original Name]" and resets the status to Draft.
  • Delete: Initiates the permanent deletion flow with confirmation modal.

4.2.3 Search Functionality

• A search bar is provided below the tabs to allow users to filter contracts.
• The search functionality filters contracts based on the following fields:
  • Contract Name
  • Brand Name
• "Search results remain static during input and refresh only when the page is reloaded."
• When the search bar is cleared, the full listing is restored.
• Search is case-insensitive.
• If no results match the search query, the system displays an appropriate empty state message.

4.2.4 Pagination Logic

• Pagination controls are displayed below the contract listing table.
• The following pagination elements are available:
  • Rows per page dropdown: Options include 10, 25, 50, and 100 records per page.
  • Default value: 10 rows per page.
  • Record range indicator: Displays the current range (e.g., "1–10 of 120").
  • Page numbers: Displayed with ellipsis for long lists.
  • Prev/Next arrows: Allow navigation between pages.
• Pagination is only active when the total number of contracts exceeds the selected rows-per-page value.
• When navigating between pages, the table content refreshes to display the corresponding records.

4.2.5 Create New Contract Flow

• Clicking the "+ Create New" button opens a modal dialog titled "New Contract."
• The modal contains the following elements:
  • Contract Title field: Text input with placeholder "Write a name."
  • Brand field: Dropdown selector with placeholder "Select a brand."
  • Cancel button: Secondary button that closes the modal without saving.
  • Create Contract button: Primary button (yellow) that submits the form.
  • Close icon (X): Positioned in the top-right corner of the modal to dismiss it.
• Upon clicking "Create Contract" with valid inputs:
  • The system validates the input fields.
  • The system creates a new contract record with Draft status.
  • The user is redirected to the Contract Builder module to complete the contract setup.
• For Project Managers, the Brand dropdown only displays brands they have been assigned to.

4.2.6 Edit Contract Flow

• Users can initiate editing through two methods:
  • Clicking the "Edit Template" button in the Actions column.
  • Selecting "Edit" from the Kebab Menu.
• Both methods redirect the user to the Contract Builder module with the selected contract loaded for editing.
• All contract fields are editable regardless of whether the status is Draft or Published.

4.2.7 Duplicate Contract Flow

• Users can duplicate a contract by selecting "Duplicate" from the Kebab Menu.
• The system creates a new contract with the following properties:
  • Name: "Copy of [Original Contract Name]"
  • Status: Reset to Draft (regardless of original status)
  • Brand: Same as the original contract
  • Created Date: Current date/time
  • Signs: Reset to 0
  • All other content: Copied from the original contract
• The duplicated contract appears in the listing table immediately after creation.
• A success message is displayed to confirm the duplication.

4.2.8 Delete Contract Flow

• Users can delete a contract by selecting "Delete" from the Kebab Menu.
• The system displays a confirmation modal before proceeding with deletion.
• Confirmation Modal Content:
  • Title: "Delete Contract"
  • Message: "Are you sure you want to delete this contract? This action cannot be undone."
  • Buttons: "Cancel" (secondary), "Delete" (destructive/red)
• Upon confirmation:
  • The contract is permanently deleted from the system.
  • The contract is removed from the listing table.
  • A success message is displayed.
• If the user clicks "Cancel," the modal closes and no action is taken.
• Both Draft and Published contracts can be deleted.

5. Field Details & Validations

5.1 Contract Listing Table Fields

Field Name

Field Type

Description

Validation Rules

Name

Text (Display)

Contract title

Read-only in listing view

Status

Tag/Badge

Contract status indicator

Read-only; values limited to "Draft" or "Published"

Brand

Text (Display)

Associated brand name

Read-only in listing view

Created

Date (Display)

Contract creation date

Read-only; format as per General settings (e.g., MMM DD, YYYY)

Signs

Number (Display)

Count of completed signatures

Read-only; non-negative integer

5.2 New Contract Modal Fields

Field Name

Field Type

Required

Placeholder

Validation Rules

Contract Title

Text Input

Yes

"Write a name"

Minimum 1 character; maximum 2000 characters; cannot be empty

Brand

Dropdown Select

Yes

"Select a brand"

Must select a valid brand from the list; cannot submit without selection

5.3 Search Field

Field Name

Field Type

Required

Placeholder

Validation Rules

Search

Text Input

No

—

No minimum length; searches on Name and Brand fields; case-insensitive

5.4 Pagination Controls

Control

Type

Options/Range

Default

Rows per page

Dropdown

10, 25, 50, 100

10

Page navigation

Numeric + Arrows

Based on total records

Page 1

6. Success Message Handling

Operation

Success Message

Trigger Condition

Post-Success Action

Create Contract

"Contract created successfully."

User clicks "Create Contract" with valid inputs

Redirect to Contract Builder module

Duplicate Contract

"Contract duplicated successfully."

User clicks "Duplicate" from Kebab Menu

Refresh listing table to show new contract; remain on listing page

Delete Contract

"Contract deleted successfully."

User confirms deletion in confirmation modal

Remove contract from listing table; remain on listing page

7. Error Message Handling

Error Scenario

Error Message

Trigger Condition

Required User Action

Empty Contract Title

"Contract title is required."

User attempts to submit with empty or whitespace-only title

Enter a valid contract title

No Brand Selected

"Please select a brand."

User attempts to submit without selecting a brand

Select a brand from the dropdown

Contract Title Too Long

"Contract title must not exceed 255 characters."

User enters a title exceeding 255 characters

Shorten the contract title

8. Edge Cases

Scenario

Expected Behavior

Contract with very long name

Truncate name in table cell with ellipsis; show full name on hover (tooltip)

Multiple contracts with same name

Allow duplicate names; contracts are distinguished by unique system ID and Brand

Contract associated with deleted brand

Display brand name as-is; consider visual indicator or handling per business rules

Two users attempt to delete the same contract simultaneously

First successful deletion removes the contract; second user receives error: "Contract not found or already deleted."

Network failure during listing load

Display error message: "Unable to load contracts. Please check your connection and try again." with retry button

Network failure during contract creation

Display error message; modal remains open with user input preserved

Network failure during deletion (after confirmation)

Display error message: "Deletion failed. Please try again." Contract remains in listing

Session expires while on listing page

Redirect to login page on next action; preserve intended action if possible

9. Test Cases

10. Acceptance Criteria

• Initial State — No Brands: If no brands exist in the system, display a message prompting the user to create a brand before proceeding; "+ Create New" button remains accessible but brand dropdown will be empty.
• Initial State — No Contracts: If brands exist but no contracts are configured, display an empty-state message: "No client contracts found. Kindly proceed to create one."; page header and tabs remain visible and active.
• Populated State Transition: Once at least one client contract (Draft or Published) is created, module automatically transitions to Populated Listing View with table displaying contract metadata.
• Listing Table Columns: Table displays Name (contract title), Status (Draft/Published badge), Brand (associated brand name), Created (date per General Settings format), Signs (completed signature count), and Actions (Edit Template button + Kebab Menu).
• Status Display: Draft status shown with yellow tag (editable, not published); Published status shown with green tag (finalized, ready for client signing).
• Role-Based Access: Agency Owners and Admins have full visibility across all brands with create, edit, duplicate, and delete permissions; Project Managers have restricted access based on brand-level permissions.
• Search Functionality: Search bar filters contracts by Contract Name and Brand Name; search is case-insensitive; results remain static during input and refresh on page reload; clearing search restores full listing; no matches displays empty state message.
• Pagination: Controls displayed below listing table; rows per page options: 10, 25, 50, 100 (default: 10); record range indicator shows current range (e.g., "1–10 of 120"); prev/next arrows and page numbers for navigation; pagination active only when records exceed selected rows-per-page.
• Create New Contract: Clicking "+ Create New" opens "New Contract" modal with Contract Title field, Brand dropdown, Cancel button, Create Contract button, and close icon; upon valid submission, new contract created with Draft status and user redirected to Contract Builder.
• Brand Dropdown (Project Managers): For Project Managers, Brand dropdown displays only brands they are assigned to.
• Edit Contract: Clicking "Edit Template" button or "Edit" from Kebab Menu redirects to Contract Builder with selected contract loaded; all fields editable regardless of Draft or Published status.
• Duplicate Contract: Selecting "Duplicate" from Kebab Menu creates new contract with name "Copy of [Original Name]", status reset to Draft, same brand, current date as Created Date, Signs reset to 0, and all content copied; duplicated contract appears immediately in listing with success message.
• Delete Contract: Selecting "Delete" from Kebab Menu displays confirmation modal with title "Delete Contract", warning message, Cancel and Delete buttons; upon confirmation, contract permanently deleted and removed from listing with success message; both Draft and Published contracts can be deleted.
• Actions Column: Edit Template button opens contract in Contract Builder; Kebab Menu contains Edit, Duplicate, and Delete options.
• Validation on Create: Contract Title is required; Brand selection is required; Create Contract button disabled until both fields are completed; inline errors shown for empty required fields.

11. Dependencies

Module/System

Dependency Type

Impact if Unavailable

Brand Management

Data dependency

Cannot populate Brand dropdown in Create New modal; contracts cannot be associated with brands; listing cannot display brand column

Team Management

Data dependency

Cannot validate user roles and permissions; role-based access control fails; Project Manager brand restrictions unavailable

General Settings (Date Format)

Data dependency

Cannot apply configured date format to Created column; dates display in default format

Contract Builder

Integration dependency

Cannot redirect to builder for contract creation or editing; Edit Template and Edit actions fail

User Authentication

Integration dependency

Cannot verify user permissions for create, edit, duplicate, or delete actions; access control unavailable

Database Service

Data dependency

Cannot retrieve, store, or update contract records; listing table remains empty; all CRUD operations fail

Search Service

Integration dependency

Cannot filter contracts by name or brand; search functionality unavailable

12. Reference

• Link - Click Here

☑️ Contract Builder

1. Module Overview

• Module Name: Contract Builder
• Purpose: The Contract Builder module provides a structured editor workspace that enables authorized users to create, customize, and publish client contract templates. It offers a comprehensive interface for designing professional client agreements with predefined sections including Logo, Address, Contract Body, and Signature blocks. The module supports dynamic content through Smart Fields and Input Fields, allowing automatic population of client and project data when contracts are sent for signing.

Business Goals

• • Enable agencies to create standardized, professional client contract templates with consistent branding.
  • Streamline contract creation through a structured, section-based editor that guides users through the contract building process.
  • Reduce manual data entry errors by leveraging Smart Fields that dynamically populate client, project, and company information.
  • Provide flexibility through Input Fields that allow collection of custom information from clients.
  • Support contract lifecycle management with Draft and Published states, expiration settings, and template reusability.
  • Ensure legal compliance by maintaining required signature blocks for both client and agency parties.

2. Roles & Permissions

• Roles and permissions - draft

3. User Flow

• Click Here to view the detail user flow

4. Functional Logic

4.1 Contract Creation and Builder Logic

• The Client Contract creation flow begins when the user clicks the "+ Create New" button on the top-right corner of the Contracts page.
• This flow allows authorized users (Agency Owners, Admins, and Project Managers) to create standardized client agreement templates under specific brands before they are published for client signature.
• Clicking "Create Contract" and entering the required details (Contract Name, Brand) redirects the user to the Contract Builder page, where the design and content of the contract can be customized using the available sections — Logo, Address, Contract Body, and Signature.
• Each contract created is stored under Templates → Contracts, grouped under the Client Contracts Tab.
• If no brand has been created, the option to create a contract will be disabled, and the user will be prompted to complete brand setup first.

4.1.1 New Contract Setup Modal

• When a user initiates the creation process by clicking "+ Create Contract," a centered modal (pop-up) appears prompting key input details.
• Contract Title:
  • A text field with a maximum limit of 2000 characters.
  • Mandatory field that must be filled before proceeding to the builder.
  • Serves as the display name for the contract in the listing table after saving.
• Brand:
  • A dropdown list displaying all existing brands within the account.
  • Mandatory field — a contract cannot be created without selecting a brand.
  • The selected brand determines the visual identity of the contract template, including branding, logo, and color scheme.
  • If only one brand exists for the agency, the dropdown field will not be displayed; instead, the brand will appear pre-filled automatically.
• Action Buttons:
  • Cancel – Closes the modal without saving.
• Create Contract – Enabled only after both required fields (Contract Title and Brand) are filled.
• Upon confirmation, the system generates a new draft contract entry and automatically transitions the user to the Contract Builder interface.

4.2 Contract Builder — Editable Sections

4.2.1 Logo Section

• The brand's logo is automatically pulled from the brand profile and placed at the top of the contract.
• Users can customize how this logo appears within this specific contract only. Customization options include:
  • Alignment: Choose whether the logo appears on the left, center, or right.
  • Size: Adjust the width and height of the logo in pixels.
• Any modifications made here do not affect the original brand settings; changes apply only to the specific contract being created.

4.2.2 Address Section

• This section is automatically filled with the brand's key details:
  • Brand Name
  • Agency Owner Name
  • Contact Number
  • Email
  • Address
  • Website
• The content is editable through a rich text editor, allowing the user to update formatting (bold, italic, underline, spacing, alignment).
• Only users with the appropriate permissions—Admin or Agency Owner—are allowed to make changes to this section.
• The purpose is to ensure consistency while still allowing formatting adjustments when needed.

4.2.3 Contract Content Section

• This is the main body of the contract and includes a full-featured rich text editor for drafting and customizing contract content.
• Unlike service agreements, the contract content section starts blank; users build the contract from scratch or paste existing content.
• Smart Fields allow users to insert auto-filled project, client, and brand data.
• Input Fields allow users to add fields for client-entered information required during signing.
• For detailed logic on Smart & Input fields, refer to the following link - Click Here

4.2.4 Signature Section

• This part of the contract contains the signature placeholders required to finalize the document.
• By default, it includes the following fields:
  • Client Name
  • Agency Representative
  • Signature Date
• During the drafting phase, these fields are locked and cannot be edited to maintain structure and compliance.
• This section only becomes editable when the contract is being manually sent.
• At that point, the system unlocks the signature section and allows the user to assign who signs each field.
• There is a minimum requirement of one client signature and one agency signature, and these mandatory fields cannot be removed from the contract.
• Multiple Client Signers: Users can add additional client signature fields for scenarios requiring multiple signers (e.g., bride and groom, business partners).

4.3 Rich Text Editor Functionality

The Agreement Builder includes a full-featured rich text editor (CK Editor) for drafting and customizing contract/agreement content. The editor toolbar provides the following functionality:

4.3.1 History Controls

• Undo (↩): Reverts the last action; supports multiple undo levels; keyboard shortcut: Ctrl+Z
• Redo (↪): Restores the last undone action; supports multiple redo levels; keyboard shortcut: Ctrl+Y

4.3.2 Text Formatting

• Paragraph Styles (Dropdown): Provides text style options including Paragraph, Heading 1, Heading 2, Heading 3, etc.; applies block-level formatting to selected text
• Bold (B): Applies bold formatting to selected text; keyboard shortcut: Ctrl+B
• Italic (I): Applies italic formatting to selected text; keyboard shortcut: Ctrl+I
• Underline (U): Applies underline formatting to selected text; keyboard shortcut: Ctrl+U

4.3.3 Insert Elements

• Link (🔗): Inserts or edits hyperlink; requires valid URL format; can link to external pages
• Image (🖼 ▼): Inserts image into content; dropdown for image upload options; supports URL or file upload
• Table (⊞): Inserts table; allows configuration of rows and columns; supports table formatting and cell merging
• Block Quote (❝): Inserts block quote formatting; indents and styles text as quotation
• Code Block ({ }): Inserts code block for technical content; preserves formatting and spacing
• Media/Video (▶): Embeds video or media content; supports video URL embedding
• Emoji (☺): Opens emoji picker; inserts emoji at cursor position

4.3.4 List & Indentation

• Bulleted List (•): Creates unordered bulleted list; supports nested lists; click again to remove list formatting
• Numbered List (1.): Creates ordered numbered list; supports nested lists; auto-increments numbers
• Decrease Indent (⇤): Decreases indentation of selected paragraph or list item; moves content left
• Increase Indent (⇥): Increases indentation of selected paragraph or list item; moves content right

4.3.5 Smart & Input Fields

• Add Fields Button (+): Opens right-side panel with two tabs — Smart Fields (system-generated dynamic placeholders) and Input Fields (contractor/client-entered values); fields inserted at cursor position

4.3.6 Rich Text Editor Behavior

• Auto-Save: Content changes are retained in the editor until explicitly saved via "Save as Template" or navigating away triggers unsaved changes prompt.
• Copy-Paste Support: Supports pasting content from external sources (Word, web pages); formatting may be preserved or cleaned based on source.
• Keyboard Shortcuts: Standard shortcuts supported — Ctrl+B (Bold), Ctrl+I (Italic), Ctrl+U (Underline), Ctrl+Z (Undo), Ctrl+Y (Redo), Ctrl+A (Select All).
• Placeholder Insertion: Smart Fields inserted via "Add Fields" button appear as highlighted tags (e.g., [Event Name]) at cursor position.
• Date Format: Dates inserted via Smart Fields default to readable month-first style (e.g., "December 23, 2025").
• Content Sections: Users can create multiple sections with headings and body text; all content is fully editable.
• Character Limit: No enforced character limit for agreement/contract body content.

4.4 Input & Smart Fields — Logic

4.4.1 Smart Fields Definition

• Definition: Smart Fields are dynamic placeholder tags embedded within contract templates that automatically pull and populate data from the system when the contract is sent or viewed.
• Data Sources: Smart Fields fetch information from client profiles, event details, project assignments, and brand information.
• Auto-Population: Placeholders (e.g., [Event Name], [Client Name]) are replaced with actual system data, eliminating manual entry and ensuring accuracy.

4.4.2 Accessing Smart Fields

• Users can insert Smart Fields while editing the contract content.
• The "Smart Fields" button appears in the Rich Text Editor toolbar.
• Clicking it opens a settings panel on the right side of the screen, which contains two tabs — Input Field (for client-entered values) and Smart Field (for system-generated dynamic placeholders).

4.4.3 Smart Field Categories

• Smart Fields are grouped into categories so users can easily find relevant information. Each category pulls data directly from the system based on the client, event, or project assignment.
• Categories include:
  • Client Information (name, email, phone, address)
  • Event Details (event name, date, time, location)
  • Project Information (project name, package details, pricing)
  • Brand Information (brand name, contact details, address)
• Date format in contracts will default to a readable month-first style. Example December 23, 2025
• For detailed category list, refer to the link - Click Here

4.4.4 Smart Field Behavior

• Users place the cursor inside the contract body → click "Smart Fields" → open Smart Field tab → choose a category → select a field.
• A highlighted placeholder (e.g., [Event Name]) is inserted at the cursor position.
• In Draft Mode, Smart Fields appear as placeholder tags.
• When Sent/Viewed, the system automatically replaces placeholders with actual data pulled from the client profile and project assignment.

4.4.5 Input Fields Definition

• Definition: Input Fields are fillable form elements embedded within the contract that collect information directly from clients during the signing process.
• Data Collection: Input Fields capture additional information not available in the system, such as special requests, dietary requirements, additional contacts, or specific preferences.

4.4.6 Input Fields Behavior

• Input Fields collect extra information from the client during the contract signing process.
• Each field can have Placeholder Text to guide the client on what to enter.
• Fields marked as Required must be filled before the client can submit their signature.
• All entered values are saved in the contract record under "Information Collected."

4.5 Contract Builder Actions

4.5.1 Preview Function

• Purpose: Opens a read-only version of the complete client contract, allowing users to review layout, content, terms, and placeholders before finalization.
• Access Points:
  • From Listing: Users can access preview directly from the Client Contract listing page via the Preview action (eye icon).
  • From Builder: Users can access preview from the Builder edit mode by clicking the Preview button in the header.
• Preview Header Components:
  • Contract name displayed with status badge (e.g., "Draft")
  • "Edit" button to switch to edit mode
  • "Close" button to exit preview and return to previous screen
• Edit Mode Access: Clicking the "Edit" button from preview opens the Builder in edit mode.

4.5.2 Save as Template Function

• Purpose: Saves the current client contract edits as a draft template, enabling users to revisit and continue editing later before publishing.
• Access Restriction: Save as Template option is accessible only when the contract is in Draft status.
• Save Behavior: Clicking "Save as Template" saves all current edits including content, formatting, Smart Fields, Input Fields, and signature configurations; contract remains in Draft status.

4.5.3 Publish Function

• Purpose: Finalizes the client contract, changes the status from Draft (yellow badge) to Published (green badge), and marks it as ready for client signing.
• Post-Publish Editability: Published contracts remain editable; content is not locked after publishing; users can update content, Smart Fields, Input Fields, and signature configurations at any time.
• Availability for Sending: Only Published contracts are available for sending to clients; Draft contracts cannot be sent until published.
• Impact on Sent Contracts: Edits to a published contract do not affect contracts already sent to clients; changes apply only to future sendings.

4.6 Contract Expiration — Configuration & Behavior

4.6.1 Configuration Settings (Admin / Agency Owner Only)

The Settings section allows users to configure additional parameters for each contract, including file expiration timelines. It ensures contracts remain valid only for a defined period after being sent, maintaining compliance and encouraging timely client responses.

The platform allows agencies to control how long a client contract remains valid for signing.

• A setting called “Turn on file expiration” determines whether client contracts will expire after being sent.
• When enabled, the admin/agency owner can define a validity duration (days or months)
• This expiration duration applies to all contracts created from that template.
• The setting can be adjusted while the contract template is still in Draft or even after it is published, offering flexibility to update contract validity rules at any time.
• For field configuration and validation rules, refer to the link — Click Here.

4.6.2 Expiration Behavior (How the Countdown Works)

Once a client contract is sent—whether bundled inside a proposal or sent manually from Project Details—the expiration timer begins.

• The countdown starts immediately after it has been sent.
• When the expiration date is reached:
  • The contract becomes inactive.
  • The client can no longer sign or access the document.
  • No edits or updates can be made by the agency.
  • The contract moves into a read-only, locked state, ensuring legal integrity and preventing post-expiry modifications.

This behavior ensures that contracts are signed only within the approved validity period.

4.6.3 Post-Expiration User Experience

Agency User Experience

• The agency team can still open and view the expired client contract from Project Details.
• The document is clearly marked with an “Expired” label for clarity.
• All actions such as editing, deleting, or resending the expired contract are disabled.
• Only viewing and navigating through the content is permitted, preserving the audit trail.

Client Experience

• When the client attempts to open an expired contract (via email link or portal):
  • They see a blocking message:
    “This contract has expired. Please contact your agency for renewal.”
• The client cannot sign, download, or view the expired contract’s content.
• This ensures clear communication and prevents accidental signing of outdated documents.

4.6.4 Renewal Process (What Happens After Expiration)

• Expired client contracts cannot be reactivated or reopened for signature.
• To issue a new contract, the agency must send a fresh contract instance from the Project Details.
• The new instance creates a new validity period based on the active expiration settings.
• All Smart Fields auto-populate using the latest project and client details.
• The old expired contract remains stored as a historical record in the system, preserving compliance and maintaining a clean audit trail.

4.7 Header Action Buttons

4.7.1 Preview

• Opens a read-only version of the complete contract on the same page.
• Allows users to review layout, content, Smart Fields, Input Fields, and signature placeholders before finalization.
• Users can exit preview to return to editing mode.

4.7.2 Save as Template

• Saves the current contract including all sections (Logo, Address, Contract Body, Signature) and Settings as a draft template.
• The contract remains in Draft status after saving.
• Enables users to revisit and edit the contract later before publishing.

4.7.3 Publish

• Finalizes the contract and changes status from Draft to Published.
• Published contracts become available for client sharing and signature.
• No validation is required before publishing.
• Published contracts can still be edited (status may revert or remain Published based on system configuration).

5. Field Details & Validation

5.1 Contract Builder Interface Display Fields

Field Name

Type

Validation Rules

Back Arrow

Navigation Button

Top-left corner; returns to Contracts listing page

Contract Name Header

Text Display

Shows entered contract title (e.g., "Wedding Photography Contract")

Status Badge

Status Label

Displays the status "Draft" or "Published"

Preview Button

Secondary Action Button

Opens read-only preview of edited client contract

Save as Template Button

Secondary Action Button

Saves the edited content as draft template; allows future editing

Publish Button

Primary Action Button

Publishes the client contract and marks it ready for client sharing

Contract Structure Panel

Collapsible Menu

Clicking it opens a left sidebar containing Logo, Address, Contract, Signature sections

Settings Icon

Navigation Button

Opens Settings panel in left sidebar; gear/cog icon

Logo Section

Collapsible Item

Displays brand logo; clickable to show logo configuration options

Address Section

Collapsible Item

Shows brand contact information; clickable to edit address details

Contract Section

Collapsible Item

Main content editing area; highlighted when active

Signature Section

Collapsible Item

Signature placeholder area; clickable to configure signatures

Logo Image Display

Image Container

Shows brand logo in document; centered by default; max width constrained

Logo Alignment Options

Radio Buttons

Options: Left, Center, Right; located in right panel when Logo is selected

Logo Size Inputs

Number Input Fields

Width and Height in pixels (e.g., "58px", "68px"); located in right panel

Address Content Area

Rich Text Display

Shows brand name, owner name, contact number, email, address, website

Address Toolbar

Rich Text Editor Toolbar

Includes undo/redo, paragraph styles, bold, italic, underline, link options

Contract Content Area

Rich Text Editor

Main editable area for contract text; full CK Editor functionality; starts blank

Contract Toolbar

Rich Text Editor Toolbar

Full formatting options including paragraph styles, bold, italic, underline, strikethrough, link, image, table, lists, alignment

Add Fields Button

Toolbar Button

Located in contract toolbar; opens Smart Fields and Input Fields panel on right

Contract Heading

Text Display

User-created heading in contract body; editable via CK Editor

Instructional Text

Text Display

Format: "This is where you can add your custom contract text."; editable placeholder

Content Sections

Text Block

User-created content sections with headings and body text; fully editable

Signature Warning Message

Info Box

Light background with info icon; Text: "You'll be able to edit this signature field — or link it to specific clients and add additional signers — when you send the live contract."

Client Name Placeholder

Signature Field

Format: "[Client Name]"; non-editable in builder; italicized text

Date Placeholder

Signature Field

Format: "Date"; non-editable in builder; aligned right

Agency Owner Placeholder

Signature Field

Format: "[Agency Owner Name]"; non-editable in builder; italicized text

5.2 Settings Tab Fields

Field Name

Field Type

Description

Validation Rules

Settings Header

Text (Display)

Static text: "Settings"

Read-only

Set Expiration Date Label

Text (Display)

Section label for expiration configuration

Read-only

Turn on File Expiration

Toggle Switch

Enables or disables contract expiration functionality

Default: OFF; when ON, expiration fields become active

Expires In (Number)

Number Input

Numeric value for expiration duration

Required when toggle is ON; accepts positive integers only; minimum value: 1; maximum value: 365

Expires In (Unit)

Dropdown Select

Time unit for expiration period

Options: Days, Weeks, Months; default: Days; required when toggle is ON

After Sending Text

Text (Display)

Static text: "after sending to client"

Read-only; provides context for expiration timing

8. Edge Cases

Scenario

Expected Behavior

User clicks "+ Create New" with no brands in system

Create Contract button disabled; message displayed: "No brands found. Please create a brand first to create contracts."

Only one brand exists in agency

Brand dropdown not displayed in New Contract modal; brand auto-filled automatically

User enters contract title with only spaces

Validation error: "Contract title cannot be empty or contain only spaces."; Create Contract button remains disabled

User enters contract title exceeding 2000 characters

Input blocked at 2000 characters; excess characters not accepted

User clicks Cancel on New Contract modal

Modal closes without saving; no contract created; user remains on listing page

Brand logo not configured in brand profile

Logo section displays placeholder image or empty state; user can proceed without logo

User adjusts logo size to extreme values (e.g., 1px or 1000px)

System enforces minimum (50px) and maximum (500px) limits; values outside range rejected

User without Admin/Agency Owner permission edits Address section

Edit blocked; error: "You do not have permission to edit this section."

User inserts Smart Field without placing cursor in contract body

Error: "Please place cursor in the contract body before inserting a Smart Field."; field not inserted

User inserts multiple Smart Fields in sequence

Each Smart Field inserted at current cursor position; placeholders appear in order of insertion

Smart Field category has no available fields

Category displays empty state; no fields available for selection

User adds Input Field with empty label

Validation error: "Field label is required."; field not added

User adds Input Field with label exceeding 100 characters

Input blocked at 100 characters; excess characters not accepted

User attempts to remove mandatory client signature field

Remove action blocked; field cannot be deleted; tooltip: "At least one client signature is required."

User attempts to remove mandatory agency signature field

Remove action blocked; field cannot be deleted; tooltip: "At least one agency signature is required."

User adds multiple client signature fields for bride and groom

Additional signature fields created; each can be assigned to different project participants

User enables expiration toggle but leaves duration empty

Validation error on save: "Please enter an expiration duration."; settings not saved

User enters zero or negative expiration duration

Validation error: "Expiration duration must be at least 1."; value rejected

User enters expiration duration exceeding 365

Validation error: "Expiration duration cannot exceed 365."; value rejected

User changes expiration settings after contract is published

Changes saved; new settings apply to future sendings only; already sent contracts retain original expiration

User clicks Preview with unsaved changes

Preview displays current state including unsaved changes; changes not persisted until saved

User publishes contract with no content in body

Contract published successfully; no content validation required; empty contract available for sending

User publishes contract with only Smart Fields (no static content)

Contract published successfully; Smart Fields will populate when sent

User navigates away from Builder with unsaved changes

Unsaved changes prompt: "You have unsaved changes. Do you want to save before leaving?"; options to Save, Discard, or Cancel

User opens same contract in multiple browser tabs

Last save overwrites previous; potential data conflict; most recent changes persisted

User rapidly clicks Publish button multiple times

System processes first click only; subsequent clicks ignored; prevents duplicate publishing

Network failure during Save as Template

Error: "Failed to save contract. Please try again."; changes retained in form for retry

Network failure during Publish

Error: "Failed to publish contract. Please try again."; contract remains in Draft status

Session timeout while editing contract

User redirected to login; unsaved changes lost; must re-authenticate and re-edit

User pastes large content block into contract body

Content pasted successfully; no character limit enforced; performance may vary with very large content

User pastes formatted content from external source (Word, web)

Formatting may be preserved or stripped based on rich text editor capabilities; user can reformat as needed

User inserts hyperlink with invalid URL format

Validation error: "Please enter a valid URL."; link not inserted

Contract with many Smart Fields takes time to load in Preview

Loading indicator displayed; preview renders once all fields processed

User duplicates a Published contract

Duplicate created with "Copy of [Original Name]"; status reset to Draft; Signs reset to 0

User deletes a contract that has already been sent to clients

Deletion confirmation modal appears; sent contracts remain accessible to clients; template removed from listing

User attempts to delete contract without confirmation

Confirmation modal required: "Are you sure you want to delete this contract? This action cannot be undone."

User clicks Edit Template from listing for Draft contract

Contract Builder opens with contract loaded in edit mode

User clicks Edit Template from listing for Published contract

Contract Builder opens; contract remains Published and editable

Search returns no matching contracts

Empty state displayed: "No contracts found matching your search."

User searches for contract by partial name

Contracts with matching partial name displayed in real-time

User applies sort by Created Date (Newest First)

Contracts sorted by creation date in descending order

User changes rows per page from 10 to 100

Listing refreshes to show up to 100 contracts per page

User on last page of pagination clicks Next

Next arrow disabled; no action taken

Contract title very long (near 2000 characters)

Title truncated with ellipsis in listing view; full title visible on hover or in edit mode

User edits contract content using keyboard shortcuts

Rich text editor supports standard shortcuts (Ctrl+B, Ctrl+I, Ctrl+U); formatting applied correctly

User attempts to assign signer not in project participants

"+ Add New Participant" option available; user can add new contact for signing

Input Field marked as Required is removed

Field removed from contract; no validation error; Required setting removed with field

User changes brand association after contract is created

Brand cannot be changed after creation; user must create new contract for different brand

User accesses Contract Builder on mobile device

Builder renders responsively; some features may be limited; editing possible but desktop recommended

Rich text editor toolbar overflows on small screen

Toolbar collapses or shows overflow menu; all formatting options remain accessible

10. Acceptance Criteria

• Contract Creation: System must allow Agency Owners, Admins, and Project Managers to create contracts via "+ Create New" button; modal requires Contract Title (max 2000 chars) and Brand selection.
• No Brand Blocker: If no brands exist, system must disable creation and display: "No brands found. Please create a brand first."
• Single Brand Auto-Fill: If only one brand exists, Brand dropdown must be hidden and auto-filled.
• Draft Status: New contracts must be created in Draft status (yellow badge); Published contracts display green badge.
• Listing Table: System must display contracts with Name, Status, Brand, Created Date, Signs count, and Actions (Edit, Duplicate, Delete).
• Logo Section: System must auto-pull brand logo; users can customize alignment (Left/Center/Right) and size (50-500px) without affecting brand settings.
• Address Section: System must auto-fill brand details (Name, Owner, Contact, Email, Address, Website); editable via rich text editor by Admin/Agency Owner only.
• Contract Content: Section starts blank; supports rich text editing, Smart Fields (auto-populated system data), and Input Fields (client-entered data).
• Smart Fields: Grouped by category (Client, Event, Project, Brand); inserted as placeholders in Draft; auto-populated with actual data when sent.
• Input Fields: Support Field Label, Placeholder Text, and Required toggle; Required fields must be completed before client can sign.
• Signature Section: Minimum one client and one agency signature required (non-removable); supports multiple client signers; locked in Draft, editable when sending.
• Expiration Settings: Optional "Turn on file expiration" toggle with configurable duration (1-365 Days/Weeks/Months); timer starts on send; expired contracts block client signing.
• Preview Function: Read-only view accessible from listing or Builder; displays complete contract with all elements.
• Save as Template: Saves all edits in Draft status; available only for Draft contracts.
• Publish Function: Changes status to Published; no content validation required; published contracts remain editable; edits apply to future sendings only.
• Duplicate: Creates copy with "Copy of [Name]", Draft status, and Signs reset to 0.
• Delete: Confirmation required; both Draft and Published contracts can be deleted.
• Search & Pagination: Real-time search by Contract Name and Brand; pagination with 10/25/50/100 rows per page.
• Unsaved Changes: System must prompt user before navigating away with unsaved changes.

10. Dependencies

Module/System

Dependency Type

Impact if Unavailable

Brand Module

Data dependency

Contract creation blocked; brand dropdown empty; logo and address auto-fill fails

Brand Settings Module

Configuration dependency

Logo and address details unavailable; contract displays without branding

Project Module

Data dependency

Project-related Smart Fields not populated; placeholders remain unfilled

Client Management Module

Data dependency

Client Smart Fields empty; signature assignment fails

Event Module

Data dependency

Event Smart Fields not populated; event details unavailable

File Storage System

Service dependency

Logo display fails; broken image shown

Rich Text Editor Service

Service dependency

Content editing non-functional; formatting unavailable

Smart Fields Service

Feature dependency

Dynamic placeholders cannot be inserted or auto-populated

Input Fields Service

Feature dependency

Client data collection fields cannot be added

Signature Capture Service

Feature dependency

Signature placeholders non-functional; contract execution blocked

User/Authentication Module

Service dependency

Permission checks fail; access restrictions not enforced

General Settings Module

Configuration dependency

Date format not applied; default format displayed

Save/Persistence Service

Service dependency

Contract changes not saved; data lost

PDF Generation Service

Service dependency

Preview and PDF download unavailable

Proposal Module

Feature dependency

Contracts cannot be bundled with proposals

Send Contract Module

Feature dependency

Contracts cannot be sent to clients

Expiration Service

Service dependency

Expiration countdown not triggered; contracts remain active indefinitely

Network/API Service

Service dependency

Data fetch, save, and publish operations fail

12. Reference

• Figma Link - Click Here

☑️ Share Contract with Proposal & Manual

1. Module Overview

• Module Name: Send Contract
• Purpose: The Send Contract module enables authorized users to send published client contracts to recipients for signature. It provides two primary methods for contract delivery: bundling contracts within proposals or sending standalone contracts from the project details page. The module includes comprehensive signature configuration capabilities, allowing users to assign multiple signers, customize email delivery, and generate unique shareable links for each recipient.
• Business Goals
  • Enable seamless delivery of client contracts through multiple channels (email and shareable links).
  • Support flexible signature workflows by accommodating multiple signers (e.g., bride and groom, business partners).
  • Streamline the client onboarding process by integrating contracts with proposals.
  • Provide alternative sharing methods through unique, trackable links for each recipient.
  • Ensure contract delivery tracking and audit trail through system-logged activities.
  • Maintain security by generating individual, non-transferable links for each signer.
  • Support sequential signing workflows where clients sign first followed by agency countersigning.

2. Roles & Permissions

• Roles and permissions - draft

3. User Flow

• Click Here to view the detail user flow

4. Functional Logic

4.1 Contract Sending Workflow

Client contracts can be sent to clients through two primary methods: bundled within a proposal as part of the proposal workflow, or sent manually as standalone documents through the Project Details page.

4.1.1 Primary Agency Signer Determination

• Sending via Proposal: When a contract is sent bundled within a proposal, the Agency Owner automatically becomes the primary signer for counter-signature by default.
• Manual Sending: When sending contracts manually, the user who shares the contract (Agency Owner, Admin, or Project Owner) becomes the primary signer for counter-signature.
• Primary Signer Requirement: The primary signer is always required and must sign for every contract; their signature is mandatory and triggers completion checks.
• Reassign to Other Team Members: The default signer can reassign the signing responsibility to other team members using the "Assign To" dropdown; selecting another user transfers the primary signer role to them.

4.1.2 Method 1: Sending Contracts with Proposals

• Contracts can be bundled directly inside a proposal, allowing clients to receive all documents—proposal details, package offerings, and contract terms—in a single unified package.
• When building or editing a proposal template, users can attach a published contract template using the "+ Add Contract" button in the Contract section.
• The system opens a modal displaying all published contract templates; each entry shows the contract name, template type, and a checkbox for selection (single-selection only).
• Once a template is selected and "Add to Proposal" is clicked, it is automatically added to the proposal content and will be included when the proposal is sent to the client.
• Editable Before Sending: Users can revise their choice anytime before sending the proposal; they may remove the contract, replace it with another template, or update other proposal content without restrictions.
• Contract Delivered Together With Proposal: When the proposal is sent to the client, the attached contract is included automatically; the client receives everything—proposal details + pricing + contract terms—in a single unified experience.

4.1.3 Method 2: Sending Standalone Contracts from Project Details

• For cases where a contract needs to be sent independently, users can access the specific Project Details page that is created after a lead converts into a project.
• Within this page, the Files/Documents → Documents & Forms tab provides a centralized location to create or send project-related documents.
• Clicking the "+" icon opens the Add New Document modal, where users choose "Contract" and can search or browse templates categorized by type (Client Contract, Service Agreement).
• Each template shows a "Review & Send" button, allowing users to open the contract, preview its structure, and make any necessary edits before sending.
• This method supports flexible contract handling—ideal when only the contract needs to be issued without sharing a proposal.

4.1.4 Send Eligibility & Resend Logic

• Never Sent: When a contract has not been sent before, the user will always see an active "Review & Send" button; this allows the user to open the contract, review the content, and send it for the first time.
• Previously Sent Contracts: When a user has manually sent a contract, the card displays: "Sent on [Date] • Expires on [Date]" with a "Review & Send" button available for resending at any time.
• Resend Available Anytime: Users can resend the contract at any time through project details> Files and documents.
• Resend Behavior — Unsigned Contracts: When a user resends a contract that has not been signed, the previously shared version automatically expires and becomes invalid; the client receives the new contract with a fresh expiration period.
• Resend Behavior — Signed Contracts: If the previously shared contract was already signed by the client, it remains viewable in the system for audit and record-keeping purposes; the client is notified about the newly resent contract and must sign the new version.

4.2 Final Review & Sending

4.2.1 Pre-Send Preview

• Before sending, users can click Preview to see the exact client-facing version of the contract, including Smart Fields populated with actual data, formatting, and assigned signature fields.

4.2.2 Share Contract Modal via Email

• When proceeding to send, the Share Contract modal opens, allowing users to configure:
  • Email To: Displays project participants, prefilled with assigned clients, while allowing users to add or remove recipients via a searchable multi-select.
  • Subject: Editable email subject line.
  • Message: Rich text email body with formatting tools.
  • Template: Optional selection of predefined email templates.
• Send Option: Choosing Send delivers the contract directly via email; the client receives a "Get Started" button that opens the contract for review and signing.
• Copy / Generate Link: Users can create or copy a unique, tokenized shareable link; refer to the link for more detailed logic - Click Here
• Email Preview Before Sending: Users can view a complete email preview—showing Smart Fields, formatted message, and selected recipients—to confirm accuracy before final delivery.

4.2.3 Generate Link Logic

• Initial Generation: Clicking "Generate Link" shows a confirmation modal; upon confirmation, the system creates unique tokenized URLs for each recipient/signer.
• Agreement Activation: The moment the link is generated, the contract becomes active in the system; users can share the link directly without sending an email, providing an alternative delivery method. It also appears in the activity tab and files and document listing in the project details.
• Unique Links Per Recipient: Each link is tied to a specific signer with their profile, name, and email displayed—ensuring individual tracking, personalized access, and audit trail.
• Security: Links are non-transferable; system verifies recipient identity before granting document access; security notice reminds users not to share links beyond intended recipients.
• Post-Generation Access: After links are generated, button changes from "Generate Link" to "Copy Link"; users can reopen Share Link modal anytime to copy and share links via alternative channels (WhatsApp, SMS, Slack, etc.).
• Link Expiration: Generated links remain active until the contract is completed or expires (based on configured expiration settings).

4.3 Multiple Client Signers

• The system supports multiple client signers for scenarios such as:
  • Two partners (e.g., bride and groom)
  • Business partners (e.g., partner one and partner two)
  • Multiple stakeholders requiring approval
• Adding Client Signature Fields: Users can add multiple client signers by clicking "+ Add Signature" which creates a new signature field for the client.
• Signature Settings Panel: Clicking on a specific signature field opens a settings panel on the right side, allowing users to configure the signer assignment and requirements.
• Assign To Functionality: Within the settings panel, users can assign the signature field to any client signer attached to the project using the "Assign To" dropdown; the system auto-populates with project participants.
• Add New Participant: If the intended signer is not listed in project participants, users can add them using the "+ Add New Participant" option within the settings panel.
• Signature Required Checkbox: Users can mark a signature field as mandatory by enabling the "Signature Required" checkbox; mandatory signatures must be completed before contract completion, while unchecked fields are optional and do not block completion.
• Independent Signing: Each client signer receives the contract and must sign independently; all signatures are tracked separately with individual timestamps and IP addresses.

4.4 Additional Agency Signers

• Adding Signers: Users can add additional agency signers using the "+ Add Signature" option in Signature Settings.
• Mandatory vs Optional:
  • If an additional signer is marked as "Signature Required," they must sign before the contract can be completed.
  • If an additional signer is not marked on “Signature Required”, their signature is optional and does not block completion.
• No Signing Order: There is no required signing sequence among agency signers; all signers can sign in any order, as long as mandatory signers sign at some point.
• Minimum Requirement: At least one client signature and one agency signature are required; these mandatory fields cannot be removed from the contract.

4.5 Sequential Signing Logic

The system follows a fixed signing order to maintain legal validity and avoid conflicts:

• Client Signs First: All client(s) must complete their signatures before the agency can sign.
  • Each client has their own individual signing flow.
  • Once signed, their signature displays with timestamp (e.g., "July 19, 2025 at 8:51 am"), signer's name and email, and IP address (e.g., "IP: 144.44.253.71").
  • Clients cannot edit anything after signing.
  • If multiple clients are assigned, each must complete their signature independently.
• Primary Agency Signer Signs Next: After all client(s) have finished signing, the primary agency signer automatically receives a notification informing them that their counter-signature is required.
• Contract Completion: When all required parties have signed, the system updates the contract status to "Completed"; all parties receive notification of completion; the completed contract is available for download by all signers.
• While In Progress:
  • Status stays "In Progress" until all required signatures are collected.
  • Clients can still view the contract but can no longer make changes.
  • Agency signature fields show as pending until signed.
  • Progress is visible to all parties.

4.6 Post-Sharing Impact

Once a client contract is shared, the system automatically updates all relevant sections for both the agency and the client. Each action is logged to maintain full transparency and traceability.

4.5.1 Project Details — Activity Tab

• Every action taken on the contract—created, sent, viewed, signed, completed, expired—is recorded as a chronological activity entry.
• Each entry includes the user's profile image, timestamp, and a "View Contract" shortcut for quick navigation.
• The timeline ensures agencies can track client engagement and signature progress at any time.

4.5.2 Project Details — Files/Documents Tab

• As soon as the contract is shared, it appears inside the Documents & Forms list with details such as:
  • Contract name
  • Type (Client Contract)
  • Created date
  • Recipient
• The kebab menu allows quick actions:
  • Preview Contract
  • Download PDF
  • Delete
• Clicking the document redirects users to the Contract Details View for complete visibility.

4.5.3 Project Details — Contract Details View

• Accessible from Activity logs or the Files/Documents tab.
• Header Area:
  • Shows contract name
  • Current status (Draft / Sent / Signed / Completed / Expired)
  • Actions such as Download PDF or Countersign (if agency signature is required)
• Signers Section:
  • Lists all client and agency signers with:
    • Photo or initials
    • Name
    • Signing status (Pending / Signed)
    • Last viewed timestamp
• Client-Entered Fields:
  • Displays all form fields filled by the client (address, contact details, event details, etc.)
• File Activity Log:
  • Shows a structured timeline of all contract-related actions for audit and compliance.

4.5.4 Client Portal — Dashboard & Event Details

• The client can access the contract from:
  • Their Dashboard
  • Event Details page
  • Files/Documents section
• A clear status label appears (Pending, Viewed, Signed, Expired).
• Clients can:
  • Open and review the contract
  • Sign it electronically
  • Download the signed PDF
• After signing, the portal displays: "Signed on [Date]"
• If the contract expires before signing, the client sees: "This contract has expired. Please contact your agency for renewal."

5. Field Details & Validation

5.1 Add Contract Modal Fields

Field Name

Field Type

Description

Validation Rules

Add Contract

Modal Title

Header text displayed at top of modal

Static text; read-only

Selection

Checkbox

Allows user to select a contract for adding to proposal

Single selection only; selecting a new contract auto-deselects the previous selection

Contract Name

Text (Display)

Name of the published contract template

Read-only in listing view

Template Type

Tag/Badge

Contract category indicator (e.g., Client Contract, Service Agreement)

Read-only; displays assigned template type

Cancel

Button (Secondary)

Closes modal without adding any contract

No validation; discards any selection made

Add to Proposal

Button (Primary)

Adds selected contract to the proposal

Disabled until a contract is selected; enabled only when one contract is selected

5.2 Add New Document Modal

Field Name

Type

Validation Rules

Modal Header

Text

Static text: "Add New Document"

Close Icon

Icon Button

"X" icon; closes modal without action

Document Type Tabs

Tab Navigation

Options: Invoice, Proposal, Contract, Questionnaires; defaults to Contract tab when accessed from contract flow

Search Bar (Primary)

Text Input

Placeholder: "Search"; filters across all document types

Contract Sub-Tabs

Tab Navigation

Options: Client Contract, Service Agreement; defaults to Client Contract

Contract Icon

Folder Icon

Blue folder icon displayed for each contract template

Contract Name

Text (Display)

Displays contract template title (e.g., "Main Contract", "Bridal shoot contract", "Product photoshoot contract")

Template Type Label

Text (Display)

Gray text below contract name; displays "Contract Template"

Expiration Info

Text (Display)

Gray text; displays one of: "Expires in [X] weeks after sending" or "No expiration date" or "Expiration date: [Date]"

Review & Send Button

Primary Action Button

Yellow button; appears for each contract row; navigates to Contract Review Interface

Empty State

System Message

Displays when no contracts match search criteria: "No contracts found"

List Population

System Rule

Displays only published contract templates; draft contracts excluded

5.3 Review & Edit modal

• For review and edit modal, refer to the link - Click Here

5.4 Share Contract Modal — Email Sharing

• For share contract modal, refer to the link - Click Here

5.3 Email Preview Modal

• For share Email Preview Modal, refer to the link - Click Here

5.4 Send Confirmation Modal

• For Send Confirmation Modal, refer to the link - Click Here

5.5 Generate Link — Field Details

• For Generate Link, refer to the link - Click Here

6. Success Message Handling

Validation Scenario

Success Message

Contract added to proposal

"Contract added successfully."

Contract removed from proposal

"Contract removed from proposal."

Contract replaced in proposal

"Contract replaced successfully."

Contract sent via email

"Contract Sent" (with green checkmark icon)

Link generated successfully

"Links generated successfully."

Link copied to clipboard

"Link copied to clipboard."

New participant added

"Participant added successfully."

Contract counter-signed by agency

"Contract counter-signed successfully."

Contract completed (all parties signed)

"Contract completed. All parties have signed."

7. Error Message Handling

Field

Validation Scenario

Error Message

Contract List

No published contracts available

"No published contracts available. Please publish a contract template first."

Search

No contracts match search query

"No contracts found."

Email To

No recipient selected

"Please add at least one recipient to send the contract."

Send Contract

Email delivery failed

"Failed to send a contract. Please try again."

Generate Link

Link generation failed

"Unable to generate a link. Please try again."

Contract Access

Contract expired

"This contract has expired. Please contact your agency for renewal."

Add Participant

Required fields missing

"Please fill in all required fields."

8. Edge Cases

Scenario

Expected Behavior

No published contracts available

Add Contract modal displays empty state: "No published contracts available. Please publish a contract template first."

Contract template deleted after adding to proposal (before sending)

System displays warning: "The attached contract is no longer available." Users must select a new contract before sending.

User tries to send contract without adding recipients

The send button remains disabled; tooltip displays: "Please add at least one recipient to send the contract."

Recipient removed from project after link generated

Previously generated links remain active for that recipient until the contract expires or is completed.

Contract expires while client is viewing

Client sees message: "This contract has expired. Please contact your agency for renewal." Signing is disabled.

Client accesses contract after signing

Contract displays in read-only mode with "Signed on [Date]" status; Download PDF option available.

Client signs but agency hasn't counter-signed

Contract status shows "Pending Counter-Signature"; client sees "Awaiting agency signature" message.

Agency owner unavailable for counter-signing

System continues to show pending status; contract remains in "Awaiting Counter-Signature" state until completed.

Same contract resent to same recipient

New email is delivered; previously generated links remain active; Activity Tab logs new send action.

User attempts to delete mandatory signature field

Delete icon disabled; tooltip displays: "This signature cannot be deleted. You must have at least one client signature and one team member signature."

Network failure during contract send

Error message: "Failed to send contract. Please try again." The contract remains in Draft status.

Unauthorized user accesses contract link

System denies access; displays: "You do not have permission to access this contract."

Project archived after contract sent

Contract remains accessible via direct link; Activity Tab logs are preserved; contract can still be signed and completed.

All signers complete signing

Contract status updates to "Completed"; all parties receive confirmation; PDF becomes available for download.

User closes Share Contract modal without sending

No changes saved; contract remains in Draft status; no activity logged.

9. Test Cases

10. Acceptance Criteria

• Access & Sending Methods: Contracts can be sent via two methods: (1) bundled within a proposal using "+ Add Contract" in proposal builder, or (2) standalone from Project Details → Files/Documents → Documents & Forms using "+" icon; both methods accessible to Owner/Admin/Project Owner.
• Add Contract Modal (Proposal): Opens on "+ Add Contract" click; displays only published contract templates; shows contract name, template type, and checkbox (single-selection only); "Add to Proposal" disabled until selection made; Cancel closes without action.
• Add New Document Modal (Project Details): Opens on "+" icon click; defaults to Contract tab; sub-tabs for Client Contract and Service Agreement; search filters templates by name; each template shows name, type label, expiration info, and "Review & Send" button; empty state shown if no published contracts exist.
• Contract in Proposal Builder: Added contract appears as dedicated block showing title and type; Remove/Replace options available before sending; contract auto-included when proposal is sent; client receives unified package (proposal + pricing + contract).
• Contract Review Interface: Header displays contract name, Draft status, Preview and Share Contract buttons; left panel shows contract structure (Logo, Contract, Image, Signature); main canvas displays full contract with draggable signature placeholders.
• Signature Settings: Opens from left panel; "Assign To" dropdown auto-populates with project participants; supports multiple signers; "+ Add New Participant" allows creating new contact or selecting existing; "Signature Required" toggle for mandatory/optional signatures; minimum one client + one agency signature required; delete disabled for mandatory signatures with tooltip explanation.
• Sequential Signing Workflow: Client signs first; system auto-notifies agency owner for counter-signature; audit trail maintained with timestamps for each signing action.
• Share Contract Modal: Email To field displays project participants as multi-select with removable chips; Subject and Message fields optional; Template dropdown for predefined templates; Preview shows formatted email as recipient will see; Send delivers contract via email; Generate/Copy Link creates unique recipient links.
• Generate Link Logic: First click shows confirmation modal; generates unique tokenized URL per recipient; Share Link modal displays recipient profile, name, email, and individual "Copy Link" button; button changes from "Generate Link" to "Copy Link" after generation; links remain active until contract completed or expired.
• Link Security: Each link tied to a specific recipient; system verifies identity before granting access; non-transferable; security message reminds users not to share beyond intended recipients; unauthorized access displays error message.
• Post-Send Confirmation: Success modal displays green checkmark with "Contract Sent" message; contract status updates from Draft to Sent; activity logged in Project Details Activity Tab.
• Activity Tab Updates: All actions logged chronologically (created, sent, viewed, signed, completed, expired); each entry shows user profile, timestamp, and "View Contract" shortcut.
• Files/Documents Tab Updates: Sent contract appears in Documents & Forms list with name, type, created date, and recipient; kebab menu provides Preview, Download PDF, and Delete options; clicking document opens Contract Details View.
• Contract Details View: Accessible from Activity Tab or Files/Documents; header shows contract name, status (Draft/Sent/Signed/Completed/Expired), Download PDF and Countersign actions; Signers section lists all parties with photo, name, status (Pending/Signed), and last viewed timestamp; displays client-entered fields and file activity log.
• Client Portal Access: Contract accessible from Dashboard, Event Details, and Files/Documents; status label displayed (Pending/Viewed/Signed/Expired); client can open, review, sign electronically, and download signed PDF; shows "Signed on [Date]" after signing; expired contracts display renewal message.
• Expiration Handling: Contracts follow configured expiration settings; expired contracts disable signing; client sees "This contract has expired. Please contact your agency for renewal."; generated links expire based on contract expiration.
• Empty States: No published contracts: "No published contracts available. Please publish a contract template first."; No search results: "No contracts found."; No recipients selected: Send button disabled with tooltip.

11. Dependencies

Module/System

Dependency Type

Impact if Unavailable

Contract Templates Module

Data dependency

No published contracts available for selection; Add Contract modal displays empty state; users cannot attach contracts to proposals or send standalone contracts

Projects Module

Data dependency

Project Details page inaccessible; standalone contract sending not possible; project participants not available for recipient selection; Activity Tab logging fails

Proposal Module

Feature dependency

Contracts cannot be bundled with proposals; "+ Add Contract" option non-functional in proposal builder; unified proposal-contract delivery not possible

Contacts/Participants Module

Data dependency

Recipient dropdown empty; "Assign To" field cannot auto-populate signers; "+ Add New Participant" fails; email delivery not possible

Email/Notification System

Service dependency

Contract email delivery fails; counter-signature notifications not sent; client does not receive "Get Started" link; system falls back to Generate Link option only

Signature Module

Feature dependency

Signature settings panel non-functional; signature fields cannot be configured; sequential signing workflow breaks; contract completion not possible

Client Portal

Feature dependency

Clients cannot access, view, or sign contracts; contract status remains "Sent" indefinitely; signed PDF download unavailable; signing workflow incomplete

Link Generation Service

Service dependency

"Generate Link" fails; unique recipient URLs not created; alternative sharing methods (SMS, WhatsApp, Slack) unavailable; only email delivery possible

Activity/Audit Log System

Data dependency

Contract actions not logged; Activity Tab empty; audit trail unavailable; compliance tracking compromised; "View Contract" shortcuts non-functional

File Storage System

Service dependency

Contract PDF generation fails; download options unavailable; contract preview may not load; Files/Documents tab incomplete

Agency Settings Module

Configuration dependency

Expiration settings not applied; default configurations used; template type categorization may be incomplete

12. References

• Figma Design Link - Click Here

☑️ Sign Contract - Client Side

1. Module Overview

1.1 Module Name - Sign Contract - Client Side

1.2 Purpose - The Sign Contract - Client Side module provides the client-facing interface for reviewing and signing contracts sent by agencies. It enables clients to access contracts through multiple channels (Client Portal, email links, or unique tokenized URLs), review the complete agreement with auto-populated Smart Fields, capture signatures electronically (via typing or drawing), complete required Input Fields, acknowledge terms and conditions, and submit the signed contract back to the agency. The module supports multiple client signers with individual signing flows and maintains a sequential signing workflow where clients sign first before agency countersigning.

1.3 Business Goals

• Provide clients with a seamless, professional contract signing experience across multiple access channels.
• Enable legally valid electronic signatures with proper consent capture and timestamping.
• Support flexible signature capture methods (type or draw) to accommodate client preferences.
• Ensure contract integrity through mandatory scroll completion, terms acknowledgment, and required field validation.
• Facilitate multi-party client signing for scenarios involving multiple stakeholders (e.g., couples, business partners).
• Maintain clear audit trails with signature timestamps and IP address capture for legal compliance.
• Enable clients to download PDF copies of contracts before and after signing.
• Trigger sequential signing workflow to notify agency owners for countersigning upon client completion.

2. Roles & Permissions

• Roles and permissions - draft

3. User Flow

• Click Here to view the detail user flow

4. Functional Logic

4.1 Contract Visibility in Client Portal

Once a client contract is shared, it becomes visible to the client in multiple locations within the Client Portal:

• Files/Documents Tab: Located under Project → Files/Documents → Documents & Forms sub-tab; contract appears in the document list with document icon, contract name, type designation, created date, and "Sign" action button; right-side panel displays quick actions (View, Preview, Download PDF, Sign Contract).
• Overview Activity Tab: Activity feed displays contract sharing events chronologically; entry shows "Shared a Contract for '[Project Name]'" with timestamp; "Sign contract" button appears inline for pending contracts; after signing, entry shows "You signed a Contract of '[Project Name]'" with "View" button.

4.2 Accessing the Contract

Clients can access contracts through multiple channels:

• From Client Portal (Files/Documents): Client navigates to the project's Files/Documents tab → selects Documents & Forms sub-tab → locates the contract and clicks the "Sign" button or selects "Sign Contract" from the right panel.
• From Client Portal (Overview Activity Tab): Client views the Activity feed on their overview tab → identifies the contract sharing notification → clicks "Sign contract" button to open the signing interface.
• From Email: Client receives email notification from agency containing contract details and "Get Started" call-to-action button; clicking "Get Started" opens the Sign Contract screen directly.
• From Unique Link: Agency shares a unique URL via alternative channels (SMS, WhatsApp, etc.); client opens the link directly; system verifies the token and displays the Sign Contract screen; each client receives their own unique link for individual tracking.

4.3 Contract Review

4.3.1 Full Contract View

• The client can read the complete contract including all sections.
• Contract displays with brand header (Logo, Brand Name, Address).
• All Smart Fields are auto-populated with:
  • Event/project details
  • Client information
  • Brand details
  • Dates and times
• Content sections are displayed in their defined order (e.g., Services Provided, Booking and Payment, Cancellation, Limitations and Liability, Mutual Understanding).

4.3.2 Signature Section Display

• The signature section shows all required signatures:
• Client Signature Field(s):
  • Labeled with client name followed by "(You)" indicator
  • Client email displayed below name
  • "Click to Sign" placeholder
  • Date field (auto-populated upon signing)
• Agency Signature Field(s):
  • Agency representative name
  • Agency email
  • Date field (pending until countersigned)

4.3.3 Input Fields Requirement

• If the contract includes Input Fields, they appear at designated positions in the contract.
• Example: "Please enter your full name to confirm: [Full Name]"
• All fields marked as "Required" must be completed before the client can sign or submit.
• Non-required Input Fields can be left empty.

4.3.4 Terms Acknowledgment

• A mandatory checkbox appears before the Submit button.
• Checkbox text: "I certify that I have read and agree to the terms and conditions mentioned in this contract."
• Clients must check this box before the Submit Contract button becomes enabled.

4.3.5 Action Buttons

• Download PDF:
  • Available at any time during the review process.
  • Downloads the current version of the contract.
  • The pre-signature PDF shows empty signature fields.
  • Post-signature PDF shows client signature with timestamp.
• Cancel — visible upon scrolling down the agreement, positioned below the Submit Contract button.
  • Allows the contractor to close the agreement without signing.
  • If the contractor has added a signature but clicks Cancel without submitting, the agreement closes without saving any changes — signature is discarded.
  • The contractor can return later to complete the signing process from the beginning.
• Submit Contract:
  • Becomes enabled only after ALL of the following requirements are met:
    • Contract has been scrolled from top to bottom
    • Client signature has been applied
    • All required Input Fields are completed
    • Terms acknowledgment checkbox is checked
  • Button remains disabled (grayed out) until all requirements are satisfied.

4.4 Signature Capture

4.4.1 Opening the Signature Modal

• Clicking the client's signature placeholder (or "Click to Sign" text) opens a dedicated Sign Contract modal.
• It displays two signature blocks; out of the two signature blocks (Client and Agency), clients can only sign in their own respective block—the agency signature block remains inaccessible to them.
• Modal title: "Sign Contract"
• Modal can be closed via X icon or Cancel button without saving.

4.4.2 Signature Method Tabs

• Type Signature Tab:
  • Input field with placeholder: "Type your name here"
  • As the client types their name, the system converts it to a signature-style font in real-time.
  • "Clear" button appears to reset the input.
  • Signature preview displays below the input.
• Draw Signature Tab:
  • Canvas area with placeholder: "Draw your signature here"
  • Clients can draw signatures using mouse or touch input.
  • "Clear" button allows the client to erase and redraw.
  • Drawn signature displays in real-time on the canvas.

4.4.3 Signature Modal Components

• Signature Area: Canvas or input box based on selected tab.
• Signer Info: Displays client name and current date below the signature area (e.g., "DARELI WILLIAMS • 20 JULY 2025").
• Legal Consent Statement:
  • Checkbox with consent text.
  • Text: "By taking this action, I, [Name], give my express consent to execute this document electronically, acknowledging its full legal validity and enforceability."
  • The checkbox is pre-checked but the client can review.
• Cancel Button: Closes modal without saving signature.
• Sign Contract Button: Applies the signature to the contract.

4.5 Signature Submission

4.5.1 Signature Applied

• Once the client clicks "Sign Contract" in the modal, the signature is applied to the field.
• The signature displays with:
  • Visual signature (typed or drawn)
  • Date and timestamp (e.g., "July 19, 2025 at 8:51 am")
  • Signer's name and email address
  • IP address captured at the time of signing (e.g., "IP: 144.44.253.71")
• The "Click to Sign" placeholder is replaced with the applied signature.

4.5.2 Required Fields Completion

• Client must complete all Input Fields marked as "Required" before submission.
• The system validates that no required fields are empty.
• Validation errors display inline if required fields are incomplete.

4.5.3 Terms Confirmation

• The acknowledgment checkbox must be checked to continue.
• Checkbox: "I certify that I have read and agree to the terms and conditions mentioned in this contract."
• The submit button remains disabled until the checkbox is checked.

4.5.4 Final Submission

• Clicking "Submit Contract" completes the client signing process.
• The system submits the signed contract back to the agency.
• Success modal displays:
  • Green checkmark icon
  • Message: "The Contract Submitted Successfully"
  • "Close" button
  • "Download PDF" button
• Contract status updates to reflect client signature completion.

4.6 Sequential Signing Logic

The system follows a fixed signing order to maintain legal validity and avoid conflicts:

4.6.1 Client Signs First:

• All client(s) must complete their signatures before the agency can sign.
• Each client has their own individual signing flow.
• Once signed, their signature displays with timestamp (e.g., "July 19, 2025 at 8:51 am"), signer's name and email, and IP address (e.g., "IP: 144.44.253.71").
• Clients cannot edit anything after signing.
• If multiple clients are assigned (e.g., bride and groom, business partners), each must complete their signature independently.

4.6.2 Primary Agency Signer Signs Next:

• • After all client(s) have finished signing, the primary agency signer automatically receives a notification informing them that their counter-signature is required.
  • For sending via proposal: Agency Owner becomes the primary signer by default.
  • For manual sending: The user who shares the contract (Agency Owner, Admin, or Project Owner) becomes the primary signer.

4.6.3 Additional Agency Signers (If Added):

• • Any additional agency signers can sign in any order (no required sequence).
  • Mandatory signers must complete their signatures before contract completion.
  • Optional signers do not block completion.

4.6.4 Contract Completion:

• • When all required parties have signed, the system updates the contract status to "Completed."
  • All parties receive notification of completion.
  • The completed contract is available for download by all signers.

4.6.5 While In Progress:

• • Status stays "In Progress" until all required signatures are collected.
  • Clients can still view the contract but can no longer make changes.
  • Agency signature fields show as pending until signed.
  • Progress is visible to all parties.

4.7 Expired Contract Handling

• For the details on the expired contract handling logic - Click Here

4.8 Post-Contract Signing Impact

Once a client signs the contract, the system automatically updates all relevant sections for both the agency and the client.

4.8.1 Contract Status Updates

• Status Change: Contract status updates from "Sent" or "Pending" to "Signed" (client signed) or "In Progress" (awaiting agency counter-signature).
• Timestamp Display: Client's signature displays with timestamp (e.g., "Signed on 12 Aug, 11:34 AM").
• Read-Only State: Contract becomes read-only for the client; no further edits permitted.

4.8.2 Agency Notification — Email, App & Dashboard

• Primary agency signer automatically receives notification that a counter-signature is required.
• Notification delivery is based on user's notification settings — user may receive email notification, in-app notification, or both.
• Notification includes client name, contract name, project details, and a direct link to sign.
• Dashboard Alert:
  • Pending counter-signature appears in the agency dashboard Notifications widget.
  • Alert displays contract name, client name and client role.
  • Clicking the alert navigates directly to the contract for counter-signing.

4.8.3 Project Details — Activity Tab

• Activity Log Entry: System logs "Client [Name] signed Contract" with timestamp.
• View Contract Shortcut: Activity entry includes "View Contract" link for quick navigation.
• Chronological Timeline: Signing action appears in proper sequence within the activity feed.

4.8.4 Project Details — Files/Documents Tab

• Status Update: Contract entry in Documents & Forms list updates to show "Signed" or "Awaiting Counter-Signature" status.
• Kebab Menu Options: Updated options available:
  • Preview Contract
  • Download PDF (with client signature)
  • Counter-Sign (if agency signature required)

4.8.5 Client Portal — Post-Signature State

• Contract View: Contract displays in read-only mode; client's signature appears with visual signature, timestamp with date and time, and IP address captured.
• Agency Signature Pending: Agency signature field(s) show as pending (name and email visible, no signature).
• Terms Checkbox: Appears checked and disabled after submission.
• Available Actions:
  • Download PDF: Available to download contract with client signature.
  • View: Can revisit and view the contract at any time.
  • No edit or modification options available.

4.9 PDF Download

4.9.1 Pre-Signature Download

• "Download PDF" button available during contract review.
• Downloaded PDF shows complete contract content.
• Signature fields appear empty/unsigned.
• Input Fields show current state (empty or partially filled).

4.9.2 Post-Signature Download

• "Download PDF" available after signing.
• Downloaded PDF includes:
  • Complete contract content
  • Client signature with timestamp
  • Agency signature field (pending or signed)
  • Completed Input Fields
  • Terms acknowledgment status

**5. Field Details & Validation

**5.1 Sign Contract Screen Fields

Field Name

Type

Validation Rules

Page Header

Text

Static text: "Sign Contract"

Brand Header

Display Section

Shows agency logo, brand name, and address; read-only

Contract Date

Text (Display)

Format as per agency settings (e.g., "Aug 12, 2024"); read-only

Contract Sections

Text (Display)

Displays all content sections in defined order (e.g., Services Provided, Booking and Payment, Cancellation, Limitations and Liability, Mutual Understanding); read-only

Input Field

Text Input

Placeholder shows field label (e.g., "Full Name"); required fields must be completed before submission; non-required fields can be left empty

Client Signature Placeholder

Clickable Area

Displays "Click to Sign" text; opens Sign Contract modal on click

Client Name

Text (Display)

Displays client name with "(You)" indicator; read-only

Client Email

Text (Display)

Displays client email address; read-only

Client Signature Date

Text (Display)

Empty before signing; auto-populates with timestamp and IP address upon signing (e.g., "July 19, 2025 at 8:51 am • IP: 144.44.253.71")

Agency Name

Text (Display)

Displays agency representative name; read-only

Agency Email

Text (Display)

Displays agency email address; read-only

Agency Signature Date

Text (Display)

Shows "Date" placeholder until agency counter-signs; read-only

Terms Acknowledgment

Checkbox

Text: "I certify that I have read and agree to the terms and conditions mentioned in this contract."; must be checked before Submit Contract is enabled

Download PDF

Button (Secondary)

Available at any time; downloads current contract state as PDF

Submit Contract

Button (Primary)

Disabled until: (1) contract scrolled top to bottom, (2) client signature applied, (3) all required input fields completed, (4) terms checkbox checked

5.2 Sign Contract Modal Fields

Field Name

Type

Validation Rules

Modal Header

Text

Static text: "Sign Contract"

Close Icon

Icon Button

"X" icon at top-right; closes modal without saving signature

Type Signature Tab

Tab Navigation

First tab option; displays text input for typed signature; active by default

Draw Signature Tab

Tab Navigation

Second tab option; displays canvas for drawn signature

Type Signature Input

Text Input

Placeholder: "Type your name here"; converts text to signature-style cursive font in real-time; minimum 1 character required; whitespace-only not accepted

Draw Signature Canvas

Canvas Area

Placeholder: "Draw your signature here"; accepts mouse or touch input; signature renders in real-time

Clear Button

Text Button

Appears on right side after input detected; resets typed text or clears drawn canvas; hidden when input is empty

Signer Info

Text (Display)

Format: "[CLIENT NAME] • [DATE]" (e.g., "DARELI WILLIAMS • 20 JULY 2025"); read-only; auto-populated from contract data

Legal Consent Checkbox

Checkbox

Pre-checked by default; must remain checked to enable Sign Contract button

Legal Consent Text

Text (Display)

Format: "By taking this action, I, [Name], give my express consent to execute this document electronically, acknowledging its full legal validity and enforceability."; client name displayed in bold

Cancel Button

Button (Secondary)

Left-aligned; closes modal without saving; no validation required

Sign Contract Button

Button (Primary)

Right-aligned; yellow button; applies signature to contract document

6. Success Message Handling

Validation Scenario

Success Message

Signature applied successfully

No explicit message – Signature appears in signature field with timestamp

Contract submitted successfully

"The Contract Submitted Successfully" (with green checkmark icon)

PDF downloaded successfully

No explicit message – PDF file downloads to device

Input field completed

No explicit message – Field value saved in real-time

Terms acknowledgment checked

No explicit message – Submit Contract button becomes enabled

Contract scrolled completely

No explicit message – Scroll requirement marked as complete

7. Error Message Handling

Field

Validation Scenario

Error Message

Contract Access

Invalid or expired link

"This link is invalid or has expired. Please contact your agency for a new link."

Contract Access

Unauthorized access attempt

"You do not have permission to access this contract."

Contract Access

Contract expired

"This contract has expired. Please contact your agency for renewal."

Signature

Signature not applied before submit

"Please sign the contract before submitting."

Signature

Empty typed signature

"Please enter your name to create a signature."

Signature

Empty drawn signature

"Please draw your signature to continue."

Signature

Legal consent unchecked

"Please accept the legal consent to apply your signature."

Input Fields

Required field empty

"Please complete all required fields before submitting."

Input Fields

Invalid field format

"Please enter a valid value for this field."

Terms Acknowledgment

Checkbox not checked

"Please agree to the terms and conditions to submit the contract."

Submit Contract

Contract not scrolled completely

"Please review the entire contract before submitting."

Submit Contract

Submission failed

"Failed to submit contract. Please try again."

Submit Contract

Network error during submission

"Connection lost. Please check your internet and try again."

PDF Download

Download failed

"Failed to download PDF. Please try again."

Session

Session expired during signing

"Your session has expired. Please reload the page and try again."

8. Edge Cases

Scenario

Expected Behavior

Client accesses contract via expired link

Contract does not load; error message displayed: "This contract has expired. Please contact your agency for renewal."

Client accesses contract via invalid/tampered link

Access denied; error message displayed: "You do not have permission to access this contract."

Client attempts to sign agency's signature block

Agency signature block remains inaccessible; only client's own signature field is clickable

Multiple clients assigned to same contract

Each client receives their own unique link; each client can only sign their own respective signature field; other client signature fields show as pending

Client closes browser before submitting signed contract

Signature not saved; client must re-sign when reopening the contract

Client attempts to submit without completing required Input Fields

Submit button remains disabled; inline validation errors highlight incomplete required fields

Client attempts to submit without checking terms acknowledgment

Submit button remains disabled; checkbox highlighted as required

Client attempts to submit without scrolling entire contract

Submit button remains disabled until contract is scrolled from top to bottom

Client types very long name in Type Signature field

Name truncated or scaled to fit signature area; signature remains legible

Client draws signature but clicks Cancel

Signature modal closes; no signature saved; "Click to Sign" placeholder remains

Client clears drawn signature and submits empty canvas

Sign Contract button disabled until valid signature is drawn

Network failure during contract submission

Error message: "Connection lost. Please check your internet and try again."; signed data retained for retry

Session timeout while reviewing contract

Client redirected to re-authenticate or refresh link; unsaved signature lost

Contract expires while client is reviewing

Signing disabled upon submission attempt; message: "This contract has expired. Please contact your agency for renewal."

Client refreshes page after applying signature but before submitting

Signature lost; client must re-sign; Input Field data may be retained based on auto-save

Client opens contract on mobile device

Contract renders in mobile-responsive layout; signature capture supports touch input

Client attempts to access contract already signed by them

Contract displays in read-only mode; signature visible with timestamp; no re-signing option available

Agency resends new contract while client is signing old version

Old contract becomes invalid upon submission attempt; client notified to access new contract

Client downloads PDF before signing

PDF downloads with empty signature fields; Input Fields show current state

Client downloads PDF after signing

PDF downloads with client signature, timestamp, and IP address; agency signature shows as pending

Smart Fields fail to populate

Placeholders display as fallback (e.g., "[Client Name]"); client can still proceed with signing

Input Field contains special characters

System accepts valid special characters; validation applied based on field type

Client navigates away with partially completed Input Fields

Data may be lost; no auto-save confirmation; client must re-enter data upon return

Multiple browser tabs open with same contract

Both tabs display contract; only one submission accepted; second submission fails with error

Client signs on low-bandwidth connection

Signature capture may lag; submission queued and retried; progress indicator displayed

Contract has no Input Fields

Input Fields section hidden; client proceeds directly to signature and submission

Client accesses contract after agency has counter-signed

Contract displays in read-only mode with "Completed" status; both signatures visible; PDF download available

Browser crashes during signature drawing

Drawn signature lost; client must restart signing process

Client accesses contract from unsupported browser

Warning displayed; basic functionality may work; recommended to use supported browser

Touch signature too small or illegible

System accepts signature; no minimum size validation; client can clear and redraw if desired

9. Test Cases

10. Acceptance Criteria

• Contract Visibility: Contract must appear in Client Portal under Files/Documents tab and Overview Activity tab with "Sign" button; Activity feed shows "Shared a Contract for '[Project Name]'" with timestamp.
• Access Methods: Clients can access via Files/Documents tab, Activity tab "Sign contract" button, email "Get Started" button, or unique tokenized URL; system must verify token before displaying contract.
• Contract Display: Must show complete contract with brand header, auto-populated Smart Fields, client signature field(s) with "(You)" indicator, and agency signature field(s) as pending.
• Signature Restriction: Clients can only sign their own signature block; agency signature block remains inaccessible.
• Input Fields & Terms: Required Input Fields must be completed before signing; mandatory terms checkbox must be checked before Submit button enables.
• Submit Button Conditions: Submit Contract enabled only when: contract scrolled completely, signature applied, all required fields completed, and terms acknowledged.
• Signature Modal: Must provide Type Signature and Draw Signature tabs with Clear button, signer info display, legal consent checkbox, and Cancel/Sign Contract buttons.
• Signature Display: Once signed, must show visual signature, date/timestamp, signer name/email, and IP address captured at signing.
• Submission Success: Must display success modal with green checkmark, "The Contract Submitted Successfully" message, Close button, and Download PDF button.
• Sequential Signing: All clients must sign before agency can countersign; agency notified when all clients complete; multiple clients sign independently with unique links.
• Post-Signature State: Contract becomes read-only; client can view and download PDF; agency fields show pending until countersigned.
• Expired Contract: If expired, display: "This contract has expired. Please contact your agency for renewal."; signing disabled.
• Status Updates: Activity Tab and Files/Documents Tab must update to reflect signing status; all signatures tracked with timestamps.
• Mobile Support: Contract must render responsively; signature capture must support touch input.

10. Dependencies

Module/System

Dependency Type

Impact if Unavailable

Client Portal Module

Feature dependency

Clients cannot access contract via portal; Files/Documents tab and Activity tab inaccessible; only email/link access remains functional

Contract Template Module

Data dependency

Contract content unavailable; Smart Fields not populated; contract cannot be displayed for signing

Project Module

Data dependency

Project details and event information unavailable; Smart Fields display placeholder values; contract context incomplete

Client Management Module

Data dependency

Client information unavailable; signature fields cannot be pre-populated with client name and email; "Assign To" functionality fails

Brand Settings Module

Configuration dependency

Brand header (logo, name, address) not displayed; contract appears without branding elements

Smart Fields Service

Service dependency

Dynamic placeholders not replaced with actual data; contract displays raw placeholder tags (e.g., "[Client Name]"); manual data entry required

Signature Capture Service

Service dependency

Type and Draw signature functionality non-functional; clients cannot apply signatures; submission blocked

Email Notification Service

Service dependency

Contract sharing emails not delivered; clients do not receive "Get Started" link; must rely on alternative sharing methods

Link Generation Service

Service dependency

Unique tokenized URLs not created; alternative sharing via SMS/WhatsApp not possible; email-only delivery available

Token Verification Service

Service dependency

Link access verification fails; unauthorized access possible or all link access blocked; security compromised

PDF Generation Service

Service dependency

"Download PDF" functionality fails; clients cannot download contract before or after signing; error message displayed

Input Fields Service

Feature dependency

Custom input fields not rendered; required field validation non-functional; data collection incomplete

Activity Log Service

Data dependency

Contract signing actions not logged; Activity Tab not updated; audit trail incomplete

Files/Documents Module

Feature dependency

Contract not visible in Documents & Forms list; status updates not reflected; kebab menu actions unavailable

Agency Notification Service

Service dependency

Agency not notified when client signs; counter-signature workflow delayed; manual follow-up required

IP Capture Service

Service dependency

Signer's IP address not recorded; signature audit trail incomplete; legal compliance potentially affected

Timestamp Service

Service dependency

Signature date and time not captured; signed contract lacks temporal verification; audit trail incomplete

Session Management Service

Service dependency

Client session not maintained; timeout issues during signing; signature data lost on session expiry

Network/API Service

Service dependency

Contract data fetch fails; submission requests timeout; PDF download fails; error messages displayed

Authentication Service

Service dependency

Link token verification fails; client identity cannot be confirmed; access denied or security compromised

12. Reference

• Figma Link - Click Here

☑️ Countersign - Agency Side

1. Module Overview

1.1 Module Name : Countersign Contract - Agency Side

1.2 Purpose: The Countersign Contract - Agency Side module enables agency users to review client-signed contracts and apply their counter-signature to complete the contract execution process. Once all client(s) have signed the contract, the system triggers notifications to the agency owner and any additional agency signers, providing multiple access points to review the contract details, view client-submitted information, review the audit trail, and apply their counter-signature. The module supports both mandatory and optional additional agency signers with flexible signing order.

1.3 Business Goals

• Enable agency owners to efficiently receive and act on counter-signature requests through multiple notification channels.
• Provide comprehensive contract details view including signer status, client-submitted information, and complete audit trail.
• Ensure legal compliance by capturing agency counter-signatures with timestamps and consent acknowledgment.
• Support flexible agency signing workflows with mandatory and optional additional signers.
• Maintain a complete audit trail from contract creation through final completion.
• Automatically update contract status to "Completed" when all required signatures are collected.
• Notify all parties (clients and agency) upon contract completion.
• Preserve all contract data and activity logs for compliance and record-keeping.

2. Roles & Permissions

• Roles and permissions - draft

3. User Flow

• Click Here to view the detail user flow

4 Functional Logic

4.1 Counter-Sign Notification

Once all client(s) complete their signatures, the system triggers notifications to the agency:

• Email Notification: Primary agency signer receives email with subject "Counter-signature required for [Contract Name]" containing contract details and "Countersign Now" CTA button.
• In-App Notification: Notification appears in the agency user's notification center with direct link to contract.
• Dashboard Alert: Pending counter-sign contracts highlighted in Dashboard widgets or activity feed.
• Project Activity Tab: Activity log entry created: "The contract is signed by [Client Name]. Counter-signature required."

4.2 Accessing Contract for Counter-Signing

Agency users can access contracts pending counter-signature through multiple entry points:

• From Email: Click the "Countersign Now" button in notification email.
• From Notification Center: Click notification to open the contract directly.
• From Project Details — Activity Tab: Click "Countersign" button on the activity log entry or "View Contract" link.
• From Project Details — Files/Documents Tab: Locate contract in Documents & Forms list → Click to open Contract Details → Click "Countersign" button.
• From Contract Details View: "Countersign" button prominently displayed in header when counter-signature is pending.

4.3 Contract Details — Header, Signers, Information & Activity Logs

4.3.1 Header Section

• Back Arrow: Returns to previous page (Project Details).
• Contract Name: Displays contract title (e.g., "Contract 'Jadon & Monika Wedding'").
• Status Badge:
  • "In Progress" (yellow) — when signatures are pending
  • "Completed" (green) — when all required signatures collected
• Action Buttons:
  • "Download PDF" — downloads current contract state
  • "View Contract" — opens full contract content
  • "Countersign" (yellow) — appears only when counter-signature pending for current user

4.3.2 Signers Section

This section provides a clear snapshot of who needs to sign, who has already signed, and what actions are pending.

• Agency Owner (You):
  • Profile picture/avatar
  • Name with "(You)" indicator
  • Status display:
    • "In progress" — when signature is pending
    • "Signed (Date at Time)" in green — when signed
  • "Countersign" button appears when client has signed and agency signature is pending
  • "Last viewed" timestamp showing when user last accessed the contract
• Client Signer(s):
  • Profile picture/avatar
  • Client name
  • Status display:
    • "Not viewed" — client has not accessed the contract
    • "In progress" — client has viewed but not signed
    • "Signed (Date at Time)" in green — when signed
  • "Last viewed" timestamp
  • Displays "N/A" for Last viewed if never accessed
• Additional Agency Signers (if any):
  • Same display format as Agency Owner
  • Status indicates their signing progress
  • Mandatory signers indicated appropriately

This section ensures transparency by showing every signer's current position in the signing workflow.

4.3.3 Information Collected Section

This area displays all details submitted by the client through Input Fields within the contract.

• Before Client Signs:
  • Message displayed: "No information collected yet"
  • Sub-message: "Wait until your client complete contract from his side"
• After Client Signs:
  • All Input Field labels and values displayed
  • Example fields:
    • Venue: "Liberty House Wedding & Event Venue- 76 Audrey Zapp Dr, Jersey City"
    • Venue Address: "The Redwood Grove- 123 Forest Lane, Mill Valley, CA 94941"
    • Contact Number: "(415) 555-0199"
    • Event Date: "April 15, 2024"
  • Fields vary based on contract configuration
  • Read-only display of client-submitted data

This section gives the agency a complete overview of all client-submitted data in one place, ensuring that critical information is captured before countersigning.

4.3.4 File Activity Log

This is a chronological timeline that records every important action performed on the contract, providing a complete audit trail.

• Log Entry Format:
  • Icon/avatar of the user who performed the action
  • Action description with user name highlighted
  • Timestamp (Date • Time)
• Examples of Log Entries:
  • "The contract has been successfully created by [User Name]" — captures contract generation
  • "The contract has been successfully sent by [User Name]" — records when contract is shared
  • "The contract has been completed by [Client Name]" — marks client signing completion
  • "The document has been completed by all recipients" — final completion entry
• Log Ordering:
  • Most recent entries at the top
  • Chronological descending order
  • Complete history preserved

4.4 Counter-Signature Process (Agency Signing)

4.4.1 Starting the Counter-Sign Process

• When the client finishes signing, the agency user sees a "Countersign" button.Clicking it opens the Sign Contract modal, which uses the same signing interface as the client signing experience for consistency and ease of use.
• Button appears in:
  • Contract Details header
  • Signers section next to agency owner's entry
  • Activity Tab entry
• Clicking the button opens the Sign Contract modal.
• Modal uses the same signing interface as the client's signing experience for consistency.

4.4.2 Counter-Signature Modal

• Signature Options:
  • Type Signature Tab:
    • Input field with placeholder: "Type your name here"
    • System converts typed name to signature-style font
    • "Clear" button to reset input
  • Draw Signature Tab:
    • Canvas with placeholder: "Draw your signature here"
    • User draws signature via mouse or touch
    • "Clear" button to erase and redraw
• Signature Modal Components:
  • Signature area (canvas or input based on selected tab)
  • Signer info displays agency user's name and current date
• Legal Consent:
  • Checkbox with consent text (pre-checked)
  • Text: "By taking this action, I, [Name], give my express consent to execute this document electronically, acknowledging its full legal validity and enforceability."
  • Must remain checked to sign
• Action Buttons:
  • "Cancel" — closes modal without saving
  • "Sign Contract" — applies the counter-signature

4.4.3 Agency Signing Logic

• Primary Agency Signer Determination:
  • When sending contracts via proposal, the Agency Owner automatically becomes the primary signer for counter-signature.
  • When sending contracts manually, the user who shares the contract (Agency Owner, Admin, or Project Owner) becomes the primary signer for counter-signature and can sign.
  • Reassign to Other Team Members: The default signer can reassign the signing responsibility to other team members using the "Assign To" dropdown; selecting another user transfers the primary signer role to them.
• Primary Agency Signer Is Always Required:
  • The primary signer must sign for every contract.
  • Their signature is mandatory and triggers completion checks.
  • Cannot be bypassed or delegated.
• Completion Rules: The contract reaches "Completed" status when:
  • All client(s) have signed, AND
  • Primary Agency Signer has signed, AND
  • If manually sent, whoever has sent (agency owner, Admin or project manager) has to sign.

4.5 Post-Contract Completion State

4.5.1 Completed State in Contract Details View

• Contract is marked "Completed" with a green badge once all required signatures are collected (Client(s) + Primary Agency Signer + Mandatory Additional Signers).
• Available Actions:
  • "Download PDF" — downloads fully executed contract
  • "View Contract" — opens contract in read-only mode
  • "Countersign" button is removed/hidden
• Signers Section:
  • Every signer shows "Signed (Date at Time)" in green
  • Last viewed timestamps remain visible
• Information Collected:
  • All client-provided Input Field values remain visible
  • Data is read-only
• File Activity Log:
  • Completion entry added: "The document has been completed by all recipients"
  • Full audit history remains accessible for tracking

4.5.2 Client Completion Notification

• The client receives a notification/email upon contract completion.
• Message: "Your contract has been fully executed."
• In the Client Portal:
  • Contract status shows "Completed"
  • Final signed PDF is available for download
  • Contract displayed in read-only mode

4.5.3 Project Updates

• Project Activity Tab:
  • Logs a "Completed" entry with timestamp
  • Entry visible to all project team members
• Files/Documents Tab:
  • Contract displays with "Completed" badge
  • Updated status visible in document list
• Audit History:
  • Full audit history preserved for compliance and traceability
  • All actions, timestamps, and user information retained

5. Field Details & Validation

5.1 For field details & validations for Sign Service Agreement View - Click Here

5.2 For field details & Validation for Sign Service Agreement Modal — Type Signature - Click Here

6. Success Message Handling

Validation Scenario

Success Message

Counter-signature applied successfully

"Contract counter-signed successfully."

Contract completed (all signatures collected)

"Contract completed. All parties have signed."

PDF downloaded successfully

No explicit message – PDF file downloads to device

View contract accessed

No explicit message – Contract opens in view mode

Counter-sign notification received

No explicit message – Notification appears in notification center and email delivered

Client completion notification sent

No explicit message – System automatically notifies client of completion

Activity log entry created

No explicit message – Entry appears in Activity Tab in real-time

7. Error Message Handling

Field

Validation Scenario

Error Message

Signature

Empty typed signature

"Please enter your name to create a signature."

Signature

Empty drawn signature

"Please draw your signature to continue."

Signature

Legal consent unchecked

"Please accept the legal consent to apply your signature."

Counter-Sign

Counter-sign submission failed

"Failed to apply counter-signature. Please try again."

Counter-Sign

Contract already completed

"This contract has already been completed."

Counter-Sign

Unauthorized user attempts to countersign

"You are not authorized to counter-sign this contract."

Counter-Sign

Client has not signed yet

"Counter-signature is not available. Waiting for client signature."

Counter-Sign

Contract expired

"This contract has expired. Please resend a new contract to the client."

PDF Download

Download failed

"Failed to download PDF. Please try again."

Contract Access

Contract not found

"Contract not found. It may have been deleted or moved."

Network

Network error during counter-sign

"Connection lost. Please check your internet and try again."

Session

Session expired during signing

"Your session has expired. Please log in again."

Notification

Email notification failed

"Failed to send notification email. Contract signed successfully."

8. Edge Cases

Scenario

Expected Behavior

Agency user clicks Countersign before client has signed

Countersign button disabled or hidden; message displayed: "Counter-signature is not available. Waiting for client signature."

Contract expires before agency countersigns

Countersign blocked; error message: "This contract has expired. Please resend a new contract to the client."; contract status updated to "Expired"

Multiple clients assigned and only some have signed

Countersign button remains disabled until all assigned clients complete their signatures; Signers section shows individual status for each client

Agency user opens Countersign modal but clicks Cancel

Modal closes without saving; no signature applied; contract status unchanged

Agency user types name but clears signature before signing

Signature area reset to empty; Sign Contract button remains disabled until valid signature entered

Agency user draws signature but clicks Clear

Canvas cleared; user can redraw; Sign Contract button disabled until new signature drawn

Agency user unchecks legal consent checkbox

Sign Contract button disabled; signature cannot be applied until consent checkbox is re-checked

Network failure during counter-signature submission

Error message: "Connection lost. Please check your internet and try again."; signature data retained for retry

Session timeout while counter-signing

User redirected to login; unsaved signature lost; must re-authenticate and restart counter-sign process

Unauthorized user attempts to access Countersign

Countersign button hidden for unauthorized users; if accessed directly, error: "You are not authorized to counter-sign this contract."

Primary agency signer attempts to countersign a completed contract

Countersign button hidden; only Download PDF and View Contract options available

Multiple agency signers assigned — primary signer countersigns first

Contract may complete immediately if no mandatory additional signers; optional signers can still sign but won't block completion

Multiple agency signers assigned — additional mandatory signer hasn't signed

Contract remains "In Progress" even after primary signer signs; status updates to "Completed" only after all mandatory signers complete

Optional agency signer signs after contract is completed

Signature accepted but does not change completion status; signature recorded in audit trail

Agency user opens contract details before client signs

Information Collected section shows: "No information collected yet" with sub-message: "Wait until your client complete contract from his side"

Agency user views contract details after client signs

Information Collected section displays all client-submitted Input Field values in read-only format

PDF downloaded before agency countersigns

PDF shows client signature with timestamp; agency signature field appears empty/pending

PDF downloaded after agency countersigns

PDF shows all signatures (client and agency) with respective timestamps and IP addresses

Email notification fails to send after counter-sign

Counter-signature still applied successfully; system logs notification failure; client may not receive immediate notification

Multiple browser tabs open with same contract

Counter-signature applied from first submission; second tab shows outdated state until refreshed

Agency user rapidly clicks Sign Contract button multiple times

System processes first click only; subsequent clicks ignored to prevent duplicate submissions

Contract resent while agency is viewing old contract details

Old contract marked as expired; agency must access new contract version to countersign

Agency signer's name very long in signature field

Name scaled or truncated to fit signature area; signature remains legible and valid

Activity log fails to update after counter-sign

Counter-signature still valid; activity entry may appear on page refresh; no user-facing error

Client completion notification fails

Contract still marked as completed; notification retry may occur; client can access completed contract via portal

Contract has no Input Fields configured

Information Collected section displays: "No information collected" or section hidden entirely

Back arrow clicked with unsaved signature in modal

Modal should prompt or close without saving; user returned to previous page; signature not applied

9. Test Cases

10. Acceptance Criteria

• Counter-Sign Notifications: System must send email, in-app notification, and dashboard alert to primary agency signer when all client(s) complete signing; Activity Tab must log: "The contract is signed by [Client Name]. Counter-signature required."
• Access Points: Countersign button must be accessible from email notification, notification center, Activity Tab, Files/Documents Tab, and Contract Details header.
• Contract Details Header: Must display back arrow, contract name, status badge (In Progress/Completed), and action buttons (Download PDF, View Contract, Countersign when pending).
• Signers Section: Must display each signer's avatar, name, status (Not viewed/In progress/Signed), Last viewed timestamp, and Countersign button for pending agency signers.
• Information Collected: Before client signs: "No information collected yet"; after client signs: display all Input Field values in read-only format.
• File Activity Log: Must display chronological entries (newest first) with user avatar, action description, and timestamp; preserve complete history.
• Counter-Signature Modal: Must provide Type Signature and Draw Signature options with Clear button, signer info display, pre-checked legal consent checkbox, and Cancel/Sign Contract buttons.
• Primary Agency Signer: Via proposal: Agency Owner is primary signer; via manual send: user who shares becomes primary signer; primary signature is mandatory and cannot be bypassed.
• Additional Signers: Mandatory signers must sign before completion; optional signers do not block completion; no required signing sequence among agency signers.
• Completion Rules: Contract reaches "Completed" when all clients + primary agency signer + all mandatory additional signers have signed; optional signers do not prevent completion.
• Completed State: Status changes to "Completed" (green); Countersign button hidden; all signers show "Signed (Date at Time)"; Download PDF and View Contract available.
• Completion Notifications: System must notify client: "Your contract has been fully executed."; Client Portal shows "Completed" status with downloadable PDF.
• Project Updates: Activity Tab and Files/Documents Tab must reflect "Completed" status; full audit history preserved for compliance.

11. Dependencies

Module/System

Dependency Type

Impact if Unavailable

Client Contract Module

Data dependency

Contract details unavailable; counter-sign workflow cannot proceed; Contract Details View fails to load

Client Signing Module

Feature dependency

Client signature status unknown; counter-sign button may appear prematurely or not at all; completion logic fails

Project Module

Data dependency

Project Details page inaccessible; Activity Tab and Files/Documents Tab not available; navigation to contract fails

Signature Capture Service

Service dependency

Type and Draw signature functionality non-functional; agency users cannot apply counter-signature; submission blocked

PDF Generation Service

Service dependency

"Download PDF" functionality fails; agency cannot download contract before or after counter-signing; error message displayed

Email Notification Service

Service dependency

Counter-sign notification emails not delivered to agency signer; "Countersign Now" CTA unavailable; manual access required

In-App Notification Service

Service dependency

Notifications not displayed in notification center; agency signer not alerted of pending counter-signature

Dashboard Module

Feature dependency

Pending counter-sign contracts not highlighted in Dashboard widgets; agency signer may miss pending actions

Activity Log Service

Data dependency

Contract actions not logged; File Activity Log empty or incomplete; audit trail not maintained

Files/Documents Module

Feature dependency

Contract not visible in Documents & Forms list; status updates not reflected; access via Files/Documents Tab fails

User/Team Management Module

Data dependency

Agency signer information unavailable; "Assign To" functionality fails; additional signers cannot be identified

Client Management Module

Data dependency

Client signer information unavailable; Signers section displays incomplete data; client status unknown

Input Fields Service

Data dependency

Information Collected section empty or unavailable; client-submitted data not displayed

Authentication/Session Module

Service dependency

Counter-sign actions fail due to session issues; user redirected to login; unsaved signature lost

Client Portal Module

Feature dependency

Client completion notification fails; client cannot view completed contract; final PDF unavailable in client portal

IP Capture Service

Service dependency

Agency signer's IP address not recorded; signature audit trail incomplete; legal compliance potentially affected

Timestamp Service

Service dependency

Signature date and time not captured; signed contract lacks temporal verification; audit trail incomplete

Network/API Service

Service dependency

Contract data fetch fails; counter-signature submission fails; PDF download fails; error messages displayed

Notification Service (Client)

Service dependency

Client not notified of contract completion; client unaware agreement is fully executed

Audit Trail Service

Data dependency

Contract actions not recorded; compliance requirements not met; historical data incomplete

12. Reference

• Figma Link - Click Here