Add timezone range to job

database/migrations/schema/0003_job_tz_interval.sql

@@ -0,0 +1,7 @@
+alter table job add column tz_start text;
+alter table job add column tz_end text;
+
+---- create above / drop below ----
+
+alter table job drop column tz_start;
+alter table job drop column tz_end;

gitjobs-server/src/db/dashboard/employer.rs

@@ -168,6 +168,8 @@ impl DBDashBoardEmployer for PgDB {
                     salary_period,
                     seniority,
                     skills,
+                    tz_end,
+                    tz_start,
                     upstream_commitment,
                     published_at
                 )
@@ -192,7 +194,9 @@ impl DBDashBoardEmployer for PgDB {
                     $18::text,
                     $19::text,
                     $20::text[],
-                    $21::int,
+                    $21::text,
+                    $22::text,
+                    $23::int,
                     case when $3::text = 'published' then current_timestamp else null end
                 returning job_id;
                 ",
@@ -217,6 +221,8 @@ impl DBDashBoardEmployer for PgDB {
                     &job.salary_period,
                     &job.seniority.as_ref().map(ToString::to_string),
                     &job.skills,
+                    &job.tz_end,
+                    &job.tz_start,
                     &job.upstream_commitment,
                 ],
             )
@@ -404,6 +410,8 @@ impl DBDashBoardEmployer for PgDB {
                     j.salary_period,
                     j.seniority,
                     j.skills,
+                    j.tz_end,
+                    j.tz_start,
                     j.updated_at,
                     j.upstream_commitment,
                     (
@@ -464,6 +472,8 @@ impl DBDashBoardEmployer for PgDB {
                 .get::<_, Option<String>>("seniority")
                 .map(|s| s.parse().expect("valid seniority")),
             skills: row.get("skills"),
+            tz_end: row.get("tz_end"),
+            tz_start: row.get("tz_start"),
             updated_at: row.get("updated_at"),
             upstream_commitment: row.get("upstream_commitment"),
         };
@@ -677,7 +687,9 @@ impl DBDashBoardEmployer for PgDB {
                 salary_period = $18::text,
                 seniority = $19::text,
                 skills = $20::text[],
-                upstream_commitment = $21::int,
+                tz_end = $21::text,
+                tz_start = $22::text,
+                upstream_commitment = $23::int,
                 updated_at = current_timestamp
             where job_id = $1::uuid;
             ",
@@ -702,6 +714,8 @@ impl DBDashBoardEmployer for PgDB {
                 &job.salary_period,
                 &job.seniority.as_ref().map(ToString::to_string),
                 &job.skills,
+                &job.tz_end,
+                &job.tz_start,
                 &job.upstream_commitment,
             ],
         )

gitjobs-server/src/db/jobboard.rs

@@ -85,6 +85,8 @@ impl DBJobBoard for PgDB {
                     j.salary_period,
                     j.seniority,
                     j.skills,
+                    j.tz_end,
+                    j.tz_start,
                     j.updated_at,
                     j.upstream_commitment,
                     (
@@ -168,6 +170,8 @@ impl DBJobBoard for PgDB {
                     .get::<_, Option<String>>("seniority")
                     .map(|s| s.parse().expect("valid seniority")),
                 skills: row.get("skills"),
+                tz_end: row.get("tz_end"),
+                tz_start: row.get("tz_start"),
                 updated_at: row.get("updated_at"),
                 upstream_commitment: row.get("upstream_commitment"),
             };

gitjobs-server/src/templates/dashboard/employer/jobs.rs

@@ -89,6 +89,8 @@ pub(crate) struct Job {
     pub salary_period: Option<String>,
     pub seniority: Option<Seniority>,
     pub skills: Option<Vec<String>>,
+    pub tz_end: Option<String>,
+    pub tz_start: Option<String>,
     pub updated_at: Option<DateTime<Utc>>,
     pub upstream_commitment: Option<i32>,
 }

gitjobs-server/src/templates/jobboard/jobs.rs

@@ -217,6 +217,8 @@ pub(crate) struct Job {
     pub salary_period: Option<String>,
     pub seniority: Option<Seniority>,
     pub skills: Option<Vec<String>>,
+    pub tz_end: Option<String>,
+    pub tz_start: Option<String>,
     pub updated_at: Option<DateTime<Utc>>,
     pub upstream_commitment: Option<i32>,
 }

gitjobs-server/static/styles/index.css

@@ -61,6 +61,14 @@
 }
 /* End markdown */
 
+select.aligned-right {
+  text-align-last: right;
+}
+
+select.aligned-right option {
+  direction: rtl;
+}
+
 /* Select styles */
 .select {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");

gitjobs-server/templates/dashboard/employer/jobs/add.html

@@ -14,7 +14,7 @@
 
       <div class="mt-10 grid grid-cols-1 gap-x-6 gap-y-8 md:grid-cols-6 max-w-5xl">
         {# Job title #}
-        <div class="col-span-3">
+        <div class="col-span-full lg:col-span-3">
           <label for="title" class="form-label">
             Title <span class="asterisk">*</span>
           </label>
@@ -33,19 +33,57 @@
         </div>
         {# End Job title #}
 
-        {# Job status #}
-        <input type="hidden" name="status" value="draft">
-        {# End job status #}
+        <div class="col-span-3"></div>
 
         {# Job location #}
         <div class="col-span-full lg:col-span-3">
           <label for="ts_query" class="form-label">Location</label>
           <search-location></search-location>
           <p class="form-legend">Location of the job.</p>
         </div>
-
         {# End Job location #}
 
+        {# Timezone range section #}
+        <div class="col-span-full lg:col-span-3">
+          <div class="form-label">Timezone</div>
+          <div class="grid grid-cols-1 gap-x-6 gap-y-8 md:grid-cols-6">
+            {# Timezone start #}
+            <div class="col-span-3">
+              <div class="mt-2 grid grid-cols-1 relative">
+                <div class="absolute top-3 start-3 text-xs text-gray-500">Start</div>
+                <select id="tz_start"
+                        name="tz_start"
+                        class="select-primary ps-10 aligned-right">
+                  {% call macros::select_option(value = "", label = "") %}
+                  {% for i in 0..25 %}
+                    {% let timezone = format!("UTC{:+}", (12 - i)) %}
+                    {% call macros::select_option(value = timezone, label = timezone) %}
+                  {% endfor %}
+                </select>
+              </div>
+            </div>
+            {# End Timezone start #}
+
+            {# Timezone end #}
+            <div class="col-span-3">
+              <div class="mt-2 grid grid-cols-1 relative">
+                <div class="absolute top-3 start-3 text-xs text-gray-500">End</div>
+                <select id="tz_end" name="tz_end" class="select-primary ps-10 aligned-right">
+                  {% call macros::select_option(value = "", label = "") %}
+                  {% for i in 0..25 %}
+                    {% let timezone = format!("UTC{:+}", (12 - i)) %}
+                    {% call macros::select_option(value = timezone, label = timezone) %}
+                  {% endfor %}
+                </select>
+              </div>
+            </div>
+            {# End Timezone end #}
+          </div>
+
+          <p class="form-legend">Timezone range where you would like your remote applicants to be located at.</p>
+        </div>
+        {# End timezone range section #}
+
         {# Job type #}
         <div class="col-span-full">
           <label for="type" class="form-label">
@@ -130,7 +168,7 @@
             <markdown-editor id="responsibilities"></markdown-editor>
           </div>
           <p class="form-legend">
-            Explain potential candidates what will they do at this job and what their responsibilities will be.
+            Explain to potential candidates what they will do at this job and what their responsibilities will be.
           </p>
         </div>
         {# End Job responsibilities #}
@@ -326,6 +364,10 @@
     </div>
     {# End Open Source #}
 
+    {# Job status #}
+    <input type="hidden" name="status" value="draft">
+    {# End job status #}
+
     <div class="mt-6 flex justify-between items-center">
       {# Preview #}
       <div class="flex items-center gap-x-6">

gitjobs-server/templates/dashboard/employer/jobs/preview.html

@@ -213,6 +213,18 @@
   {% call job_workplace(workplace = job.workplace, location = job.location|display_some_or("-")) %}
   {# End location #}
 
+  {# Timezone #}
+  {% if let Some(tz_start) = job.tz_start %}
+    {% call job_details_subheading(content = "Timezone") %}
+    {% if let Some(tz_end) = job.tz_end %}
+      {% let timezone = format!("{} - {}", tz_start, tz_end) %}
+      {% call job_details_content(text = timezone) %}
+    {% else %}
+      {% call job_details_content(text = tz_start) %}
+    {% endif %}
+  {% endif %}
+  {# End timezone #}
+
   {# Open source #}
   {% if let Some(open_source) = job.open_source %}
     {% if open_source + 0 > 0 %}

gitjobs-server/templates/dashboard/employer/jobs/update.html

@@ -16,7 +16,7 @@
 
       <div class="mt-10 grid grid-cols-1 gap-x-6 gap-y-8 md:grid-cols-6 max-w-5xl">
         {# Job title #}
-        <div class="col-span-full">
+        <div class="col-span-full lg:col-span-3">
           <label for="title" class="form-label">
             Title <span class="asterisk">*</span>
           </label>
@@ -36,9 +36,7 @@
         </div>
         {# End Job title #}
 
-        {# Job status #}
-        <input type="hidden" name="status" value="{{ job.status }}">
-        {# End job status #}
+        <div class="col-span-3"></div>
 
         {# Job location #}
         <div class="col-span-full lg:col-span-3">
@@ -52,6 +50,47 @@
         </div>
         {# End Job location #}
 
+        {# Timezone range section #}
+        <div class="col-span-full lg:col-span-3">
+          <div class="form-label">Timezone</div>
+          <div class="grid grid-cols-1 gap-x-6 gap-y-8 md:grid-cols-6">
+            {# Timezone start #}
+            <div class="col-span-3">
+              <div class="mt-2 grid grid-cols-1 relative">
+                <div class="absolute top-3 start-3 text-xs text-gray-500">Start</div>
+                <select id="tz_start"
+                        name="tz_start"
+                        class="select-primary ps-10 aligned-right">
+                  {% call macros::select_option(value = "", label = "", selected = job.tz_start|display_some) %}
+                  {% for i in 0..25 %}
+                    {% let timezone = format!("UTC{:+}", (12 - i)) %}
+                    {% call macros::select_option(value = &timezone, label = timezone, selected = job.tz_start|display_some) %}
+                  {% endfor %}
+                </select>
+              </div>
+            </div>
+            {# End Timezone start #}
+
+            {# Timezone end #}
+            <div class="col-span-3">
+              <div class="mt-2 grid grid-cols-1 relative">
+                <div class="absolute top-3 start-3 text-xs text-gray-500">End</div>
+                <select id="tz_end" name="tz_end" class="select-primary ps-10 aligned-right">
+                  {% call macros::select_option(value = "", label = "", selected = job.tz_end|display_some) %}
+                  {% for i in 0..25 %}
+                    {% let timezone = format!("UTC{:+}", (12 - i)) %}
+                    {% call macros::select_option(value = &timezone, label = timezone, selected = job.tz_end|display_some) %}
+                  {% endfor %}
+                </select>
+              </div>
+            </div>
+            {# End Timezone end #}
+          </div>
+
+          <p class="form-legend">Timezone range where you would like your remote applicants to be located at.</p>
+        </div>
+        {# End timezone range section #}
+
         {# Job type #}
         <div class="col-span-full">
           <label for="type" class="form-label">
@@ -136,7 +175,7 @@
             <markdown-editor id="responsibilities" content="{{ job.responsibilities|display_some }}"></markdown-editor>
           </div>
           <p class="form-legend">
-            Explain potential candidates what will they do at this job and what their responsibilities will be.
+            Explain to potential candidates what they will do at this job and what their responsibilities will be.
           </p>
         </div>
         {# End Job responsibilities #}
@@ -373,6 +412,10 @@
     </div>
     {# End Open Source #}
 
+    {# Job status #}
+    <input type="hidden" name="status" value="{{ job.status }}">
+    {# End job status #}
+
     <div class="mt-6 flex justify-between items-center">
       {# Preview #}
       <div class="flex items-center gap-x-6">

gitjobs-server/templates/jobboard/jobs/job_section.html

@@ -219,6 +219,18 @@
   {% call macros_preview::job_workplace(workplace = job.workplace, location = job.location|display_some_or("-")) %}
   {# End location #}
 
+  {# Timezone #}
+  {% if let Some(tz_start) = job.tz_start %}
+    {% call macros_preview::job_details_subheading(content = "Timezone") %}
+    {% if let Some(tz_end) = job.tz_end %}
+      {% let timezone = format!("{} - {}", tz_start, tz_end) %}
+      {% call macros_preview::job_details_content(text = timezone) %}
+    {% else %}
+      {% call macros_preview::job_details_content(text = tz_start) %}
+    {% endif %}
+  {% endif %}
+  {# End timezone #}
+
   {# Open source #}
   {% if let Some(open_source) = job.open_source %}
     {% if open_source + 0 > 0 %}