# Recruiter home A React block (a whole screen) in [Beamline](https://beamline.io/)'s [HR & payroll](https://beamline.io/components/apps/hr-payroll) app. Live demo: https://beamline.io/components/recruiter-home A recruiter's own work, in one place. Upcoming interviews with who sits in, today's first; feedback owed, overdue first and on the danger tone, written in place (a recommendation and notes) or resolved without feedback, with the reason asked and who resolved it and when recorded, no recommendation or notes invented and the interview kept; approvals waiting, approved or sent back in place. Pinned views on a rail, one that isn't yours to open said; applications to review and the jobs you follow beside, a count still loading said as loading. Finishing one task never touches another. ## Use it for - A person's own work across a system: interviews, reviews owed, approvals waiting, for a recruiter, a reviewer or a manager. - Obligations that can be closed without doing them, recorded as such rather than faked. ## Not for - The pipeline itself ([hiring-pipeline](https://beamline.io/components/hiring-pipeline)). - A team's shared inbox ([helpdesk-inbox](https://beamline.io/components/helpdesk-inbox)). ## Anatomy - header: the product's mark, whose work it is - rail: pinned views, the current one marked, an unavailable one locked and said - interviews: when (today's on the info tone), candidate and stage, job and who sits in - tasks: Feedback due and Approvals with counts; a feedback task's candidate, job, interview, due or overdue (danger), Write feedback (recommendation, notes, Submit), a menu to resolve without feedback (what it does, why, Resolve); finished tasks with who and when; approvals with Approve and Ask for changes - beside: applications to review, followed jobs with new applicants (counting while loading) ## States - no assignments, upcoming interviews, feedback due, overdue, writing, submitted, resolving, resolved without feedback, resolution refused, approvals waiting and decided, view unavailable, counts loading - loading: shaped skeletons - phone: one column; the rail becomes a row - right to left: mirrored - reduced motion: through the tokens ## Keyboard - Tab through the views, interviews, task tabs, each task's actions and menu, and the forms ## Motion Nothing runs at rest; forms open in place. ## Props | Prop | Type | Default | Description | | --- | --- | --- | --- | | `name` (required) | `string` | — | | | `views` | `PinnedView[]` | — | | | `interviews` (required) | `HomeInterview[]` | — | | | `feedback` (required) | `FeedbackTask[]` | — | | | `approvals` (required) | `ApprovalTask[]` | — | | | `followed` | `FollowedJob[]` | — | | | `toReview` | `number \| null` | — | Applications waiting for your review; null while it loads. | | `onSubmitFeedback` | `((taskId: string, f: { rating: Rating; notes: string; }) => Promise)` | — | | | `onResolve` | `((taskId: string, reason: string \| null) => Promise<{ by: string; at: string; }>)` | — | Resolve a feedback task without feedback. Reject with an Error: it stays due, the reason said. | | `onDecide` | `((approvalId: string, decision: "approved" \| "changes") => Promise)` | — | | | `defaultTab` | `"approvals" \| "feedback"` | — | | | `defaultOpen` | `string \| null` | — | Initial open state when uncontrolled; defaults to false. | | `now` | `string` | — | | | `loading` | `boolean` | — | | | `product` | `string` | — | | | `className` | `string` | — | Classes on the documented visual root; no override by default. | | `ref` | `Ref` | — | Receives the documented native target or imperative handle; omitted by default. | ## Built from - [Alert](https://beamline.io/components/alert.md) - [Avatar](https://beamline.io/components/avatar.md) - [Button](https://beamline.io/components/button.md) - [Dropdown menu](https://beamline.io/components/dropdown-menu.md) - [Label](https://beamline.io/components/label.md) - [Segmented control](https://beamline.io/components/segmented-control.md) - [Select](https://beamline.io/components/select.md) - [Skeleton](https://beamline.io/components/skeleton.md) - [Spinner](https://beamline.io/components/spinner.md) - [Text morph](https://beamline.io/components/text-morph.md) - [Textarea](https://beamline.io/components/textarea.md) - [Tooltip](https://beamline.io/components/tooltip.md) ## Dependencies `lucide-react` ## Import ```tsx import { RecruiterHome } from "@beamline/recruiter-home"; ``` ## Get it Recruiter home is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. [Get Beamline](https://beamline.io/checkout?pack=complete) · [Connect your agent](https://beamline.io/connect) ## More in HR & payroll - [Shift planner](https://beamline.io/components/shift-planner): A workplace's week of staff shifts against what it needs: a row per person with their week's hours against their contract, each day a 24-hour track with… - [Shift rotations](https://beamline.io/components/shift-rotations): Rotating shift patterns from pattern to people: a pattern of one to four weeks painted day by day with a shift template, a rest day or nothing (pick the… - [Roster publishing](https://beamline.io/components/roster-publish): The week's roster before it goes out: areas down the side and days across, each shift a chip with who works it and its hours, its state its tone (not… - [My shift](https://beamline.io/components/my-shift): The worker's own shift on their phone: today drawn to scale (the plan's areas as blocks on an hour axis, under them what was worked: on-plan time in… - [Timesheet review](https://beamline.io/components/timesheet-review): Timesheets for a manager: the day's counts at the head (scheduled, on shift, late, on break, to approve), the ones that filter being buttons, an… - [Hours ledger](https://beamline.io/components/hours-ledger): One worker's pay cycle of shifts, for the worker or their payroll admin: the wall-clock span and the paid hours as separate columns, a night shift… - [Payroll run](https://beamline.io/components/payroll-run): A pay period from report to submission, one payroll account at a time (a worker on two accounts is on both runs, never combined): the workers on one… - [Payroll cycles](https://beamline.io/components/payroll-cycles): The client's side of an outsourced payroll across countries: every entity's current cycle on one board, its stage drawn as steps, the one thing that… - [Payroll approvals](https://beamline.io/components/payroll-approvals): Payroll approvals for a company paying through a payroll provider. Expenses are split by whose move it is (you, another approver, the employee answering… - [Benefit changes](https://beamline.io/components/benefit-changes): An employee's benefit changes after a life event. The centre puts their turn first: each task (a proof to upload, with its deadline in the warning tint… - [Hiring pipeline](https://beamline.io/components/hiring-pipeline): A recruiting team's pipeline across every open job. Stage groups (reviewing, interviewing, closing) are counted across jobs above job sections that fold… - [Stage reports](https://beamline.io/components/stage-reports): Reports on how applications move through stages, built from each application's stage intervals. By week: applications present in each stage (or from each… - [Link booking](https://beamline.io/components/link-booking): A candidate's booking link for one stage of one job: a column with the job, the stage's length, who they meet (each with their role), where and what the… - [Team & members](https://beamline.io/components/team-members): The people page of a workspace: seats used against the plan, members and pending invitations in one list with search and a role filter, role changes that… Part of [Beamline UI: polished, editable React components and complete screens for custom applications](https://beamline.io/). [Build your own style from any look; tokens, fonts, radii, motion; not only colours](https://beamline.io/docs/customize).