@ossy/employees 1.0.2 → 1.2.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ossy/employees",
   "description": "Analytics module — workspace analytics for website traffic",
-  "version": "1.0.2",
+  "version": "1.2.0",
   "type": "module",
   "main": "./src/index.js",
   "module": "./src/index.js",
@@ -21,5 +21,11 @@
     "/src",
     "README.md"
   ],
-  "gitHead": "54361a7e3ab2e5b6bed04b7b9caa1fd60ff99b03"
+  "peerDependencies": {
+    "@ossy/calendar": "*",
+    "@ossy/design-system": "*",
+    "@ossy/router-react": "*",
+    "react": "*"
+  },
+  "gitHead": "08b323d32d21600ba9519ad3f73fd5738556a68f"
 }

package/src/Employees.jsx

@@ -0,0 +1,106 @@
+import React from 'react'
+import { Title, View, Text, Separator } from '@ossy/design-system'
+import { useEmployees } from '@ossy/calendar'
+
+export const Employees = () => {
+    const employees = useEmployees()
+
+    return (
+        <div
+          style={{
+            width: '100%',
+            minHeight: 0,
+            display: 'grid',
+            gridTemplateColumns: 'repeat(auto-fill, minmax(min(100%, 380px), 1fr))',
+            gap: 'var(--space-l)',
+          }}
+        >
+
+            {employees.map(employee => (
+              <View
+                key={employee.id}
+                surface="primary"
+                roundness="m"
+                gap="m"
+                layout="column"
+                style={{
+                  padding: 'var(--space-xl)',
+                  boxSizing: 'border-box',
+                }}
+              >
+                    <Title variant="tertiary">{employee.name}</Title>
+                    <Separator />
+                    <View gap="s" style={{ flexGrow: 1 }}>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                Id:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                {employee.id}
+                            </Text>
+                        </View>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                Start date:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                {employee.startDate}
+                            </Text>
+                        </View>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                End date:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                {employee.endDate || 'ongoing'}
+                            </Text>
+                        </View>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                ContractId:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                               {employee.contractId}
+                            </Text>
+                        </View>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                            Compensation:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                {new Intl.NumberFormat('sv-SE', { style: 'currency', currency: 'SEK' }).format(employee.monthlySalary)}/month
+                            </Text>
+                        </View>
+
+                        <View layout="row" gap="s" style={{ justifyContent: 'space-between' }}>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                                Work hours per day:
+                            </Text>
+                            <Text variant="m" style={{ marginBottom: 0 }}>
+                               {new Intl.NumberFormat('sv-SE', { style: 'unit', unit: 'hour' }).format(employee.workHoursPerDay)}
+                            </Text>
+                        </View>
+
+                        <Text style={{ marginBottom: 0 }}>
+                            vacations
+                        </Text>
+
+                        {employee?.vacations?.map(vacation => (
+                            <Text key={`${vacation.start}-${vacation.end}`} style={{ marginBottom: 0 }}>
+                                {vacation.start} - {vacation.end}
+                            </Text>
+                        ))}
+
+                    </View>
+
+                </View>
+            ))}
+
+        </div>
+    )
+}

package/src/employees.page.jsx

@@ -0,0 +1,53 @@
+import React  from 'react'
+import { useRouter } from '@ossy/router-react'
+import { Title, Text, View, Tags, Button } from '@ossy/design-system'
+import { Employees } from './Employees.jsx'
+import { DataLoader } from '@ossy/calendar'
+import { Definition } from '@ossy/employees'
+import { moduleStatusTags } from './moduleStatus.js'
+
+export const metadata = {
+  id: 'employees/home',
+  path: {
+    sv: '/anstallda',
+    en: '/employees',
+  },
+}
+
+export const EmployeesPage = () => {
+  const router = useRouter()
+  return (
+    <View gap="m" surface="primary" style={{ padding: 'var(--space-m) var(--space-l)', height: '100%', overflowY: 'auto' }}>
+
+      <View inset="s" gap="s">
+
+        <View layout="row" justifyContent="space-between" alignItems="center">
+            <View layout='row' gap="s" alignItems="center">
+              <Title>{Definition.title}</Title>
+              {moduleStatusTags(Definition).length > 0 && (
+                <Tags tags={moduleStatusTags(Definition)} size="s" />
+              )}
+            </View>
+            <Button variant="cta" disabled={true} prefix="add">
+              Add
+            </Button>
+        </View>
+
+        <Text style={{ maxWidth: '400px' }}>
+          Manage Employees
+        </Text>
+
+      </View>
+
+      <View gap="m" inset="s">
+          <Title variant="secondary">Overview</Title>
+
+          <DataLoader content={<Employees />} />
+
+      </View>
+
+    </View>
+  )
+}
+
+export default EmployeesPage

