@essentialai/cogent-server 3.5.0 → 3.5.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/__tests__/services/session-store-contract.d.ts.map +1 -1
- package/dist/__tests__/services/session-store-contract.js +41 -0
- package/dist/__tests__/services/session-store-contract.js.map +1 -1
- package/dist/config.d.ts +2 -0
- package/dist/config.d.ts.map +1 -1
- package/dist/config.js +9 -0
- package/dist/config.js.map +1 -1
- package/dist/routes/control-plane.d.ts.map +1 -1
- package/dist/routes/control-plane.js +10 -0
- package/dist/routes/control-plane.js.map +1 -1
- package/dist/routes/peers.d.ts +9 -0
- package/dist/routes/peers.d.ts.map +1 -1
- package/dist/routes/peers.js +46 -1
- package/dist/routes/peers.js.map +1 -1
- package/dist/routes/ui.js +1 -1
- package/dist/services/session-store-memory.d.ts +2 -1
- package/dist/services/session-store-memory.d.ts.map +1 -1
- package/dist/services/session-store-memory.js +19 -2
- package/dist/services/session-store-memory.js.map +1 -1
- package/dist/services/session-store-postgres.d.ts +2 -1
- package/dist/services/session-store-postgres.d.ts.map +1 -1
- package/dist/services/session-store-postgres.js +24 -6
- package/dist/services/session-store-postgres.js.map +1 -1
- package/dist/services/session-store.d.ts +33 -0
- package/dist/services/session-store.d.ts.map +1 -1
- package/dist/services/session-store.js +41 -1
- package/dist/services/session-store.js.map +1 -1
- package/dist/ui/components/Footer.js +1 -1
- package/dist/ui/components/Footer.js.map +1 -1
- package/dist/ui/components/Layout.d.ts.map +1 -1
- package/dist/ui/components/Layout.js +7 -3
- package/dist/ui/components/Layout.js.map +1 -1
- package/dist/ui/components/NavBar.js +1 -1
- package/dist/ui/components/PlatformLogos.d.ts +11 -0
- package/dist/ui/components/PlatformLogos.d.ts.map +1 -0
- package/dist/ui/components/PlatformLogos.js +25 -0
- package/dist/ui/components/PlatformLogos.js.map +1 -0
- package/dist/ui/pages/FaqPage.js +1 -1
- package/dist/ui/pages/FaqPage.js.map +1 -1
- package/dist/ui/pages/HowToPage.d.ts.map +1 -1
- package/dist/ui/pages/HowToPage.js +1 -1
- package/dist/ui/pages/HowToPage.js.map +1 -1
- package/dist/ui/pages/LandingPage.d.ts +4 -2
- package/dist/ui/pages/LandingPage.d.ts.map +1 -1
- package/dist/ui/pages/LandingPage.js +520 -134
- package/dist/ui/pages/LandingPage.js.map +1 -1
- package/dist/ui/pages/UpdateGuidePage.js +1 -1
- package/dist/ui/pages/UpdateGuidePage.js.map +1 -1
- package/dist/ui/styles/theme.d.ts +28 -1
- package/dist/ui/styles/theme.d.ts.map +1 -1
- package/dist/ui/styles/theme.js +102 -2
- package/dist/ui/styles/theme.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,47 +1,170 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "hono/jsx/jsx-runtime";
|
|
2
|
-
import { css } from "hono/css";
|
|
2
|
+
import { css, cx } from "hono/css";
|
|
3
3
|
import { Layout } from "../components/Layout.js";
|
|
4
4
|
import { StatCard } from "../components/StatCard.js";
|
|
5
5
|
import { Terminal } from "../components/Terminal.js";
|
|
6
|
-
import {
|
|
7
|
-
|
|
6
|
+
import { PlatLogo } from "../components/PlatformLogos.js";
|
|
7
|
+
import { colors, fonts, grainOverlay, eyebrow, revealUp } from "../styles/theme.js";
|
|
8
|
+
/* ============================================================= *
|
|
9
|
+
* Cogent — "Communicating Agents"
|
|
10
|
+
* Enterprise landing, Engineered-Editorial system (portal parity):
|
|
11
|
+
* deep-ink canvas, citron accent, Fraunces display, Geist Mono for
|
|
12
|
+
* the technical identifiers, a fractal-noise grain, and one
|
|
13
|
+
* orchestrated page-load reveal. Content is benefit-first: put every
|
|
14
|
+
* AI agent into the rooms your team already works.
|
|
15
|
+
* ============================================================= */
|
|
16
|
+
const EASE = "cubic-bezier(0.16, 1, 0.3, 1)";
|
|
17
|
+
const MAX = "1140px";
|
|
18
|
+
// ---- Brand mark: two relay nodes joined by a signal arc (portal glyph) ----
|
|
19
|
+
const BrandMark = ({ size = 26 }) => (_jsxs("svg", { width: size, height: size, viewBox: "0 0 32 32", fill: "none", "aria-hidden": "true", children: [_jsx("path", { d: "M9 22.5C4.8 21 3 17.9 3 14.5 3 9.3 7.6 5 13.3 5c4.2 0 7.8 2.3 9.4 5.7", stroke: colors.green, "stroke-width": "2.4", "stroke-linecap": "round" }), _jsx("path", { d: "M23 9.5c4.2 1.5 6 4.6 6 8 0 5.2-4.6 9.5-10.3 9.5-4.2 0-7.8-2.3-9.4-5.7", stroke: colors.green, "stroke-width": "2.4", "stroke-linecap": "round", opacity: "0.45" }), _jsx("circle", { cx: "9", cy: "22.5", r: "3", fill: colors.green }), _jsx("circle", { cx: "23", cy: "9.5", r: "3", fill: colors.green })] }));
|
|
20
|
+
// ---- Nav ----
|
|
21
|
+
const nav = css `
|
|
22
|
+
position: sticky;
|
|
23
|
+
top: 0;
|
|
24
|
+
z-index: 50;
|
|
25
|
+
backdrop-filter: blur(12px);
|
|
26
|
+
background: rgba(10, 12, 15, 0.72);
|
|
27
|
+
border-bottom: 1px solid ${colors.border};
|
|
28
|
+
`;
|
|
29
|
+
const navInner = css `
|
|
30
|
+
max-width: ${MAX};
|
|
31
|
+
margin: 0 auto;
|
|
32
|
+
padding: 0.85rem 1.5rem;
|
|
33
|
+
display: flex;
|
|
34
|
+
align-items: center;
|
|
35
|
+
gap: 1.5rem;
|
|
36
|
+
`;
|
|
37
|
+
const brand = css `
|
|
38
|
+
display: inline-flex;
|
|
39
|
+
align-items: center;
|
|
40
|
+
gap: 0.55rem;
|
|
41
|
+
font-family: ${fonts.display};
|
|
42
|
+
font-weight: 600;
|
|
43
|
+
font-size: 1.05rem;
|
|
44
|
+
color: ${colors.text};
|
|
45
|
+
letter-spacing: -0.01em;
|
|
46
|
+
`;
|
|
47
|
+
const navLinks = css `
|
|
48
|
+
display: flex;
|
|
49
|
+
gap: 1.4rem;
|
|
50
|
+
margin-left: auto;
|
|
51
|
+
align-items: center;
|
|
52
|
+
@media (max-width: 780px) {
|
|
53
|
+
& .nav-hide {
|
|
54
|
+
display: none;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
& a {
|
|
58
|
+
font-size: 0.85rem;
|
|
59
|
+
color: ${colors.textMuted};
|
|
60
|
+
transition: color 0.18s ${EASE};
|
|
61
|
+
}
|
|
62
|
+
& a:hover {
|
|
63
|
+
color: ${colors.text};
|
|
64
|
+
text-decoration: none;
|
|
65
|
+
}
|
|
66
|
+
`;
|
|
67
|
+
const navCta = css `
|
|
68
|
+
background: ${colors.green};
|
|
69
|
+
color: ${colors.textOnAccent} !important;
|
|
70
|
+
font-weight: 600;
|
|
71
|
+
padding: 0.5rem 1rem;
|
|
72
|
+
border-radius: 999px;
|
|
73
|
+
font-size: 0.85rem !important;
|
|
74
|
+
transition: background 0.18s ${EASE}, transform 0.18s ${EASE};
|
|
75
|
+
&:hover {
|
|
76
|
+
background: ${colors.greenHover};
|
|
77
|
+
transform: translateY(-1px);
|
|
78
|
+
text-decoration: none;
|
|
79
|
+
}
|
|
80
|
+
`;
|
|
81
|
+
// ---- Shell / sections ----
|
|
8
82
|
const container = css `
|
|
9
|
-
max-width:
|
|
83
|
+
max-width: ${MAX};
|
|
10
84
|
margin: 0 auto;
|
|
11
|
-
padding:
|
|
85
|
+
padding: 0 1.5rem;
|
|
12
86
|
`;
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
87
|
+
const section = css `
|
|
88
|
+
max-width: ${MAX};
|
|
89
|
+
margin: 0 auto;
|
|
90
|
+
padding: 5.5rem 1.5rem;
|
|
91
|
+
@media (max-width: 640px) {
|
|
92
|
+
padding: 4rem 1.5rem;
|
|
93
|
+
}
|
|
17
94
|
`;
|
|
18
|
-
const
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
letter-spacing: 0.18em;
|
|
22
|
-
text-transform: uppercase;
|
|
23
|
-
color: ${colors.green};
|
|
24
|
-
margin: 0 0 1.1rem 0;
|
|
95
|
+
const sectionHead = css `
|
|
96
|
+
max-width: 44ch;
|
|
97
|
+
margin-bottom: 2.75rem;
|
|
25
98
|
`;
|
|
26
|
-
const
|
|
27
|
-
font-
|
|
99
|
+
const h2 = css `
|
|
100
|
+
font-family: ${fonts.display};
|
|
101
|
+
font-size: clamp(1.8rem, 3.2vw, 2.5rem);
|
|
102
|
+
font-weight: 600;
|
|
103
|
+
line-height: 1.1;
|
|
104
|
+
letter-spacing: -0.02em;
|
|
28
105
|
color: ${colors.text};
|
|
29
|
-
margin: 0
|
|
30
|
-
|
|
106
|
+
margin: 0.6rem 0 0;
|
|
107
|
+
& em {
|
|
108
|
+
font-style: italic;
|
|
109
|
+
color: ${colors.green};
|
|
110
|
+
}
|
|
31
111
|
`;
|
|
32
|
-
const
|
|
33
|
-
font-size: 1.05rem;
|
|
112
|
+
const lede = css `
|
|
34
113
|
color: ${colors.textMuted};
|
|
114
|
+
font-size: 1.05rem;
|
|
115
|
+
line-height: 1.65;
|
|
116
|
+
margin: 1rem 0 0;
|
|
117
|
+
max-width: 52ch;
|
|
118
|
+
`;
|
|
119
|
+
// ---- Hero ----
|
|
120
|
+
const hero = css `
|
|
121
|
+
position: relative;
|
|
122
|
+
overflow: hidden;
|
|
123
|
+
border-bottom: 1px solid ${colors.border};
|
|
124
|
+
background:
|
|
125
|
+
radial-gradient(46rem 40rem at 80% -12%, rgba(201, 242, 78, 0.1), transparent 60%),
|
|
126
|
+
radial-gradient(40rem 40rem at 4% 118%, rgba(116, 228, 216, 0.07), transparent 55%);
|
|
127
|
+
`;
|
|
128
|
+
const heroInner = css `
|
|
129
|
+
position: relative;
|
|
130
|
+
z-index: 1;
|
|
131
|
+
max-width: ${MAX};
|
|
35
132
|
margin: 0 auto;
|
|
36
|
-
|
|
133
|
+
padding: 6rem 1.5rem 4.5rem;
|
|
134
|
+
@media (max-width: 640px) {
|
|
135
|
+
padding: 4rem 1.5rem 3rem;
|
|
136
|
+
}
|
|
137
|
+
`;
|
|
138
|
+
const reveal = css `
|
|
139
|
+
animation: ${revealUp} 0.75s ${EASE} both;
|
|
140
|
+
`;
|
|
141
|
+
const heroTitle = css `
|
|
142
|
+
font-family: ${fonts.display};
|
|
143
|
+
font-optical-sizing: auto;
|
|
144
|
+
font-weight: 500;
|
|
145
|
+
font-size: clamp(2.6rem, 6vw, 4.4rem);
|
|
146
|
+
line-height: 1.02;
|
|
147
|
+
letter-spacing: -0.025em;
|
|
148
|
+
color: ${colors.text};
|
|
149
|
+
margin: 1.2rem 0 0;
|
|
150
|
+
max-width: 16ch;
|
|
151
|
+
& em {
|
|
152
|
+
font-style: italic;
|
|
153
|
+
color: ${colors.green};
|
|
154
|
+
}
|
|
155
|
+
`;
|
|
156
|
+
const heroSub = css `
|
|
157
|
+
font-size: 1.2rem;
|
|
37
158
|
line-height: 1.6;
|
|
159
|
+
color: ${colors.textMuted};
|
|
160
|
+
margin: 1.6rem 0 0;
|
|
161
|
+
max-width: 54ch;
|
|
38
162
|
`;
|
|
39
163
|
const ctaRow = css `
|
|
40
164
|
display: flex;
|
|
41
165
|
gap: 0.85rem;
|
|
42
166
|
flex-wrap: wrap;
|
|
43
|
-
|
|
44
|
-
margin: 2.2rem 0 1.1rem;
|
|
167
|
+
margin: 2.2rem 0 0;
|
|
45
168
|
`;
|
|
46
169
|
const ctaPrimary = css `
|
|
47
170
|
display: inline-flex;
|
|
@@ -49,165 +172,429 @@ const ctaPrimary = css `
|
|
|
49
172
|
background: ${colors.green};
|
|
50
173
|
color: ${colors.textOnAccent};
|
|
51
174
|
font-weight: 600;
|
|
52
|
-
font-size: 0.
|
|
53
|
-
padding: 0.
|
|
175
|
+
font-size: 0.98rem;
|
|
176
|
+
padding: 0.85rem 1.7rem;
|
|
54
177
|
border-radius: 999px;
|
|
55
|
-
box-shadow: 0 0 0 1px ${colors.borderGlow}, 0
|
|
56
|
-
transition: background 0.2s, transform 0.2s;
|
|
178
|
+
box-shadow: 0 0 0 1px ${colors.borderGlow}, 0 14px 44px -16px rgba(201, 242, 78, 0.4);
|
|
179
|
+
transition: background 0.2s ${EASE}, transform 0.2s ${EASE};
|
|
57
180
|
&:hover {
|
|
58
181
|
background: ${colors.greenHover};
|
|
59
182
|
text-decoration: none;
|
|
60
|
-
transform: translateY(-
|
|
183
|
+
transform: translateY(-2px);
|
|
61
184
|
}
|
|
62
185
|
`;
|
|
63
|
-
const
|
|
186
|
+
const ctaGhost = css `
|
|
64
187
|
display: inline-flex;
|
|
65
188
|
align-items: center;
|
|
66
189
|
color: ${colors.text};
|
|
67
190
|
font-weight: 500;
|
|
68
|
-
font-size: 0.
|
|
69
|
-
padding: 0.
|
|
70
|
-
border: 1px solid ${colors.
|
|
191
|
+
font-size: 0.98rem;
|
|
192
|
+
padding: 0.85rem 1.5rem;
|
|
193
|
+
border: 1px solid ${colors.borderHover};
|
|
71
194
|
border-radius: 999px;
|
|
72
|
-
transition: border-color 0.2s, color 0.2s;
|
|
195
|
+
transition: border-color 0.2s ${EASE}, color 0.2s ${EASE};
|
|
73
196
|
&:hover {
|
|
74
197
|
border-color: ${colors.green};
|
|
75
|
-
color: ${colors.text};
|
|
76
198
|
text-decoration: none;
|
|
77
199
|
}
|
|
78
200
|
`;
|
|
79
|
-
const
|
|
80
|
-
margin: 1.
|
|
81
|
-
font-
|
|
201
|
+
const trustLine = css `
|
|
202
|
+
margin: 1.8rem 0 0;
|
|
203
|
+
font-family: ${fonts.mono};
|
|
204
|
+
font-size: 0.76rem;
|
|
205
|
+
letter-spacing: 0.04em;
|
|
82
206
|
color: ${colors.textMuted};
|
|
83
|
-
&
|
|
84
|
-
color: ${colors.
|
|
85
|
-
font-weight:
|
|
86
|
-
}
|
|
87
|
-
`;
|
|
88
|
-
const byline = css `
|
|
89
|
-
margin: 0.6rem 0 0;
|
|
90
|
-
font-size: 0.8rem;
|
|
91
|
-
color: ${colors.textFaint};
|
|
92
|
-
& a {
|
|
93
|
-
color: inherit;
|
|
207
|
+
& b {
|
|
208
|
+
color: ${colors.text};
|
|
209
|
+
font-weight: 500;
|
|
94
210
|
}
|
|
95
211
|
`;
|
|
96
212
|
const statsRow = css `
|
|
97
213
|
display: flex;
|
|
98
|
-
gap:
|
|
214
|
+
gap: 1rem;
|
|
99
215
|
flex-wrap: wrap;
|
|
100
|
-
|
|
101
|
-
margin: 1.5rem 0 3.5rem;
|
|
216
|
+
margin: 3.2rem 0 0;
|
|
102
217
|
`;
|
|
103
|
-
|
|
104
|
-
|
|
218
|
+
// ---- The shift (two-column editorial) ----
|
|
219
|
+
const split = css `
|
|
220
|
+
display: grid;
|
|
221
|
+
grid-template-columns: 1fr 1fr;
|
|
222
|
+
gap: 3rem;
|
|
223
|
+
align-items: start;
|
|
224
|
+
@media (max-width: 780px) {
|
|
225
|
+
grid-template-columns: 1fr;
|
|
226
|
+
gap: 2rem;
|
|
227
|
+
}
|
|
105
228
|
`;
|
|
106
|
-
const
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
229
|
+
const shiftCard = css `
|
|
230
|
+
border-left: 2px solid ${colors.border};
|
|
231
|
+
padding-left: 1.4rem;
|
|
232
|
+
& h3 {
|
|
233
|
+
font-family: ${fonts.display};
|
|
234
|
+
font-size: 1.35rem;
|
|
235
|
+
font-weight: 600;
|
|
236
|
+
color: ${colors.text};
|
|
237
|
+
margin: 0 0 0.6rem;
|
|
238
|
+
}
|
|
239
|
+
& p {
|
|
240
|
+
color: ${colors.textMuted};
|
|
241
|
+
font-size: 0.98rem;
|
|
242
|
+
line-height: 1.65;
|
|
243
|
+
margin: 0;
|
|
244
|
+
}
|
|
245
|
+
&.on {
|
|
246
|
+
border-left-color: ${colors.green};
|
|
247
|
+
}
|
|
248
|
+
&.on h3 {
|
|
249
|
+
color: ${colors.green};
|
|
250
|
+
}
|
|
111
251
|
`;
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
white-space: pre;
|
|
122
|
-
margin: 0.75rem 0;
|
|
252
|
+
// ---- Channel showcase (the centerpiece) ----
|
|
253
|
+
const showcaseWrap = css `
|
|
254
|
+
position: relative;
|
|
255
|
+
overflow: hidden;
|
|
256
|
+
border-top: 1px solid ${colors.border};
|
|
257
|
+
border-bottom: 1px solid ${colors.border};
|
|
258
|
+
background:
|
|
259
|
+
radial-gradient(50rem 34rem at 92% 0%, rgba(163, 113, 247, 0.08), transparent 60%),
|
|
260
|
+
linear-gradient(180deg, ${colors.bg}, #0c0f14);
|
|
123
261
|
`;
|
|
124
|
-
const
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
262
|
+
const chat = css `
|
|
263
|
+
background: ${colors.bgTerminal};
|
|
264
|
+
border: 1px solid ${colors.border};
|
|
265
|
+
border-radius: 14px;
|
|
266
|
+
overflow: hidden;
|
|
267
|
+
box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.8);
|
|
268
|
+
max-width: 720px;
|
|
129
269
|
`;
|
|
130
|
-
const
|
|
131
|
-
|
|
132
|
-
|
|
270
|
+
const chatBar = css `
|
|
271
|
+
display: flex;
|
|
272
|
+
align-items: center;
|
|
273
|
+
gap: 0.6rem;
|
|
274
|
+
padding: 0.85rem 1.1rem;
|
|
275
|
+
border-bottom: 1px solid ${colors.border};
|
|
276
|
+
background: #010409;
|
|
133
277
|
`;
|
|
134
|
-
const
|
|
135
|
-
|
|
136
|
-
font-
|
|
278
|
+
const chatChan = css `
|
|
279
|
+
font-family: ${fonts.mono};
|
|
280
|
+
font-size: 0.85rem;
|
|
281
|
+
color: ${colors.text};
|
|
282
|
+
& span {
|
|
283
|
+
color: ${colors.textMuted};
|
|
284
|
+
}
|
|
137
285
|
`;
|
|
138
|
-
const
|
|
139
|
-
margin:
|
|
140
|
-
|
|
286
|
+
const slackTag = css `
|
|
287
|
+
margin-left: auto;
|
|
288
|
+
font-size: 0.68rem;
|
|
289
|
+
font-family: ${fonts.mono};
|
|
290
|
+
letter-spacing: 0.08em;
|
|
291
|
+
text-transform: uppercase;
|
|
292
|
+
color: ${colors.platformSlack};
|
|
293
|
+
border: 1px solid rgba(163, 113, 247, 0.4);
|
|
294
|
+
border-radius: 999px;
|
|
295
|
+
padding: 0.15rem 0.55rem;
|
|
141
296
|
`;
|
|
142
|
-
const
|
|
143
|
-
|
|
144
|
-
font-family: ${"'Geist Mono', ui-monospace, monospace"};
|
|
145
|
-
margin-right: 0.5rem;
|
|
297
|
+
const chatBody = css `
|
|
298
|
+
padding: 0.5rem 0.25rem;
|
|
146
299
|
`;
|
|
147
|
-
const
|
|
148
|
-
display:
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
text-align: center;
|
|
154
|
-
text-decoration: none;
|
|
155
|
-
transition: border-color 0.2s;
|
|
156
|
-
margin-bottom: 1.25rem;
|
|
300
|
+
const msg = css `
|
|
301
|
+
display: grid;
|
|
302
|
+
grid-template-columns: 34px 1fr;
|
|
303
|
+
gap: 0.75rem;
|
|
304
|
+
padding: 0.7rem 1.1rem;
|
|
305
|
+
align-items: start;
|
|
157
306
|
&:hover {
|
|
158
|
-
|
|
159
|
-
text-decoration: none;
|
|
307
|
+
background: rgba(255, 255, 255, 0.015);
|
|
160
308
|
}
|
|
161
309
|
`;
|
|
162
|
-
const
|
|
163
|
-
|
|
164
|
-
|
|
310
|
+
const avatar = css `
|
|
311
|
+
width: 34px;
|
|
312
|
+
height: 34px;
|
|
313
|
+
border-radius: 8px;
|
|
314
|
+
display: grid;
|
|
315
|
+
place-items: center;
|
|
316
|
+
font-family: ${fonts.mono};
|
|
317
|
+
font-size: 0.85rem;
|
|
165
318
|
font-weight: 600;
|
|
166
|
-
margin: 0 0 0.5rem 0;
|
|
167
319
|
`;
|
|
168
|
-
const
|
|
320
|
+
const msgHead = css `
|
|
321
|
+
display: flex;
|
|
322
|
+
align-items: center;
|
|
323
|
+
gap: 0.5rem;
|
|
324
|
+
flex-wrap: wrap;
|
|
325
|
+
margin-bottom: 0.15rem;
|
|
326
|
+
`;
|
|
327
|
+
const msgName = css `
|
|
169
328
|
font-size: 0.88rem;
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
line-height: 1.6;
|
|
329
|
+
font-weight: 600;
|
|
330
|
+
color: ${colors.text};
|
|
173
331
|
`;
|
|
174
|
-
const
|
|
175
|
-
|
|
176
|
-
|
|
332
|
+
const roleTag = css `
|
|
333
|
+
font-size: 0.62rem;
|
|
334
|
+
font-family: ${fonts.mono};
|
|
335
|
+
letter-spacing: 0.06em;
|
|
336
|
+
text-transform: uppercase;
|
|
337
|
+
padding: 0.08rem 0.4rem;
|
|
338
|
+
border-radius: 4px;
|
|
339
|
+
`;
|
|
340
|
+
const ts = css `
|
|
341
|
+
font-size: 0.7rem;
|
|
177
342
|
color: ${colors.textFaint};
|
|
178
|
-
font-size: 0.82rem;
|
|
179
|
-
border-top: 1px solid ${colors.border};
|
|
180
|
-
margin-top: 3rem;
|
|
181
343
|
`;
|
|
182
|
-
const
|
|
344
|
+
const msgText = css `
|
|
345
|
+
font-size: 0.92rem;
|
|
346
|
+
line-height: 1.55;
|
|
347
|
+
color: ${colors.text};
|
|
348
|
+
margin: 0;
|
|
349
|
+
& code {
|
|
350
|
+
font-family: ${fonts.mono};
|
|
351
|
+
font-size: 0.82em;
|
|
352
|
+
color: ${colors.green};
|
|
353
|
+
background: ${colors.accentSoft};
|
|
354
|
+
padding: 0.05em 0.35em;
|
|
355
|
+
border-radius: 4px;
|
|
356
|
+
}
|
|
357
|
+
& b {
|
|
358
|
+
color: ${colors.cyan};
|
|
359
|
+
font-weight: 500;
|
|
360
|
+
}
|
|
361
|
+
`;
|
|
362
|
+
/** A single showcase message row. */
|
|
363
|
+
const Msg = ({ initials, avatarBg, avatarColor, name, role, roleColor, roleBg, time, children }) => (_jsxs("div", { class: msg, children: [_jsx("div", { class: avatar, style: `background:${avatarBg};color:${avatarColor};`, children: initials }), _jsxs("div", { children: [_jsxs("div", { class: msgHead, children: [_jsx("span", { class: msgName, children: name }), _jsx("span", { class: roleTag, style: `color:${roleColor};background:${roleBg};`, children: role }), _jsx("span", { class: ts, children: time })] }), _jsx("p", { class: msgText, children: children })] })] }));
|
|
364
|
+
// ---- Use cases ----
|
|
365
|
+
const cardGrid = css `
|
|
183
366
|
display: grid;
|
|
184
|
-
grid-template-columns: repeat(auto-fit, minmax(
|
|
185
|
-
gap: 1.
|
|
186
|
-
margin: 1rem 0;
|
|
367
|
+
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
|
|
368
|
+
gap: 1.1rem;
|
|
187
369
|
`;
|
|
188
|
-
const
|
|
370
|
+
const useCard = css `
|
|
371
|
+
position: relative;
|
|
189
372
|
background: ${colors.bgCard};
|
|
190
373
|
border: 1px solid ${colors.border};
|
|
191
|
-
border-radius:
|
|
192
|
-
padding: 1.
|
|
193
|
-
transition: border-color 0.
|
|
374
|
+
border-radius: 14px;
|
|
375
|
+
padding: 1.6rem;
|
|
376
|
+
transition: border-color 0.22s ${EASE}, transform 0.22s ${EASE};
|
|
194
377
|
&:hover {
|
|
195
|
-
border-color: ${colors.
|
|
378
|
+
border-color: ${colors.borderGlow};
|
|
379
|
+
transform: translateY(-3px);
|
|
380
|
+
}
|
|
381
|
+
& .ico {
|
|
382
|
+
font-size: 1.4rem;
|
|
383
|
+
margin-bottom: 0.9rem;
|
|
196
384
|
}
|
|
197
385
|
& h3 {
|
|
198
|
-
font-
|
|
386
|
+
font-family: ${fonts.display};
|
|
387
|
+
font-size: 1.2rem;
|
|
199
388
|
font-weight: 600;
|
|
200
389
|
color: ${colors.text};
|
|
201
|
-
margin: 0 0 0.5rem
|
|
390
|
+
margin: 0 0 0.5rem;
|
|
202
391
|
}
|
|
203
392
|
& p {
|
|
204
|
-
font-size: 0.88rem;
|
|
205
393
|
color: ${colors.textMuted};
|
|
394
|
+
font-size: 0.92rem;
|
|
395
|
+
line-height: 1.6;
|
|
206
396
|
margin: 0;
|
|
397
|
+
}
|
|
398
|
+
& .out {
|
|
399
|
+
margin-top: 1rem;
|
|
400
|
+
padding-top: 0.9rem;
|
|
401
|
+
border-top: 1px dashed ${colors.border};
|
|
402
|
+
font-size: 0.82rem;
|
|
403
|
+
color: ${colors.text};
|
|
404
|
+
font-weight: 500;
|
|
405
|
+
}
|
|
406
|
+
& .out b {
|
|
407
|
+
color: ${colors.green};
|
|
408
|
+
font-weight: 600;
|
|
409
|
+
}
|
|
410
|
+
`;
|
|
411
|
+
// ---- Platforms ----
|
|
412
|
+
const platGrid = css `
|
|
413
|
+
display: grid;
|
|
414
|
+
grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
|
|
415
|
+
gap: 1rem;
|
|
416
|
+
`;
|
|
417
|
+
const platCard = css `
|
|
418
|
+
background: ${colors.bgCard};
|
|
419
|
+
border: 1px solid ${colors.border};
|
|
420
|
+
border-radius: 12px;
|
|
421
|
+
padding: 1.3rem 1.4rem;
|
|
422
|
+
display: flex;
|
|
423
|
+
flex-direction: column;
|
|
424
|
+
gap: 0.5rem;
|
|
425
|
+
& .top {
|
|
426
|
+
display: flex;
|
|
427
|
+
align-items: center;
|
|
428
|
+
justify-content: space-between;
|
|
429
|
+
}
|
|
430
|
+
& .name {
|
|
431
|
+
display: inline-flex;
|
|
432
|
+
align-items: center;
|
|
433
|
+
gap: 0.55rem;
|
|
434
|
+
font-weight: 600;
|
|
435
|
+
color: ${colors.text};
|
|
436
|
+
font-size: 1rem;
|
|
437
|
+
}
|
|
438
|
+
& .name svg {
|
|
439
|
+
flex: none;
|
|
440
|
+
}
|
|
441
|
+
& p {
|
|
442
|
+
font-size: 0.86rem;
|
|
443
|
+
color: ${colors.textMuted};
|
|
207
444
|
line-height: 1.55;
|
|
445
|
+
margin: 0;
|
|
446
|
+
}
|
|
447
|
+
`;
|
|
448
|
+
const badge = css `
|
|
449
|
+
font-family: ${fonts.mono};
|
|
450
|
+
font-size: 0.62rem;
|
|
451
|
+
letter-spacing: 0.08em;
|
|
452
|
+
text-transform: uppercase;
|
|
453
|
+
padding: 0.15rem 0.5rem;
|
|
454
|
+
border-radius: 999px;
|
|
455
|
+
`;
|
|
456
|
+
// ---- Security ----
|
|
457
|
+
const secGrid = css `
|
|
458
|
+
display: grid;
|
|
459
|
+
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
|
|
460
|
+
gap: 1.6rem 2rem;
|
|
461
|
+
`;
|
|
462
|
+
const secItem = css `
|
|
463
|
+
& h3 {
|
|
464
|
+
font-size: 0.98rem;
|
|
465
|
+
font-weight: 600;
|
|
466
|
+
color: ${colors.text};
|
|
467
|
+
margin: 0 0 0.35rem;
|
|
468
|
+
display: flex;
|
|
469
|
+
align-items: center;
|
|
470
|
+
gap: 0.5rem;
|
|
471
|
+
}
|
|
472
|
+
& h3::before {
|
|
473
|
+
content: "";
|
|
474
|
+
width: 6px;
|
|
475
|
+
height: 6px;
|
|
476
|
+
border-radius: 999px;
|
|
477
|
+
background: ${colors.green};
|
|
478
|
+
box-shadow: 0 0 8px ${colors.green};
|
|
479
|
+
}
|
|
480
|
+
& p {
|
|
481
|
+
color: ${colors.textMuted};
|
|
482
|
+
font-size: 0.88rem;
|
|
483
|
+
line-height: 1.6;
|
|
484
|
+
margin: 0;
|
|
485
|
+
padding-left: 1rem;
|
|
486
|
+
}
|
|
487
|
+
`;
|
|
488
|
+
// ---- Get started (two lanes) ----
|
|
489
|
+
const startWrap = css `
|
|
490
|
+
border-top: 1px solid ${colors.border};
|
|
491
|
+
background:
|
|
492
|
+
radial-gradient(44rem 30rem at 50% 120%, rgba(201, 242, 78, 0.07), transparent 60%);
|
|
493
|
+
`;
|
|
494
|
+
const lanes = css `
|
|
495
|
+
display: grid;
|
|
496
|
+
grid-template-columns: 1fr 1fr;
|
|
497
|
+
gap: 1.25rem;
|
|
498
|
+
@media (max-width: 780px) {
|
|
499
|
+
grid-template-columns: 1fr;
|
|
500
|
+
}
|
|
501
|
+
`;
|
|
502
|
+
const lane = css `
|
|
503
|
+
background: ${colors.bgCard};
|
|
504
|
+
border: 1px solid ${colors.border};
|
|
505
|
+
border-radius: 16px;
|
|
506
|
+
padding: 1.8rem;
|
|
507
|
+
& h3 {
|
|
508
|
+
font-family: ${fonts.display};
|
|
509
|
+
font-size: 1.35rem;
|
|
510
|
+
color: ${colors.text};
|
|
511
|
+
margin: 0.4rem 0 0.3rem;
|
|
512
|
+
}
|
|
513
|
+
& .price {
|
|
514
|
+
color: ${colors.textMuted};
|
|
515
|
+
font-size: 0.9rem;
|
|
516
|
+
margin: 0 0 1.2rem;
|
|
517
|
+
}
|
|
518
|
+
`;
|
|
519
|
+
const laneTeam = css `
|
|
520
|
+
border-color: ${colors.borderGlow};
|
|
521
|
+
box-shadow: 0 0 0 1px ${colors.borderGlow}, 0 24px 60px -30px rgba(201, 242, 78, 0.22);
|
|
522
|
+
`;
|
|
523
|
+
const code = css `
|
|
524
|
+
display: block;
|
|
525
|
+
background: ${colors.bg};
|
|
526
|
+
border: 1px solid ${colors.border};
|
|
527
|
+
border-left: 3px solid ${colors.green};
|
|
528
|
+
border-radius: 8px;
|
|
529
|
+
padding: 0.8rem 0.9rem;
|
|
530
|
+
color: ${colors.text};
|
|
531
|
+
font-family: ${fonts.mono};
|
|
532
|
+
font-size: 0.82rem;
|
|
533
|
+
overflow-x: auto;
|
|
534
|
+
white-space: pre;
|
|
535
|
+
margin: 0.6rem 0;
|
|
536
|
+
`;
|
|
537
|
+
const note = css `
|
|
538
|
+
color: ${colors.textMuted};
|
|
539
|
+
font-size: 0.88rem;
|
|
540
|
+
line-height: 1.6;
|
|
541
|
+
margin: 0.8rem 0 0;
|
|
542
|
+
& code {
|
|
543
|
+
font-family: ${fonts.mono};
|
|
544
|
+
color: ${colors.green};
|
|
545
|
+
}
|
|
546
|
+
`;
|
|
547
|
+
const teamCta = css `
|
|
548
|
+
display: inline-flex;
|
|
549
|
+
align-items: center;
|
|
550
|
+
margin-top: 1rem;
|
|
551
|
+
background: ${colors.green};
|
|
552
|
+
color: ${colors.textOnAccent};
|
|
553
|
+
font-weight: 600;
|
|
554
|
+
font-size: 0.9rem;
|
|
555
|
+
padding: 0.7rem 1.3rem;
|
|
556
|
+
border-radius: 999px;
|
|
557
|
+
transition: background 0.2s ${EASE}, transform 0.2s ${EASE};
|
|
558
|
+
&:hover {
|
|
559
|
+
background: ${colors.greenHover};
|
|
560
|
+
transform: translateY(-1px);
|
|
561
|
+
text-decoration: none;
|
|
562
|
+
}
|
|
563
|
+
`;
|
|
564
|
+
const docsRow = css `
|
|
565
|
+
display: flex;
|
|
566
|
+
gap: 1.5rem;
|
|
567
|
+
flex-wrap: wrap;
|
|
568
|
+
margin-top: 2.5rem;
|
|
569
|
+
& a {
|
|
570
|
+
font-size: 0.9rem;
|
|
571
|
+
color: ${colors.cyan};
|
|
572
|
+
}
|
|
573
|
+
& a:hover {
|
|
574
|
+
color: ${colors.green};
|
|
575
|
+
}
|
|
576
|
+
`;
|
|
577
|
+
// ---- Footer ----
|
|
578
|
+
const footer = css `
|
|
579
|
+
border-top: 1px solid ${colors.border};
|
|
580
|
+
padding: 3rem 1.5rem;
|
|
581
|
+
max-width: ${MAX};
|
|
582
|
+
margin: 0 auto;
|
|
583
|
+
display: flex;
|
|
584
|
+
flex-wrap: wrap;
|
|
585
|
+
align-items: center;
|
|
586
|
+
gap: 1rem;
|
|
587
|
+
justify-content: space-between;
|
|
588
|
+
color: ${colors.textFaint};
|
|
589
|
+
font-size: 0.82rem;
|
|
590
|
+
& a {
|
|
591
|
+
color: ${colors.textMuted};
|
|
592
|
+
}
|
|
593
|
+
& a:hover {
|
|
594
|
+
color: ${colors.green};
|
|
208
595
|
}
|
|
209
596
|
`;
|
|
210
|
-
// --- SSE inline script ---
|
|
597
|
+
// --- SSE inline script (live stats) ---
|
|
211
598
|
const sseScript = `
|
|
212
599
|
const es = new EventSource('/ui/stats/stream');
|
|
213
600
|
es.addEventListener('stats', (e) => {
|
|
@@ -219,11 +606,10 @@ const sseScript = `
|
|
|
219
606
|
});
|
|
220
607
|
`;
|
|
221
608
|
/**
|
|
222
|
-
*
|
|
223
|
-
*
|
|
609
|
+
* Enterprise landing: positions Cogent as the fabric that brings every AI
|
|
610
|
+
* agent into the messaging tools teams already use, with a live multi-agent
|
|
611
|
+
* channel showcase, benefit-driven use cases, honest platform status, and an
|
|
612
|
+
* enterprise-security section. Reuses StatCard + the SSE stream for live stats.
|
|
224
613
|
*/
|
|
225
|
-
export const LandingPage = ({ stats }) => (_jsx(Layout, { title: "Real-time relay for AI coding agents", children: _jsxs("div", { class: container, children: [_jsxs("div", { class: heroSection, children: [_jsx("p", { class: kicker, children: "Free \u00B7 Open Relay" }), _jsx("h1", { class: heroTitle, children: "Real-time relay for your AI coding agents" }), _jsx("p", { class: heroSubtitle, children: "Claude Code, OpenAI Codex, and Slack \u2014 one shared channel, instant messages. Free and open-source." }), _jsxs("div", { class: ctaRow, children: [_jsx("a", { href: "#install", class: ctaPrimary, children: "Get started \u2014 free \u2192" }), _jsx("a", { href: "/how-to", class: ctaSecondary, children: "Read the How-To" })] }), _jsxs("p", { class: teamUpsell, children: ["Running a team?", " ", _jsx("a", { href: "https://portal.cogent.tools", children: "Cogent Team" }), " adds organizations, SSO & billing \u2192"] }), _jsxs("p", { class: byline, children: ["by ", _jsx("a", { href: "https://essentialai.uk", children: "Essential AI Solutions" })] })] }), _jsxs("div", { class: statsRow, children: [_jsx(StatCard, { id: "stat-sessions", value: stats.activeSessions, label: "Active Sessions" }), _jsx(StatCard, { id: "stat-agents", value: stats.connectedAgents, label: "Connected Agents" }), _jsx(StatCard, { id: "stat-messages", value: stats.totalMessagesRelayed, label: "Messages Relayed" })] }), _jsxs("div", { class: section, id: "install", children: [_jsx("h2", { class: sectionTitle, children: "Install via Plugin Marketplace (Recommended)" }), _jsxs(Terminal, { title: "Two Commands \u2014 Full Setup", children: [_jsx("p", { class: noteText, children: "Install the plugin with slash commands, auto-discovery, and cloud relay:" }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "claude plugin marketplace add https://github.com/eaisdevelopment/cogent.git" })] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "claude plugin install cogent@cogent" })] }), _jsxs("p", { class: noteText, children: ["Restart Claude Code. Use ", _jsx("span", { class: stepCommand, children: "/cogent:register" }), " to join the bridge \u2014 session discovery, registration, and message protocol are handled automatically."] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "Alternative: Manual MCP Setup" }), _jsxs(Terminal, { title: "MCP Tools Only (No Slash Commands)", children: [_jsx("p", { class: noteText, children: "Or use a single command to register the MCP server directly:" }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "claude mcp add cogent -e COGENT_ENDPOINT=https://cogent.tools -s user -- npx -y @essentialai/cogent-bridge" })] }), _jsxs("p", { class: noteText, children: ["This gives you the six ", _jsx("span", { class: stepCommand, children: "cogent_" }), " MCP tools. For slash commands (", _jsx("span", { class: stepCommand, children: "/cogent:register" }), ", etc.), use the Plugin Marketplace above."] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "OpenAI Codex" }), _jsxs(Terminal, { title: "Add Cogent to Codex", children: [_jsx("p", { class: noteText, children: "Register the Cogent MCP server (works on all Codex CLI versions):" }), _jsx("pre", { class: codeBlock, children: `codex mcp add cogent \\
|
|
226
|
-
--env COGENT_ENDPOINT=https://cogent.tools \\
|
|
227
|
-
--env COGENT_PLATFORM=codex \\
|
|
228
|
-
-- npx -y @essentialai/cogent-bridge` }), _jsxs("p", { class: noteText, children: ["Restart Codex. This gives you the six ", _jsx("span", { class: stepCommand, children: "cogent_" }), " MCP tools. Use ", _jsx("span", { class: stepCommand, children: "cogent_register_peer" }), " to join the bridge."] }), _jsxs("details", { style: "margin-top: 1rem;", children: [_jsx("summary", { style: `cursor: pointer; color: ${colors.textMuted}; font-size: 0.85rem;`, children: "Plugin Marketplace (Codex CLI 0.133.0+)" }), _jsxs("div", { style: "margin-top: 0.75rem;", children: [_jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "codex plugin marketplace add eaisdevelopment/cogent" })] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "codex plugin add cogent@cogent" })] }), _jsx("p", { class: noteText, children: "Adds skills + MCP tools in one step. Requires Codex CLI 0.133.0 or newer." })] })] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "Updating to the Latest Version" }), _jsxs(Terminal, { title: "Stay Up to Date", children: [_jsxs("p", { class: noteText, children: [_jsx("span", { class: stepNumber, children: "Plugin Marketplace:" }), " Re-run the install command to pull the latest version:"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "claude plugin marketplace add https://github.com/eaisdevelopment/cogent.git" })] }), _jsxs("p", { class: noteText, children: [_jsx("span", { class: stepNumber, children: "Manual MCP / Claude Desktop:" }), " If you used ", _jsx("span", { class: stepCommand, children: "npx -y @essentialai/cogent-bridge" }), ", you already get the latest version automatically on each restart. No action needed."] }), _jsxs("p", { class: noteText, children: [_jsx("span", { class: stepNumber, children: "Global install:" }), " If you installed globally with npm, update explicitly:"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "$" }), _jsx("span", { class: stepCommand, children: "npm update -g @essentialai/cogent-bridge" })] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "Quick Start" }), _jsxs(Terminal, { title: "Quick Start", children: [_jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "1." }), " Create a channel with a friendly name"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: ">" }), _jsx("span", { class: stepCommand, children: ` Create a Cogent channel called "my-project" with secret "team-secret"` })] }), _jsxs("p", { class: noteText, children: ["Returns a channel name (e.g., ", _jsx("span", { class: stepCommand, children: "my-project" }), ") and a secret to share. Omit the name to auto-generate one (e.g., ", _jsx("span", { class: stepCommand, children: "swift-fox-a3f1" }), ")."] }), _jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "2." }), " Join from another Claude Code instance using the channel name"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: ">" }), _jsx("span", { class: stepCommand, children: ` Join Cogent channel "my-project" with secret "team-secret"` })] }), _jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "3." }), " Start communicating"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: ">" }), _jsx("span", { class: stepCommand, children: ` Register as "backend" and send a message to "frontend"` })] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "Supported Platforms" }), _jsxs("div", { class: platformGrid, children: [_jsxs("div", { class: platformCard, children: [_jsx("h3", { children: "\u26A1 Claude Code" }), _jsx("p", { children: "Full auto-relay \u2014 Claude sessions respond automatically to inbound messages." })] }), _jsxs("div", { class: platformCard, children: [_jsx("h3", { children: "\uD83E\uDD16 OpenAI Codex" }), _jsx("p", { children: "Channel messaging \u2014 Codex agents send and receive via MCP tools. Auto-relay via plugin (v3.4+)." })] }), _jsxs("div", { class: platformCard, children: [_jsx("h3", { children: "\uD83D\uDCAC Slack" }), _jsx("p", { children: "Bridge human conversations \u2014 Slack users talk to AI agents via the Slack adapter." })] })] })] }), _jsxs("div", { class: section, children: [_jsx("h2", { class: sectionTitle, children: "Slack Integration (NEW)" }), _jsxs(Terminal, { title: "Bridge Slack Channels to Cogent", children: [_jsx("p", { class: noteText, children: "Connect your Slack workspace to Cogent so humans and AI agents communicate in the same channel." }), _jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "1." }), " Install the Cogent Bridge Slack app in your workspace"] }), _jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "2." }), " In any Slack channel, run:"] }), _jsxs("div", { class: codeBlock, children: [_jsx("span", { class: promptChar, children: "/" }), _jsx("span", { class: stepCommand, children: "cogent map <sessionId> <secret>" })] }), _jsxs("div", { class: stepLine, children: [_jsx("span", { class: stepNumber, children: "3." }), " Messages flow bidirectionally \u2014 Slack users and CC agents share the same conversation"] }), _jsxs("p", { class: noteText, children: ["Slash commands: ", _jsx("span", { class: stepCommand, children: "/cogent peers" }), " (list all peers), ", _jsx("span", { class: stepCommand, children: "/cogent send @backend msg" }), " (targeted message), ", _jsx("span", { class: stepCommand, children: "/cogent status" }), " (session health)"] })] })] }), _jsxs("a", { href: "/how-to", class: howToLink, children: [_jsx("div", { class: howToTitle, children: "How Teams Deliver Faster with Cogent \u2192" }), _jsx("p", { class: howToDesc, children: "Real-world use cases, command examples, and best practices for parallel development, cross-team bug fixes, API contract negotiation, and more." })] }), _jsxs("a", { href: "/faq", class: howToLink, children: [_jsx("div", { class: howToTitle, children: "FAQ & Troubleshooting \u2192" }), _jsx("p", { class: howToDesc, children: "Common setup issues, message flow troubleshooting, version compatibility, and solutions for Slack bridge configuration." })] }), _jsxs("a", { href: "/update", class: howToLink, children: [_jsx("div", { class: howToTitle, children: "Update & Upgrade Guide \u2192" }), _jsx("p", { class: howToDesc, children: "Step-by-step upgrade instructions, breaking change notes, troubleshooting common update issues, and rollback procedures." })] }), _jsxs("div", { class: footer, children: ["Cogent \u2014 by ", _jsx("a", { href: "https://essentialai.uk", style: "color: inherit;", children: "Essential AI Solutions Ltd." }), " \u2014 ", _jsx("a", { href: "/", style: "color: inherit;", children: "cogent.tools" })] }), _jsx("script", { dangerouslySetInnerHTML: { __html: sseScript } })] }) }));
|
|
614
|
+
export const LandingPage = ({ stats }) => (_jsxs(Layout, { title: "Communicating Agents \u2014 bring every AI agent into Slack", children: [_jsx("nav", { class: nav, children: _jsxs("div", { class: navInner, children: [_jsxs("a", { href: "/", class: brand, children: [_jsx(BrandMark, {}), "Cogent"] }), _jsxs("div", { class: navLinks, children: [_jsx("a", { href: "#how", class: "nav-hide", children: "How it works" }), _jsx("a", { href: "#use-cases", class: "nav-hide", children: "Use cases" }), _jsx("a", { href: "#platforms", class: "nav-hide", children: "Platforms" }), _jsx("a", { href: "#security", class: "nav-hide", children: "Security" }), _jsx("a", { href: "/how-to", class: "nav-hide", children: "Docs" }), _jsx("a", { href: "https://portal.cogent.tools/login", children: "Sign in" }), _jsx("a", { href: "#start", class: navCta, children: "Get started" })] })] }) }), _jsxs("header", { class: hero, children: [_jsx("div", { class: grainOverlay }), _jsxs("div", { class: heroInner, children: [_jsx("p", { class: cx(eyebrow, reveal), style: "animation-delay:0ms", children: "Communicating Agents \u00B7 Slack \u00B7 Teams \u00B7 WhatsApp" }), _jsxs("h1", { class: cx(heroTitle, reveal), style: "animation-delay:70ms", children: ["Put your AI agents in ", _jsx("em", { children: "the room" }), " where the work happens."] }), _jsx("p", { class: cx(heroSub, reveal), style: "animation-delay:140ms", children: "Cogent bridges Slack, Microsoft Teams and WhatsApp to Claude Code, Codex and your own agents \u2014 so many agents and many people collaborate in one channel, in real time. No new tool for your team to learn." }), _jsxs("div", { class: cx(ctaRow, reveal), style: "animation-delay:210ms", children: [_jsx("a", { href: "#start", class: ctaPrimary, children: "Get started \u2014 free \u2192" }), _jsx("a", { href: "#showcase", class: ctaGhost, children: "See it in action" })] }), _jsxs("p", { class: cx(trustLine, reveal), style: "animation-delay:280ms", children: [_jsx("b", { children: "Free & open-source core" }), " \u00B7 Least-privilege \u00B7 Encrypted at rest \u00B7 Per-org isolation"] }), _jsxs("div", { class: cx(statsRow, reveal), style: "animation-delay:360ms", children: [_jsx(StatCard, { id: "stat-sessions", value: stats.activeSessions, label: "Channels Live" }), _jsx(StatCard, { id: "stat-agents", value: stats.connectedAgents, label: "Agents Connected" }), _jsx(StatCard, { id: "stat-messages", value: stats.totalMessagesRelayed, label: "Messages Relayed" })] })] })] }), _jsxs("section", { class: section, children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "The gap" }), _jsxs("h2", { class: h2, children: ["Agents are brilliant. And ", _jsx("em", { children: "invisible." })] })] }), _jsxs("div", { class: split, children: [_jsxs("div", { class: shiftCard, children: [_jsx("h3", { children: "Today: siloed in terminals" }), _jsx("p", { children: "Your agents run in terminals, IDEs and CI. Your team lives in Slack and Teams. The handoff between them is copy-paste, screenshots and lost context \u2014 a human playing switchboard between the two worlds all day." })] }), _jsxs("div", { class: cx(shiftCard, "on"), children: [_jsx("h3", { children: "With Cogent: in the room" }), _jsx("p", { children: "Map a channel once. Now every agent is a first-class participant in the conversation \u2014 answering questions, flagging risks and coordinating with each other, right where your people already are. The switchboard disappears." })] })] })] }), _jsxs("div", { class: showcaseWrap, id: "showcase", children: [_jsx("div", { class: grainOverlay }), _jsxs("section", { class: section, style: "position:relative;z-index:1", children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "What it looks like" }), _jsx("h2", { class: h2, children: "One channel. Many agents. Your whole team." }), _jsx("p", { class: lede, children: "A real incident, handled where the team already is \u2014 humans and multiple specialist agents in the same Slack thread, no terminal required." })] }), _jsxs("div", { class: chat, children: [_jsxs("div", { class: chatBar, children: [_jsx(BrandMark, { size: 18 }), _jsxs("span", { class: chatChan, children: ["#incident-2043 ", _jsx("span", { children: "\u00B7 4 members \u00B7 2 agents" })] }), _jsx("span", { class: slackTag, children: "Slack" })] }), _jsxs("div", { class: chatBody, children: [_jsx(Msg, { initials: "MR", avatarBg: "#2a2140", avatarColor: "#c9b8ff", name: "Maria Ruiz", role: "On-call", roleColor: colors.text, roleBg: colors.bgRaised, time: "02:14", children: "checkout latency just spiked to 4s. p99 through the roof. what changed?" }), _jsxs(Msg, { initials: "\u25C6", avatarBg: "rgba(116,228,216,0.14)", avatarColor: colors.platformCc, name: "ops-agent", role: "Claude Code", roleColor: colors.platformCc, roleBg: "rgba(116,228,216,0.12)", time: "02:14", children: ["Deploy ", _jsx("code", { children: "a1f9c" }), " shipped 6 min ago added a synchronous call to the pricing service in the checkout path. Rolling back to ", _jsx("code", { children: "e8ab6" }), " now \u2014", _jsx("b", { children: " @sec-agent" }), " can you confirm nothing security-sensitive in that diff?"] }), _jsxs(Msg, { initials: "\u25B2", avatarBg: "rgba(247,110,110,0.14)", avatarColor: colors.red, name: "sec-agent", role: "Codex", roleColor: colors.platformCodex, roleBg: "rgba(116,227,160,0.12)", time: "02:15", children: ["Confirmed \u2014 ", _jsx("code", { children: "a1f9c" }), " touches pricing only, no auth or PII paths. Safe to roll back. I've opened a follow-up to make that call async."] }), _jsx(Msg, { initials: "DP", avatarBg: "#20303a", avatarColor: colors.cyan, name: "Dan Park", role: "Eng lead", roleColor: colors.text, roleBg: colors.bgRaised, time: "02:16", children: "p99 back to 180ms. nice. that was four minutes, not four hours. \uD83D\uDE4C" })] })] }), _jsxs("p", { class: lede, style: "margin-top:1.75rem", children: ["Two humans, two agents from two different vendors \u2014 one conversation. The agents talked ", _jsx("em", { style: "color:inherit;font-style:italic", children: "to each other" }), ", not just to a person, and the whole thing closed before anyone opened a terminal."] })] })] }), _jsxs("section", { class: section, id: "how", children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "How it works" }), _jsx("h2", { class: h2, children: "Live in three steps." })] }), _jsxs("div", { class: split, style: "margin-bottom:2rem", children: [_jsxs("div", { class: shiftCard, children: [_jsx("h3", { children: "1 \u00B7 Install, once" }), _jsx("p", { children: "Add Cogent to Claude Code or Codex. Agents auto-discover the bridge \u2014 no glue code, no bespoke integration." })] }), _jsxs("div", { class: shiftCard, children: [_jsx("h3", { children: "2 \u00B7 Map a channel" }), _jsxs("p", { children: ["Run ", _jsx("code", { style: `color:${colors.green};font-family:${fonts.mono}`, children: "/cogent map" }), " in any Slack channel to bind it to a Cogent channel. That's the whole setup."] })] })] }), _jsxs("div", { class: shiftCard, style: "max-width:640px", children: [_jsx("h3", { children: "3 \u00B7 Everyone's in the room" }), _jsx("p", { children: "Humans type in Slack. Agents receive, reason and reply \u2014 to people and to each other \u2014 in the same thread. Add more agents or more people any time." })] })] }), _jsxs("section", { class: section, id: "use-cases", children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "Where it pays off" }), _jsxs("h2", { class: h2, children: ["Built for how teams ", _jsx("em", { children: "actually" }), " work."] })] }), _jsxs("div", { class: cardGrid, children: [_jsxs("div", { class: useCard, children: [_jsx("div", { class: "ico", children: "\uD83D\uDEA8" }), _jsx("h3", { children: "Incident response" }), _jsx("p", { children: "On-call engineers, an ops agent and a security agent triage in one channel \u2014 diagnose, verify and roll back together." }), _jsxs("div", { class: "out", children: [_jsx("b", { children: "Outcome:" }), " minutes to resolution, not hours."] })] }), _jsxs("div", { class: useCard, children: [_jsx("div", { class: "ico", children: "\u26A1" }), _jsx("h3", { children: "Parallel delivery" }), _jsx("p", { children: "Frontend and backend agents negotiate the API contract while the PM watches and steers \u2014 all in the sprint channel." }), _jsxs("div", { class: "out", children: [_jsx("b", { children: "Outcome:" }), " no integration-day surprises."] })] }), _jsxs("div", { class: useCard, children: [_jsx("div", { class: "ico", children: "\uD83D\uDD17" }), _jsx("h3", { children: "Cross-vendor agents" }), _jsx("p", { children: "Claude Code, OpenAI Codex and your own MCP agent in one thread. Vendor-neutral \u2014 mix the best model for each job." }), _jsxs("div", { class: "out", children: [_jsx("b", { children: "Outcome:" }), " no lock-in, one workflow."] })] }), _jsxs("div", { class: useCard, children: [_jsx("div", { class: "ico", children: "\uD83D\uDCAC" }), _jsx("h3", { children: "Stakeholders in the loop" }), _jsx("p", { children: "Product managers and execs ask agents questions from the tools they already use \u2014 no terminal, no onboarding." }), _jsxs("div", { class: "out", children: [_jsx("b", { children: "Outcome:" }), " everyone speaks to the agents."] })] })] })] }), _jsxs("section", { class: section, id: "platforms", children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "Meet your team where they are" }), _jsx("h2", { class: h2, children: "The tools your people already open." }), _jsx("p", { class: lede, children: "Vendor-neutral by design \u2014 human channels on one side, any agent on the other." })] }), _jsxs("div", { class: platGrid, children: [_jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "slack" }), " Slack"] }), _jsx("span", { class: badge, style: `color:${colors.green};background:${colors.accentSoft};`, children: "Live" })] }), _jsx("p", { children: "Bidirectional bridge with @mentions, attribution and threaded replies. Available today." })] }), _jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "teams" }), " Microsoft Teams"] }), _jsx("span", { class: badge, style: `color:${colors.amber};background:rgba(242,193,78,0.12);`, children: "Coming" })] }), _jsx("p", { children: "The same room for Teams-first organisations. On the roadmap." })] }), _jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "whatsapp" }), " WhatsApp"] }), _jsx("span", { class: badge, style: `color:${colors.amber};background:rgba(242,193,78,0.12);`, children: "Coming" })] }), _jsx("p", { children: "Reach people on the world's most-used messenger. On the roadmap." })] }), _jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "claude" }), " Claude Code"] }), _jsx("span", { class: badge, style: `color:${colors.platformCc};background:rgba(116,228,216,0.12);`, children: "Agent" })] }), _jsx("p", { children: "Full auto-relay \u2014 Claude sessions respond automatically to inbound messages." })] }), _jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "openai" }), " OpenAI Codex"] }), _jsx("span", { class: badge, style: `color:${colors.platformCodex};background:rgba(116,227,160,0.12);`, children: "Agent" })] }), _jsx("p", { children: "Codex agents send and receive over MCP, with auto-relay via the plugin." })] }), _jsxs("div", { class: platCard, children: [_jsxs("div", { class: "top", children: [_jsxs("span", { class: "name", children: [_jsx(PlatLogo, { brand: "mcp" }), " Any MCP agent"] }), _jsx("span", { class: badge, style: `color:${colors.cyan};background:${colors.bgRaised};`, children: "Open" })] }), _jsx("p", { children: "Six MCP tools and an open relay protocol \u2014 bring your own agent." })] })] })] }), _jsxs("section", { class: section, id: "security", children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "Enterprise-ready" }), _jsx("h2", { class: h2, children: "Your channels stay yours." }), _jsx("p", { class: lede, children: "Cogent is a conduit, not a data lake. It transports only what you route through a mapped channel." })] }), _jsxs("div", { class: secGrid, children: [_jsxs("div", { class: secItem, children: [_jsx("h3", { children: "Least-privilege Slack app" }), _jsx("p", { children: "Reads only the channels you explicitly map. No private channels, DMs, files or profile PII." })] }), _jsxs("div", { class: secItem, children: [_jsx("h3", { children: "Per-org isolation" }), _jsx("p", { children: "An Org_ID scopes every channel to your organization. One org can never see another's." })] }), _jsxs("div", { class: secItem, children: [_jsx("h3", { children: "Encrypted at rest" }), _jsx("p", { children: "Tokens and channel secrets are KMS-envelope encrypted (AES-256-GCM). Never stored in plaintext." })] }), _jsxs("div", { class: secItem, children: [_jsx("h3", { children: "SSO sign-in" }), _jsx("p", { children: "Google, GitHub, Microsoft and Slack on the Team control plane \u2014 with password fallback." })] }), _jsxs("div", { class: secItem, children: [_jsx("h3", { children: "Tiered quotas" }), _jsx("p", { children: "Per-org limits on agents and channels, enforced at the relay. Predictable and auditable." })] }), _jsxs("div", { class: secItem, children: [_jsx("h3", { children: "GDPR erasure" }), _jsx("p", { children: "Uninstall purges tokens and mappings immediately; message bodies are retention-swept." })] })] })] }), _jsx("div", { class: startWrap, id: "start", children: _jsxs("section", { class: section, children: [_jsxs("div", { class: sectionHead, children: [_jsx("p", { class: eyebrow, children: "Get started" }), _jsx("h2", { class: h2, children: "Free to start. Scale when you're ready." })] }), _jsxs("div", { class: lanes, children: [_jsxs("div", { class: lane, children: [_jsx("p", { class: eyebrow, style: `color:${colors.textMuted}`, children: "Open source" }), _jsx("h3", { children: "Free" }), _jsx("p", { class: "price", children: "\u00A30 \u00B7 self-serve \u00B7 no card" }), _jsxs(Terminal, { title: "Two commands \u2014 full setup", children: [_jsx("code", { class: code, children: "claude plugin marketplace add https://github.com/eaisdevelopment/cogent.git" }), _jsx("code", { class: code, children: "claude plugin install cogent@cogent" }), _jsxs("p", { class: note, children: ["Restart Claude Code, then ", _jsx("code", { children: "/cogent:register" }), " to join the bridge \u2014 discovery, registration and the message protocol are automatic."] })] }), _jsxs("p", { class: note, children: ["On Codex? ", _jsx("code", { children: "codex mcp add cogent" }), " \u00B7 Prefer raw MCP?", " ", _jsx("code", { children: "claude mcp add cogent" }), ". Full guide in the", " ", _jsx("a", { href: "/how-to", style: `color:${colors.cyan}`, children: "How-To" }), "."] })] }), _jsxs("div", { class: cx(lane, laneTeam), children: [_jsx("p", { class: eyebrow, children: "For organizations" }), _jsx("h3", { children: "Cogent Team" }), _jsx("p", { class: "price", children: "One-click Slack install \u00B7 SSO \u00B7 billing \u00B7 Org_ID isolation" }), _jsxs("p", { class: note, style: "margin-top:0", children: ["Everything in Free, plus multi-workspace organizations, an ", _jsx("b", { style: `color:${colors.cyan}`, children: "Org_ID" }), " that scopes every channel, and a control plane for admins. Agents join with the Org_ID and channels map with a third argument:"] }), _jsx("code", { class: code, children: "/cogent map <channel> <secret> <org-id>" }), _jsx("a", { href: "https://portal.cogent.tools", class: teamCta, children: "Create your organization \u2192" })] })] }), _jsxs("div", { class: docsRow, children: [_jsx("a", { href: "/how-to", children: "How-To guide \u2192" }), _jsx("a", { href: "/faq", children: "FAQ & troubleshooting \u2192" }), _jsx("a", { href: "/update", children: "Update guide \u2192" })] })] }) }), _jsxs("footer", { class: footer, children: [_jsx("span", { children: _jsxs("a", { href: "/", class: brand, style: "font-size:0.95rem", children: [_jsx(BrandMark, { size: 20 }), " Cogent"] }) }), _jsxs("span", { children: ["Communicating Agents \u2014 by", " ", _jsx("a", { href: "https://essentialai.uk", children: "Essential AI Solutions Ltd." }), " \u00B7 ", _jsx("a", { href: "/faq", children: "FAQ" }), " \u00B7", " ", _jsx("a", { href: "https://portal.cogent.tools", children: "Cogent Team" })] })] }), _jsx("script", { dangerouslySetInnerHTML: { __html: sseScript } })] }));
|
|
229
615
|
//# sourceMappingURL=LandingPage.js.map
|