# Jobs UI Plugins {#jobs-ui-plugins}


The Jobs plugin system provides the frontend for job management in Ever Gauzy. It uses a **parent-child plugin group** architecture where `JobsPlugin` is the parent and child plugins contribute individual tabs and pages.


## Architecture {#architecture}






```mermaid
graph TD
    JP["JobsPlugin (parent)"]
    JE["JobEmployeePlugin"]
    JS["JobSearchPlugin"]
    JM["JobMatchingPlugin"]
    JPR["JobProposalPlugin"]
    JPT["JobProposalTemplatePlugin"]

    JP --> JE
    JP --> JS
    JP --> JM
    JP --> JPT
    JPR -.->|"sales-sections"| Sales["Sales Section"]

    style JP fill:#4CAF50,color:#fff
    style JPR fill:#FF9800,color:#fff
```






## Plugin Group Overview {#plugin-group-overview}


| Plugin | Tab / Page | URL | Permission |
|--------|-----------|-----|------------|
| [**JobsPlugin**](#jobsplugin-parent) | Jobs (parent layout) | `/pages/jobs` | `FEATURE_JOB` |
| [**JobEmployeePlugin**](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-employee-plugin/index.md) | Employee tab | `/pages/jobs/employee` | `ORG_JOB_EMPLOYEE_VIEW` |
| [**JobSearchPlugin**](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-search-plugin/index.md) | Browse tab | `/pages/jobs/search` | `ORG_JOB_SEARCH` |
| [**JobMatchingPlugin**](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-matching-plugin/index.md) | Matching tab | `/pages/jobs/matching` | `ORG_JOB_MATCHING_VIEW` |
| [**JobProposalTemplatePlugin**](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-proposal-template-plugin/index.md) | Proposal Template tab | `/pages/jobs/proposal-template` | `ORG_PROPOSAL_TEMPLATES_VIEW` |
| [**JobProposalPlugin**](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-proposal-plugin/index.md) | Proposals page (Sales) | `/pages/sales/proposals` | `ORG_PROPOSALS_VIEW` |



> [!NOTE]
> `JobProposalPlugin` registers under `sales-sections` (not `jobs-sections`), so it appears in the Sales menu rather than the Jobs menu. It is still passed as a child in `plugin-ui.config.ts` for organizational purposes.




## Registration {#registration}


All Jobs plugins are registered together via the `.init()` pattern in `plugin-ui.config.ts`:

```typescript
// apps/gauzy/src/plugin-ui.config.ts
import { JobsPlugin } from '@gauzy/plugin-jobs-ui';
import { JobProposalPlugin, JobProposalTemplatePlugin } from '@gauzy/plugin-job-proposal-ui';
import { JobEmployeePlugin } from '@gauzy/plugin-job-employee-ui';
import { JobSearchPlugin } from '@gauzy/plugin-job-search-ui';
import { JobMatchingPlugin } from '@gauzy/plugin-job-matching-ui';

export const uiPluginConfig: PluginUiConfig = {
  plugins: [
    JobsPlugin.init({
      plugins: [
        JobProposalPlugin,
        JobEmployeePlugin,
        JobSearchPlugin,
        JobMatchingPlugin,
        JobProposalTemplatePlugin
      ]
    }),
    // ...
  ]
};
```

The `.init()` method lets each deployment choose which child plugins to include. Omit a child to disable that tab.

---


## JobsPlugin (Parent) {#jobsplugin-parent}


| Property | Value |
|----------|-------|
| **Plugin ID** | `jobs` |
| **Package** | `@gauzy/plugin-jobs-ui` |
| **Version** | `1.0.0` |
| **Location** | `page-sections` |
| **Feature Key** | `FEATURE_JOB` |
| **Type** | Module-based plugin group |


### Plugin Definition {#plugin-definition}


```typescript
export interface JobsPluginDefinition extends PluginUiDefinition {
  init(opts: { plugins: PluginUiDefinition[] }): PluginUiDefinition;
}

export const JobsPlugin: JobsPluginDefinition = {
  id: 'jobs',
  version: '1.0.0',
  location: 'page-sections',
  module: JobsModule,
  routes: [JOBS_PAGE_ROUTE as PluginRouteInput],
  navMenu: [{
    type: 'config',
    config: {
      id: 'jobs',
      title: 'Jobs',
      icon: 'fas fa-briefcase',
      link: '/pages/jobs',
      data: {
        translationKey: 'MENU.JOBS',
        featureKey: FeatureEnum.FEATURE_JOB
      },
      items: []
    },
    before: 'employees'
  }],
  featureKey: FeatureEnum.FEATURE_JOB,
  plugins: [],

  init(opts: { plugins: PluginUiDefinition[] }): PluginUiDefinition {
    return { ...JobsPlugin, plugins: opts.plugins };
  }
};
```


### Navigation {#navigation}


Adds a **Jobs** menu item to the sidebar, positioned before "Employees", with the briefcase icon. Only visible when the `FEATURE_JOB` feature flag is enabled.


### Route Structure {#route-structure}


```text
/pages/jobs
  └── JobLayoutComponent (tabset wrapper)
      ├── /employee       → JobEmployeePlugin
      ├── /search         → JobSearchPlugin
      ├── /matching       → JobMatchingPlugin
      └── /proposal-template → JobProposalTemplatePlugin
```

Default redirect: `/pages/jobs` → `/pages/jobs/employee`


## Child Plugins {#child-plugins}


Each child plugin is documented on its own page:

- [JobEmployeePlugin](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-employee-plugin/index.md) — Employee job listings and assignments
- [JobSearchPlugin](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-search-plugin/index.md) — Browse and search job listings
- [JobMatchingPlugin](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-matching-plugin/index.md) — AI-powered job-candidate matching
- [JobProposalPlugin](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-proposal-plugin/index.md) — Job proposal management (Sales section)
- [JobProposalTemplatePlugin](https://sourcey-gauzy.pages.dev/plugins-built-in/jobs-ui/job-proposal-template-plugin/index.md) — Reusable proposal templates


## Related {#related}


- [Plugin UI System](https://sourcey-gauzy.pages.dev/frontend/plugin-ui/overview/index.md) — how UI plugins work
- [Plugin Definitions](https://sourcey-gauzy.pages.dev/frontend/plugin-ui/plugin-definitions/index.md) — plugin group pattern
- [Getting Started](https://sourcey-gauzy.pages.dev/frontend/plugin-ui/getting-started/index.md) — create your own plugin