package/src/moduleStatus.js

@@ -0,0 +1,95 @@
+/**
+ * Module lifecycle & visibility helpers.
+ *
+ * - `statuses` is a string[] on each Definition (e.g. `['beta']`, `['beta', 'internal']`).
+ * - Legacy single `status` is still read for compatibility.
+ * - Optional workspace gating via `workspaceServiceKey` or `workspaceServiceKeys` + `workspaceServiceRequirement`.
+ */
+
+export const MODULE_STATUS = {
+  beta: 'beta',
+  comingSoon: 'coming-soon',
+  stable: 'stable',
+  /** When present, the module is omitted from the primary sidebar. */
+  hidden: 'hidden',
+}
+
+const STATUS_TO_TAG_LABEL = {
+  [MODULE_STATUS.beta]: 'Beta',
+  [MODULE_STATUS.comingSoon]: 'Coming Soon',
+  [MODULE_STATUS.stable]: null,
+  [MODULE_STATUS.hidden]: null,
+}
+
+/** Status values that exclude a module from the sidebar (in addition to workspace gating). */
+const SIDEBAR_HIDE_STATUSES = new Set([MODULE_STATUS.hidden])
+
+/**
+ * Normalize legacy `definition.status` and `definition.statuses` into one array.
+ * @param {{ status?: string, statuses?: string[] }} definition
+ * @returns {string[]}
+ */
+export function moduleStatuses(definition) {
+  const fromArray = Array.isArray(definition?.statuses) ? definition.statuses : []
+  const fromLegacy = definition?.status && typeof definition.status === 'string' ? [definition.status] : []
+  if (fromArray.length) return [...new Set(fromArray)]
+  if (fromLegacy.length) return [...new Set(fromLegacy)]
+  return []
+}
+
+/**
+ * @param {{ status?: string, statuses?: string[] }} definition
+ * @returns {string[]} labels for `<Tags tags={...} />` (stable/hidden emit none)
+ */
+export function moduleStatusTags(definition) {
+  const labels = []
+  for (const s of moduleStatuses(definition)) {
+    const label = STATUS_TO_TAG_LABEL[s]
+    if (label) labels.push(label)
+  }
+  return [...new Set(labels)]
+}
+
+/**
+ * @param {{ status?: string, statuses?: string[] }} definition
+ * @returns {boolean}
+ */
+export function isHiddenFromSidebar(definition) {
+  if (!definition) return true
+  return moduleStatuses(definition).some(s => SIDEBAR_HIDE_STATUSES.has(s))
+}
+
+/**
+ * @param {Record<string, boolean> | undefined} services workspace.services
+ * @param {{ workspaceServiceKey?: string, workspaceServiceKeys?: string[], workspaceServiceRequirement?: 'all' | 'any' }} definition
+ * @returns {boolean}
+ */
+export function workspaceAllowsModule(services, definition) {
+  if (!definition) return false
+  const keys = definition.workspaceServiceKeys?.length
+    ? definition.workspaceServiceKeys
+    : definition.workspaceServiceKey
+      ? [definition.workspaceServiceKey]
+      : null
+  if (!keys?.length) return true
+  const mode = definition.workspaceServiceRequirement || 'all'
+  const map = services || {}
+  /** Treat missing keys as allowed (legacy workspaces); only explicit `false` from disable turns a service off. */
+  const flags = keys.map(k => map[k] !== false)
+  return mode === 'any' ? flags.some(Boolean) : flags.every(Boolean)
+}
+
+/**
+ * Router ref for a module’s default page: `@<moduleId>/home`
+ * @param {string} moduleId — matches `Definition.module.id` / folder name
+ */
+export function moduleHomeRef(moduleId) {
+  return `@${moduleId}/home`
+}
+
+/**
+ * @param {{ requiresModules?: Array<{ id: string, label: string, href: string }> }} definition
+ */
+export function moduleRequiresModules(definition) {
+  return definition?.requiresModules ?? []
+}