Compare commits
18 Commits
v0.4.7
...
fix/openap
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
eafe4d0cd8 | ||
|
|
50382e9186 | ||
|
|
00be5fb058 | ||
|
|
fc65f53e0c | ||
|
|
64aace6e3b | ||
|
|
1651faae14 | ||
|
|
b472c5ce93 | ||
|
|
af6490896a | ||
|
|
c0a3c37d95 | ||
|
|
c30da618ec | ||
|
|
735db21227 | ||
|
|
e8d52de5e4 | ||
|
|
a93a8c5f43 | ||
|
|
8ffadd0181 | ||
|
|
5909b3ea87 | ||
|
|
81e9fe777c | ||
|
|
690c1394b1 | ||
|
|
0afaa5c159 |
@@ -29,6 +29,7 @@ S3_SECRET_ACCESS_KEY=
|
||||
S3_FORCE_PATH_STYLE=
|
||||
NEXT_PUBLIC_STORAGE_URL=
|
||||
NEXT_PUBLIC_AVATAR_BUCKET_NAME=
|
||||
NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME=
|
||||
NEXT_PUBLIC_STORAGE_DOMAIN=
|
||||
|
||||
# Auth config (optional)
|
||||
|
||||
@@ -170,6 +170,7 @@ pnpm dev
|
||||
| `NEXT_PUBLIC_STORAGE_URL` | Storage service URL | For file uploads | `https://storage.kanbn.com` |
|
||||
| `NEXT_PUBLIC_STORAGE_DOMAIN` | Storage domain name | For file uploads | `kanbn.com` |
|
||||
| `NEXT_PUBLIC_AVATAR_BUCKET_NAME` | S3 bucket name for avatars | For file uploads | `avatars` |
|
||||
| `NEXT_PUBLIC_ATTATCHMENTS_BUCKET_NAME` | S3 bucket name for attatchments | For file uploads | `attatchments` |
|
||||
| `NEXT_PUBLIC_ALLOW_CREDENTIALS` | Allow email & password login | For authentication | `true` |
|
||||
| `NEXT_PUBLIC_DISABLE_SIGN_UP` | Disable sign up | For authentication | `false` |
|
||||
| `NEXT_PUBLIC_WHITE_LABEL_HIDE_POWERED_BY` | Hide “Powered by kan.bn” on public boards (self-host) | For white labelling | `true` |
|
||||
|
||||
@@ -11,6 +11,7 @@ checksums:
|
||||
"%2410%2Fmonth/singular": cab5e752ed83096e34fca780d90e1fb9
|
||||
"%248%2Fmonth/singular": 4667034934bb2bc3d569c70b94205b51
|
||||
1%20user/singular: 3b547431ab12f0fba84307e6a81109d8
|
||||
14%20day%20free%20trial/singular: b2f7a80b5184d79ddd56b78d57d28225
|
||||
A%20powerful%2C%20flexible%20kanban%20app%20that%20helps%20you%20organise%20work%2C%20track%20progress%2C%20and%20deliver%20results%E2%80%94all%20in%20one%20place./singular: d405b83b0d631cb72f4347c10bcbb643
|
||||
Account/singular: 01215c12fb1cdb93bd0c84c1382bef56
|
||||
Account%20deleted/singular: a25da96a1579c4491be0a95669ef18a4
|
||||
@@ -59,6 +60,7 @@ checksums:
|
||||
Are%20you%20sure%20you%20want%20to%20delete%20your%20account%3F/singular: 428b74d781063224c3e63980e1094ec3
|
||||
assigned%20%3C0%3E%7B0%7D%3C%2F0%3E%20to%20the%20card/singular: 9df6d89fa83706123dedd8cba2243d04
|
||||
Assignees/singular: 96fc0e28a783d80decfd4716a440ac08
|
||||
Attachment%20uploaded/singular: c0233f8c2560f95ac0834f35eb07b9e7
|
||||
Awaiting%20Customer/singular: 122c108794f321c10e05a08f09b11457
|
||||
Backlog/singular: 35919fd5b10ad212839a75e72829fe4e
|
||||
Basic%20Kanban/singular: e46ebc406749486f3907436970d4d6c7
|
||||
@@ -89,6 +91,7 @@ checksums:
|
||||
Card%20title/singular: 7c34f59f4005e6cb3a6ff546ea0b96e3
|
||||
Change%20Password/singular: a552fc5c4189ebc3e2e6018edda7d18f
|
||||
Change%20your%20language%20preferences./singular: 293d49fc3c75e9c425b64bd7126e6b46
|
||||
Check%20out%20some%20of%20our%20favorite%20open%20source%20projects./singular: b0d0be4f63c16552b3aa795af29240d1
|
||||
Check%20your%20inbox/singular: e9a430fcd298def74212238df0f680d6
|
||||
Checklist%20name/singular: 5eb5de823f7ca5a4d97bb41e6a3f675a
|
||||
Checklists/singular: 6f79129c8f08ee54d858a2af57d16dd9
|
||||
@@ -169,6 +172,7 @@ checksums:
|
||||
Documentation/singular: 1563fcb5ddb5037b0709ccd3dd384a92
|
||||
Don't%20have%20an%20account%3F%20%3C0%3E%3C1%3ESign%20up%3C%2F1%3E%3C%2F0%3E/singular: 6ae8282ab8b4a01b4ce87b119e13714b
|
||||
Done/singular: ffd408fa29d5bc9039ef8ea1b9b699bb
|
||||
Download%20failed/singular: 142b391cca3e05f2af9617092f7358c5
|
||||
Edit%20board%20URL/singular: d8276dfc0189f371ec7d80a2047c07aa
|
||||
Edit%20comment/singular: 7e4b46525fcb6b47b71798e31c46e374
|
||||
Edit%20label/singular: 0309e0be1512b1e0b0ceb87c69a53d03
|
||||
@@ -207,6 +211,7 @@ checksums:
|
||||
Failed%20to%20copy%20invite%20link/singular: 635884d5ed8d6ee20b85a003939b4ae7
|
||||
Failed%20to%20create%20board/singular: a746e2afe881c3bf0a8e82a931ca3495
|
||||
Failed%20to%20login%20with%20%7B0%7D.%20Please%20try%20again./singular: 669a4b4247a73f53fb9b8b16e42d166f
|
||||
Failed%20to%20upload%20attachment.%20Please%20try%20again./singular: f8a50d1c8491404f73d3cf701e11f297
|
||||
FAQ/singular: 47e0ee2eb40b4e7e732e05e2233fc71c
|
||||
FAQs/singular: dc36d7992372ccd419b39ef51cf5b16c
|
||||
Fast%20%26%20lightweight/singular: 4f2a80c555a5427b94eef5124aa10775
|
||||
@@ -217,8 +222,8 @@ checksums:
|
||||
Feedback/singular: 6fac88806e0c269a30777b283988c61c
|
||||
Feedback%20sent/singular: 38a490c7ad5f1aa6013dfa879d2c7818
|
||||
Filter/singular: 626325a05e4c8800f7ede7012b0cadaf
|
||||
Find%20answers%20to%20common%20questions%20about%20the%20project.%20Can't%20find%20what%20you're%20looking%20for%3F%20Feel%20free%20to%20%3C0%3Econtact%20us%3C%2F0%3E./singular: 4d99230dad703bf2d71ba670c2f79d3d
|
||||
For%20long-term%20sustainability%2C%20we%20recognise%20all%20good%20open%20source%20projects%20need%20a%20source%20of%20revenue.%20Ours%20comes%20from%20the%20paid%20cloud%20offering%20for%20workspaces%20with%20multiple%20users%20(free%20during%20the%20beta)%20and%20for%20custom%20workspace%20slugs.%20There's%20no%20obligation%20to%20use%20it%2C%20and%20you%20can%20self-host%20the%20software%20on%20your%20own%20infrastructure%20free%20of%20charge./singular: 4eedacd4311ff69bf0fd87083c90a268
|
||||
Find%20answers%20to%20common%20questions%20about%20Kan.%20Can't%20find%20what%20you're%20looking%20for%3F%20Feel%20free%20to%20%3C0%3Econtact%20us%3C%2F0%3E./singular: b4c05c9174637f4da2a41ead0d65bc01
|
||||
For%20long-term%20sustainability%2C%20we%20recognise%20all%20good%20open%20source%20projects%20need%20a%20source%20of%20revenue.%20Ours%20comes%20from%20the%20paid%20cloud%20offering%20for%20workspaces%20with%20multiple%20users%20and%20for%20custom%20workspace%20slugs.%20There's%20no%20obligation%20to%20use%20it%2C%20and%20you%20can%20self-host%20the%20software%20on%20your%20own%20infrastructure%20free%20of%20charge./singular: 9fa1c942feb40d6350322b71561df789
|
||||
Free/singular: 0326365539c004f6088656f692602078
|
||||
Free%20Plan/singular: c995acccc1e3cba379786892a5b4d4e5
|
||||
Free%2C%20forever/singular: ae4f2f81e88a50b5f250ef8e8e77e74b
|
||||
@@ -285,6 +290,7 @@ checksums:
|
||||
Launch%20offer/singular: 624592ba2ecf647a3fe60d493c1ee71a
|
||||
Launch%20offer%3A%20Get%20unlimited%20members%20with%20Pro/singular: 8c1be80f5b2fcc112922282afbe30287
|
||||
Launch%20offer%3A%20unlimited%20seats%20for%20just%20%2429%2Fmonth%20with%20Pro/singular: 235d1cda21811c296afdc0dcc438cc24
|
||||
Learn%20more/singular: e598091d132f890c37a6d4ed94f6d794
|
||||
Learning/singular: 90e91da3f870f065f2da9aa9adf53514
|
||||
Legal/singular: 00d3f08da61a21887009819cf93fb414
|
||||
License/singular: ac2bcac75151e2fcd9eb768cea275a77
|
||||
@@ -292,9 +298,11 @@ checksums:
|
||||
Link%20copied/singular: 4a4805700b31ec65bcb3ca962bccfd1b
|
||||
List/singular: 94f13e7ef909a4de9db7abaa1f9f0b61
|
||||
List%20name/singular: e925e2e6ccaf0eb4064a888aaea8d3c2
|
||||
Lists/singular: 9f4a73afc8de321175d71935134ef066
|
||||
Login%20%7C%20kan.bn/singular: 42a6c8dcd73e0d46e652646dc86871eb
|
||||
Logout/singular: 07948fdf20705e04a7bf68ab197512bf
|
||||
Long-term/singular: 51cb6f0b112250c5a091ca5f0866904b
|
||||
Loved%20by%20teams%20worldwide/singular: 41de5089fef56bb0bfcf7f8649a0cb93
|
||||
Low%20Priority/singular: 509b5cb7c1e8a185e0aa6d38c64c90e8
|
||||
magic%20link/singular: db9d17a5bd98bba8aa0d8068c68579f3
|
||||
Make%20template/singular: 7a1c63b75cea690b3fda6c3f203e31ff
|
||||
@@ -325,8 +333,10 @@ checksums:
|
||||
Newsletter/singular: dcfb9666301924431ac8ae88e5b6f9d7
|
||||
Next%20Steps/singular: 12392fe73ae60b6e5a9d851256b8477e
|
||||
No%20%7B0%7D/singular: a7a95e1dfdb4396da9e2be0e27f42323
|
||||
No%20authentication%20methods%20are%20currently%20available/singular: f718c896810da3612202887f9a4374fa
|
||||
No%20boards%20found/singular: e044088d2c51b6bdf660fafa86ee1e17
|
||||
No%20credit%20card%20required/singular: 2090aa4171dc0b60735069f89b592883
|
||||
No%20download%20URL%20available%20for%20this%20attachment./singular: e367d39420b2242f9d2fd749c87f446a
|
||||
No%20lists/singular: cedf633d99c77ff4356e089f2d98c0a6
|
||||
No%20results%20found%20for%20%22%7BdebouncedQuery%7D%22./singular: 5db6294712528cd897b15ae36f4fd834
|
||||
Offer/singular: 82b4e0c9a3f5b4bd93590847de7c32a1
|
||||
@@ -334,8 +344,10 @@ checksums:
|
||||
Once%20you%20delete%20your%20account%2C%20there%20is%20no%20going%20back.%20This%20action%20cannot%20be%20undone./singular: 9cf7aa6ef30890e5124e266c081bae1c
|
||||
Once%20you%20delete%20your%20workspace%2C%20there%20is%20no%20going%20back.%20This%20action%20cannot%20be%20undone./singular: c9ce6a516ed1f361653e8f8db3dd5ffd
|
||||
Open%20source/singular: 81a747dc664de1a3389b495c8f84843b
|
||||
Open%20Source%20Friends/singular: ffe3d75e5d03b8469c9dcb019dceb164
|
||||
or/singular: 7b133c38bec0d5ee23cc6bcf9a8de50b
|
||||
Organize%20and%20find%20cards%20quickly%20with%20powerful%20filtering%20tools./singular: 1b9898c4b21e9dff413b4f76dc59db56
|
||||
OSS%20Friends/singular: 706e10666dfe26130c17fedb5366a25d
|
||||
Own%20your%20data/singular: cc2178dac4bdf6b07f030cfc2a7510e6
|
||||
Owned%20by%20Atlassian/singular: ace4ed076a5318ad48c296fa09afed69
|
||||
Part-time/singular: 213d63da450f35dabb3ab0e35e29feed
|
||||
@@ -394,6 +406,7 @@ checksums:
|
||||
Save%20time%20with%20reusable%20board%20templates./singular: d0f2d7d0fd682ceaf4ca12c6353fd75a
|
||||
Screening/singular: 0327bfb25db87bdacf00d4dc297f8b26
|
||||
Search%20boards%20and%20cards.../singular: 137017b2b3e885c4894ca8c899af5bc2
|
||||
See%20what%20our%20users%20are%20saying%20about%20Kan/singular: e3bf6f95419169f460fb6918a0afc512
|
||||
Select%20all/singular: eedc7cdb02de467c15dc418a066a77f2
|
||||
Select%20source/singular: c7b0ec447415ff62856803a4d7838bd6
|
||||
Self%20Host/singular: 43fbce2027548b712002e489a20a621a
|
||||
@@ -420,6 +433,7 @@ checksums:
|
||||
Social%20Media/singular: 2227508afb0d38a027e323207e47d4a2
|
||||
Software%20Development/singular: 67659097ef6bcb194839858b2c4f3a3c
|
||||
Star%20on%20Github/singular: e5cb0428f1ac6485688f120d78742875
|
||||
Start%2014%20day%20free%20trial/singular: 4be2811a8f3455618032ccb59e40658b
|
||||
Subscription%20Required/singular: 05f2b4abfc36def17756a6969983cf86
|
||||
Success/singular: c43827becada6750f7a25890905f38b9
|
||||
Supercharge%20your%20workspace%20for%20just%20%2429%2Fmonth.%20Here's%20what%20you'll%20get%3A/singular: 21af8119141afcce5f12da489f34db6a
|
||||
@@ -435,6 +449,7 @@ checksums:
|
||||
Template%20name%20is%20required/singular: 34d674d59c414c2051ef5bc0a62e3c00
|
||||
Templates/singular: 8ed62f56c81fa96c0f3182acb331bf63
|
||||
Terms%20of%20service/singular: 0b8a8b23aff021a6cde79613fdb39c28
|
||||
Testimonials/singular: e958aa3d3743031e2cbfbfd8f1e381f6
|
||||
Thank%20you%20for%20your%20feedback!/singular: 07edd8c50685a52c0969d711df26d768
|
||||
The%20current%20password%20you%20entered%20is%20incorrect./singular: 67a76bf346ab4b48563269e9d941a64a
|
||||
The%20main%20difference%20between%20Kan%20and%20Trello%20is%20that%20Kan%20is%20open%20source%2C%20allowing%20anyone%20to%20view%2C%20modify%2C%20and%20contribute%20to%20our%20code.%20Our%20cloud%20offering%20also%20offers%20no%20restrictions%20on%20features%20for%20individual%20use%2C%20whereas%20Trello%20locks%20basic%20features%20such%20as%20the%20number%20of%20boards%20you%20can%20create%20behind%20a%20paywall./singular: db6e22cc955c5fbe547feedeb48f8719
|
||||
@@ -467,6 +482,7 @@ checksums:
|
||||
Unable%20to%20create%20list/singular: 7fbbf8314f8d08a4123c7daef09fed05
|
||||
Unable%20to%20create%20template/singular: 7495f1434c9188849bffd015811d5337
|
||||
Unable%20to%20create%20workspace/singular: c1c949477e121d73ed6683eddf9cd874
|
||||
Unable%20to%20delete%20attachment/singular: 99d0b17b78d44e15f13d876d155f0efc
|
||||
Unable%20to%20delete%20card/singular: 50ff06aa1265fe464f776aba33f1bef9
|
||||
Unable%20to%20delete%20checklist/singular: d7067e2c009f4919f0cca77df3c228ee
|
||||
Unable%20to%20delete%20checklist%20item/singular: a74144593b625e4d8d7ecf734462c60d
|
||||
@@ -498,10 +514,9 @@ checksums:
|
||||
updated%20the%20description/singular: 70fd604b6dc957a75be90ea77572d76d
|
||||
updated%20the%20title/singular: 98cf8f12923ec1a58e767e3a40863b21
|
||||
updated%20the%20title%20to%20%3C0%3E%7B0%7D%3C%2F0%3E/singular: aca196d729401d8adc5c8ca9d558840e
|
||||
Upgrade/singular: 63c3b52882e0d779859307d672c178c2
|
||||
Upgrade%20to%20Pro/singular: 972773025e763ddf53273df6d37a729a
|
||||
Upgrade%20to%20Pro%20(%2429%2Fmonth)/singular: 9a91ea70f5eb55aac96640bf0fd7feff
|
||||
Upgrade%20to%20Team%20Plan/singular: 40e2ef151266937f8bbe63b3d361f645
|
||||
Upload%20failed/singular: 5b7b755f05330164dbfb00096c500ee3
|
||||
Urgent/singular: e79afcd4398e52e10e7e8243a7eecabe
|
||||
URL%20can%20only%20contain%20letters%2C%20numbers%2C%20and%20hyphens/singular: 875d37d2d920f98ef60a314eda8a5d9a
|
||||
URL%20cannot%20exceed%2024%20characters/singular: 395c25732b84ac1f5b63ee310da08e93
|
||||
@@ -522,7 +537,7 @@ checksums:
|
||||
Welcome%20back/singular: 4928884739ba559e6e4b960e80fe1452
|
||||
What%20license%20are%20you%20using%3F/singular: 59d00e1bf28edc21b77fec94875f57ca
|
||||
What's%20the%20difference%20between%20Kan%20and%20Trello%3F/singular: 7a02f507dd6abbfab1fdae0b172d31b7
|
||||
When%20Trello%20launched%20in%202011%2C%20it%20blew%20everyone%20away%20with%20its%20carefully%20designed%20simplicity%2C%20but%20over%20time%20(and%20atlassification)%20it%20lost%20its%20magic%20and%20grew%20into%20something%20closer%20to%20%22Jira%20Lite%22.%20This%20project%20is%20our%20attempt%20to%20recapture%20the%20original%20magic%20of%20Trello's%20simplicity%2C%20in%20open%20source./singular: 60a55e9bd16c3d1beff1a6c7633c5911
|
||||
When%20Trello%20launched%20in%202011%2C%20it%20blew%20everyone%20away%20with%20its%20carefully%20designed%20simplicity%2C%20but%20over%20the%20years%20it%20lost%20its%20magic%20and%20grew%20into%20something%20closer%20to%20%22Jira%20Lite%22.%20This%20project%20is%20our%20attempt%20to%20recapture%20the%20original%20magic%20of%20Trello's%20simplicity%2C%20in%20open%20source./singular: 2c0790e6654e5460453ad2e523bbd377
|
||||
White%20label/singular: 2570386f73a010b07219e7658aaf9d9b
|
||||
Why%20make%20an%20open%20source%20Trello%3F/singular: 090833338ba8c64ef7a75e0f2615b34b
|
||||
Workspace/singular: b63ef0e99ee6f7fef6cbe4971ca6cf0f
|
||||
@@ -534,7 +549,7 @@ checksums:
|
||||
Workspace%20description%20updated/singular: 19ddb6ee9ead26982a90dee426f3ee1f
|
||||
Workspace%20members/singular: 1857292f9567c556c781a23bd7e10544
|
||||
Workspace%20name/singular: 855614bbf862fd6a9f6a3e76943f92d4
|
||||
Workspace%20name%20cannot%20exceed%2024%20characters/singular: c8b8f79fb83abf8329cc34c1f51fcfc9
|
||||
Workspace%20name%20cannot%20exceed%2064%20characters/singular: 681f86c9ca31699fc5a3ca3790e5972c
|
||||
Workspace%20name%20is%20required/singular: b8c5162dd08c4d941bc57f9d0cbee451
|
||||
Workspace%20name%20must%20be%20at%20least%203%20characters%20long/singular: e448ea97418d44b18b4c21c22b8ba779
|
||||
Workspace%20name%20updated/singular: 3206ea410ee1ea4182b27ac0d89f92a1
|
||||
@@ -556,6 +571,7 @@ checksums:
|
||||
Your%20account%20has%20been%20deleted./singular: 8c8d944e07388c5877effdb2c2803dcf
|
||||
Your%20boards%20have%20been%20imported./singular: 403972e7a25afc2415762c1c2b1ec868
|
||||
Your%20display%20name%20has%20been%20updated./singular: 15e5fff36c554c16ec5214427fae1bf4
|
||||
Your%20file%20has%20been%20uploaded%20successfully./singular: 19d84e934877efc0fef285ff3d6e7849
|
||||
Your%20password%20has%20been%20changed./singular: 8f730f68d52b7efa727aa0784282ebcb
|
||||
Your%20profile%20image%20has%20been%20updated./singular: 099e1780348cd7bf617721344371a430
|
||||
Your%20Trello%20account%20has%20been%20disconnected./singular: 126aeeb73f7e4cad338056e4c933f39b
|
||||
|
||||
@@ -30,23 +30,50 @@ const config = {
|
||||
typescript: { ignoreBuildErrors: true },
|
||||
|
||||
images: {
|
||||
remotePatterns: [
|
||||
{
|
||||
protocol: "https",
|
||||
hostname:
|
||||
env("S3_FORCE_PATH_STYLE") === "true"
|
||||
? `${env("NEXT_PUBLIC_STORAGE_DOMAIN")}`
|
||||
: `*.${env("NEXT_PUBLIC_STORAGE_DOMAIN")}`,
|
||||
},
|
||||
{
|
||||
protocol: "http",
|
||||
hostname: "localhost",
|
||||
},
|
||||
{
|
||||
protocol: "https",
|
||||
hostname: "*.googleusercontent.com",
|
||||
},
|
||||
],
|
||||
remotePatterns: (() => {
|
||||
/** @type {Array<{protocol: "http" | "https", hostname: string}>} */
|
||||
const patterns = [
|
||||
{
|
||||
protocol: "https",
|
||||
hostname:
|
||||
env("S3_FORCE_PATH_STYLE") === "true"
|
||||
? `${env("NEXT_PUBLIC_STORAGE_DOMAIN")}`
|
||||
: `*.${env("NEXT_PUBLIC_STORAGE_DOMAIN")}`,
|
||||
},
|
||||
{
|
||||
protocol: "http",
|
||||
hostname: "localhost",
|
||||
},
|
||||
{
|
||||
protocol: "https",
|
||||
hostname: "*.googleusercontent.com",
|
||||
},
|
||||
];
|
||||
|
||||
// Extract root domain from S3_ENDPOINT and add wildcard pattern
|
||||
const s3Endpoint = env("S3_ENDPOINT");
|
||||
if (s3Endpoint) {
|
||||
try {
|
||||
const url = new URL(s3Endpoint);
|
||||
const hostname = url.hostname;
|
||||
const protocol = url.protocol.replace(":", "");
|
||||
|
||||
// Extract root domain (last 2 parts: e.g. cloudflarestorage.com)
|
||||
const parts = hostname.split(".");
|
||||
if (parts.length >= 2) {
|
||||
const rootDomain = parts.slice(-2).join(".");
|
||||
patterns.push({
|
||||
protocol: protocol === "http" ? "http" : "https",
|
||||
hostname: `*.${rootDomain}`,
|
||||
});
|
||||
}
|
||||
} catch {
|
||||
// If S3_ENDPOINT is not a valid URL, ignore it
|
||||
}
|
||||
}
|
||||
|
||||
return patterns;
|
||||
})(),
|
||||
},
|
||||
webpack(config) {
|
||||
config.module.rules.push({
|
||||
|
||||
@@ -65,6 +65,7 @@
|
||||
"superjson": "2.2.1",
|
||||
"tailwind-merge": "^2.5.2",
|
||||
"tippy.js": "^6.3.7",
|
||||
"tiptap-markdown": "^0.8",
|
||||
"zod": "catalog:"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
BIN
apps/web/public/testimonials/avatars/bobby_computers.jpg
Normal file
|
After Width: | Height: | Size: 28 KiB |
BIN
apps/web/public/testimonials/avatars/bravo68web.jpeg
Normal file
|
After Width: | Height: | Size: 34 KiB |
BIN
apps/web/public/testimonials/avatars/ehb.webp
Normal file
|
After Width: | Height: | Size: 4.0 KiB |
BIN
apps/web/public/testimonials/avatars/fox.png
Normal file
|
After Width: | Height: | Size: 28 KiB |
BIN
apps/web/public/testimonials/avatars/hanno_braun.webp
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
apps/web/public/testimonials/avatars/headless_dev.png
Normal file
|
After Width: | Height: | Size: 53 KiB |
BIN
apps/web/public/testimonials/avatars/jan_stgmnn.jpg
Normal file
|
After Width: | Height: | Size: 18 KiB |
BIN
apps/web/public/testimonials/avatars/jrraphael.png
Normal file
|
After Width: | Height: | Size: 84 KiB |
BIN
apps/web/public/testimonials/avatars/tasneema_waquar.jpeg
Normal file
|
After Width: | Height: | Size: 18 KiB |
@@ -303,6 +303,10 @@ export function Auth({ setIsMagicLinkSent, isSignUp }: AuthProps) {
|
||||
|
||||
const password = watch("password");
|
||||
|
||||
const isMagicLinkAvailable = useMemo(() => {
|
||||
return isCloudEnv || (isEmailSendingEnabled && !isSignUp);
|
||||
}, [isCloudEnv, isEmailSendingEnabled, isSignUp]);
|
||||
|
||||
// Determine if we should operate in magic link mode for current form state (login only)
|
||||
const isMagicLinkMode = useMemo(() => {
|
||||
// Magic link only viable when email sending enabled AND not sign up.
|
||||
@@ -358,7 +362,16 @@ export function Auth({ setIsMagicLinkSent, isSignUp }: AuthProps) {
|
||||
</div>
|
||||
)}
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
{socialProviders?.length !== 0 && (
|
||||
{!isCredentialsEnabled && socialProviders?.length === 0 && (
|
||||
<div className="flex w-full items-center gap-4">
|
||||
<div className="h-[1px] w-1/3 bg-light-600 dark:bg-dark-600" />
|
||||
<span className="text-center text-sm text-light-900 dark:text-dark-900">
|
||||
{t`No authentication methods are currently available`}
|
||||
</span>
|
||||
<div className="h-[1px] w-1/3 bg-light-600 dark:bg-dark-600" />
|
||||
</div>
|
||||
)}
|
||||
{!isCredentialsEnabled && socialProviders?.length !== 0 && (
|
||||
<div className="mb-[1.5rem] flex w-full items-center gap-4">
|
||||
<div className="h-[1px] w-full bg-light-600 dark:bg-dark-600" />
|
||||
<span className="text-sm text-light-900 dark:text-dark-900">
|
||||
@@ -381,46 +394,54 @@ export function Auth({ setIsMagicLinkSent, isSignUp }: AuthProps) {
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div>
|
||||
<Input
|
||||
{...register("email", { required: true })}
|
||||
placeholder={t`Enter your email address`}
|
||||
/>
|
||||
{errors.email && (
|
||||
<p className="mt-2 text-xs text-red-400">
|
||||
{t`Please enter a valid email address`}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
{isCredentialsEnabled && (
|
||||
<div>
|
||||
<Input
|
||||
type="password"
|
||||
{...register("password", { required: true })}
|
||||
placeholder={t`Enter your password`}
|
||||
/>
|
||||
{errors.password && (
|
||||
<p className="mt-2 text-xs text-red-400">
|
||||
{errors.password.message ?? t`Please enter a valid password`}
|
||||
</p>
|
||||
{(isCredentialsEnabled || isMagicLinkAvailable) && (
|
||||
<>
|
||||
<div>
|
||||
<Input
|
||||
{...register("email", { required: true })}
|
||||
placeholder={t`Enter your email address`}
|
||||
/>
|
||||
{errors.email && (
|
||||
<p className="mt-2 text-xs text-red-400">
|
||||
{t`Please enter a valid email address`}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{isCredentialsEnabled && (
|
||||
<div>
|
||||
<Input
|
||||
type="password"
|
||||
{...register("password", { required: true })}
|
||||
placeholder={t`Enter your password`}
|
||||
/>
|
||||
{errors.password && (
|
||||
<p className="mt-2 text-xs text-red-400">
|
||||
{errors.password.message ??
|
||||
t`Please enter a valid password`}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{loginError && (
|
||||
<p className="mt-2 text-xs text-red-400">{loginError}</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="mt-[1.5rem] flex items-center gap-4">
|
||||
<Button
|
||||
isLoading={isLoginWithEmailPending}
|
||||
fullWidth
|
||||
size="lg"
|
||||
variant="secondary"
|
||||
>
|
||||
{isSignUp ? t`Sign up with ` : t`Continue with `}
|
||||
{isMagicLinkMode ? t`magic link` : t`email`}
|
||||
</Button>
|
||||
</div>
|
||||
{(isCredentialsEnabled || isMagicLinkAvailable) && (
|
||||
<div className="mt-[1.5rem] flex items-center gap-4">
|
||||
<Button
|
||||
isLoading={isLoginWithEmailPending}
|
||||
fullWidth
|
||||
size="lg"
|
||||
variant="secondary"
|
||||
>
|
||||
{isSignUp ? t`Sign up with ` : t`Continue with `}
|
||||
{isMagicLinkMode ? t`magic link` : t`email`}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -12,6 +12,7 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
||||
href?: string;
|
||||
fullWidth?: boolean;
|
||||
openInNewTab?: boolean;
|
||||
iconOnly?: boolean;
|
||||
}
|
||||
|
||||
const Button = ({
|
||||
@@ -24,6 +25,7 @@ const Button = ({
|
||||
href,
|
||||
fullWidth,
|
||||
openInNewTab,
|
||||
iconOnly,
|
||||
...props
|
||||
}: ButtonProps) => {
|
||||
const classes = twMerge(
|
||||
@@ -32,6 +34,15 @@ const Button = ({
|
||||
size === "sm" && "text-xs",
|
||||
size === "lg" && "py-[0.65rem]",
|
||||
fullWidth && "w-full",
|
||||
iconOnly && "p-0",
|
||||
iconOnly &&
|
||||
(size === "xs"
|
||||
? "h-6 w-6"
|
||||
: size === "sm"
|
||||
? "h-8 w-8"
|
||||
: size === "lg"
|
||||
? "h-10 w-10"
|
||||
: "h-9 w-9"),
|
||||
variant === "primary" &&
|
||||
"bg-light-1000 dark:bg-dark-1000 dark:text-dark-50",
|
||||
variant === "secondary" &&
|
||||
@@ -47,19 +58,60 @@ const Button = ({
|
||||
<span className="relative flex items-center justify-center">
|
||||
{isLoading && (
|
||||
<span className="absolute">
|
||||
<LoadingSpinner size={size} />
|
||||
<LoadingSpinner size={size === "xs" ? "sm" : size} />
|
||||
</span>
|
||||
)}
|
||||
<div
|
||||
className={twMerge(
|
||||
"flex items-center",
|
||||
isLoading ? "invisible" : "visible",
|
||||
)}
|
||||
>
|
||||
{iconLeft && <span className="mr-2">{iconLeft}</span>}
|
||||
{children}
|
||||
{iconRight && <span className="ml-1">{iconRight}</span>}
|
||||
</div>
|
||||
{iconOnly ? (
|
||||
<div
|
||||
className={twMerge(
|
||||
"flex items-center",
|
||||
isLoading ? "invisible" : "visible",
|
||||
)}
|
||||
>
|
||||
{iconLeft ?? iconRight}
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className={twMerge(
|
||||
fullWidth
|
||||
? "grid w-full grid-cols-[auto_1fr_auto] items-center gap-x-2"
|
||||
: "flex items-center",
|
||||
isLoading ? "invisible" : "visible",
|
||||
)}
|
||||
>
|
||||
{fullWidth && !iconLeft && iconRight && (
|
||||
<span className="col-start-1 opacity-0">{iconRight}</span>
|
||||
)}
|
||||
{iconLeft && (
|
||||
<span
|
||||
className={twMerge(
|
||||
fullWidth ? "col-start-1 justify-self-start" : "mr-2",
|
||||
)}
|
||||
>
|
||||
{iconLeft}
|
||||
</span>
|
||||
)}
|
||||
<span
|
||||
className={twMerge(
|
||||
fullWidth ? "col-start-2 justify-self-center text-center" : "",
|
||||
)}
|
||||
>
|
||||
{children}
|
||||
</span>
|
||||
{iconRight && (
|
||||
<span
|
||||
className={twMerge(
|
||||
fullWidth ? "col-start-3 justify-self-end" : "ml-1",
|
||||
)}
|
||||
>
|
||||
{iconRight}
|
||||
</span>
|
||||
)}
|
||||
{fullWidth && !iconRight && iconLeft && (
|
||||
<span className="col-start-3 opacity-0">{iconLeft}</span>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</span>
|
||||
);
|
||||
|
||||
|
||||
@@ -39,7 +39,7 @@ export default function Dashboard({
|
||||
rightPanel,
|
||||
hasRightPanel = false,
|
||||
}: DashboardProps) {
|
||||
const { theme } = useTheme();
|
||||
const { resolvedTheme } = useTheme();
|
||||
const { openModal } = useModal();
|
||||
const { availableWorkspaces, hasLoaded } = useWorkspace();
|
||||
|
||||
@@ -95,7 +95,7 @@ export default function Dashboard({
|
||||
}
|
||||
}, [hasLoaded, availableWorkspaces.length, openModal]);
|
||||
|
||||
const isDarkMode = theme === "dark";
|
||||
const isDarkMode = resolvedTheme === "dark";
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
@@ -7,6 +7,7 @@ import type { Instance as TippyInstance } from "tippy.js";
|
||||
import { Button } from "@headlessui/react";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import Link from "@tiptap/extension-link";
|
||||
import Mention from "@tiptap/extension-mention";
|
||||
import Placeholder from "@tiptap/extension-placeholder";
|
||||
import {
|
||||
BubbleMenu,
|
||||
@@ -39,9 +40,10 @@ import {
|
||||
} from "react-icons/hi2";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
import tippy from "tippy.js";
|
||||
import Mention from "@tiptap/extension-mention";
|
||||
import Avatar from "./Avatar";
|
||||
import { Markdown } from "tiptap-markdown";
|
||||
|
||||
import { getAvatarUrl } from "~/utils/helpers";
|
||||
import Avatar from "./Avatar";
|
||||
|
||||
declare module "@tiptap/core" {
|
||||
interface Commands<ReturnType> {
|
||||
@@ -77,7 +79,7 @@ export interface RenderSuggestionsProps {
|
||||
command: (item: SlashCommandItem) => void;
|
||||
}
|
||||
|
||||
export type WorkspaceMember = {
|
||||
export interface WorkspaceMember {
|
||||
publicId: string;
|
||||
user: {
|
||||
id: string;
|
||||
@@ -85,7 +87,7 @@ export type WorkspaceMember = {
|
||||
image: string | null;
|
||||
} | null;
|
||||
email: string;
|
||||
};
|
||||
}
|
||||
|
||||
const CommandsList = forwardRef<
|
||||
{ onKeyDown: (props: SuggestionKeyDownProps) => boolean },
|
||||
@@ -200,7 +202,11 @@ const RenderSuggestions = () => {
|
||||
};
|
||||
};
|
||||
|
||||
type MentionItem = { id: string; label: string; image: string | null };
|
||||
interface MentionItem {
|
||||
id: string;
|
||||
label: string;
|
||||
image: string | null;
|
||||
}
|
||||
|
||||
const MentionList = forwardRef<
|
||||
{ onKeyDown: (props: SuggestionKeyDownProps) => boolean },
|
||||
@@ -238,30 +244,32 @@ const MentionList = forwardRef<
|
||||
return (
|
||||
<div className="w-56 rounded-md border-[1px] border-light-200 bg-light-50 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-dark-500 dark:bg-dark-200">
|
||||
<div className="max-h-[350px] overflow-y-auto p-1 scrollbar-thin scrollbar-thumb-light-200 dark:scrollbar-thumb-dark-300">
|
||||
{items.length > 0 ? items.map((item, index) => (
|
||||
<button
|
||||
key={item.id}
|
||||
onClick={() => command(item)}
|
||||
className={twMerge(
|
||||
"group flex w-full items-center rounded-[5px] p-2 hover:bg-light-200 dark:hover:bg-dark-300",
|
||||
index === selectedIndex && "bg-light-200 dark:bg-dark-300",
|
||||
)}
|
||||
>
|
||||
<Avatar
|
||||
size="xs"
|
||||
name={item.label}
|
||||
imageUrl={
|
||||
item.image ? getAvatarUrl(item.image) : undefined
|
||||
}
|
||||
email={item.label}
|
||||
/>
|
||||
<span className="ml-3 text-[12px] font-medium text-dark-900 dark:text-dark-1000">
|
||||
{item.label}
|
||||
</span>
|
||||
</button>
|
||||
)) : (
|
||||
{items.length > 0 ? (
|
||||
items.map((item, index) => (
|
||||
<button
|
||||
key={item.id}
|
||||
onClick={() => command(item)}
|
||||
className={twMerge(
|
||||
"group flex w-full items-center rounded-[5px] p-2 hover:bg-light-200 dark:hover:bg-dark-300",
|
||||
index === selectedIndex && "bg-light-200 dark:bg-dark-300",
|
||||
)}
|
||||
>
|
||||
<Avatar
|
||||
size="xs"
|
||||
name={item.label}
|
||||
imageUrl={item.image ? getAvatarUrl(item.image) : undefined}
|
||||
email={item.label}
|
||||
/>
|
||||
<span className="ml-3 text-[12px] font-medium text-dark-900 dark:text-dark-1000">
|
||||
{item.label}
|
||||
</span>
|
||||
</button>
|
||||
))
|
||||
) : (
|
||||
<div className="flex items-center justify-start p-2">
|
||||
<span className="text-dark-900 text-[12px] dark:text-dark-1000">No results</span>
|
||||
<span className="text-[12px] text-dark-900 dark:text-dark-1000">
|
||||
No results
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
@@ -436,6 +444,7 @@ export default function Editor({
|
||||
{
|
||||
extensions: [
|
||||
StarterKit,
|
||||
Markdown,
|
||||
Placeholder.configure({
|
||||
placeholder: readOnly
|
||||
? ""
|
||||
@@ -462,35 +471,37 @@ export default function Editor({
|
||||
}),
|
||||
Mention.configure({
|
||||
HTMLAttributes: {
|
||||
class: 'mention',
|
||||
class: "mention",
|
||||
},
|
||||
suggestion: {
|
||||
char: "@",
|
||||
items: ({ query }: { query: string }) => {
|
||||
const all: MentionItem[] = workspaceMembers.map((member: WorkspaceMember) => ({
|
||||
id: member.publicId,
|
||||
label: member?.user?.name ?? member.email,
|
||||
image: member?.user?.image ?? null,
|
||||
}));
|
||||
const all: MentionItem[] = workspaceMembers.map(
|
||||
(member: WorkspaceMember) => ({
|
||||
id: member.publicId,
|
||||
label: member?.user?.name ?? member.email,
|
||||
image: member?.user?.image ?? null,
|
||||
}),
|
||||
);
|
||||
const q = query.toLowerCase();
|
||||
return all.filter((u) => u.label.toLowerCase().includes(q));
|
||||
},
|
||||
command: ({ editor, range, props }: any) => {
|
||||
const mentionHTML = `<span data-type="mention" data-id="${props.id}" data-label="${props.label}">@${props.label}</span> `;
|
||||
|
||||
editor
|
||||
.chain()
|
||||
.focus()
|
||||
.deleteRange(range)
|
||||
.insertContent(mentionHTML)
|
||||
.focus()
|
||||
.run();
|
||||
},
|
||||
render: renderMentionSuggestions,
|
||||
},
|
||||
renderText({ options, node }) {
|
||||
return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`;
|
||||
const mentionHTML = `<span data-type="mention" data-id="${props.id}" data-label="${props.label}">@${props.label}</span> `;
|
||||
|
||||
editor
|
||||
.chain()
|
||||
.focus()
|
||||
.deleteRange(range)
|
||||
.insertContent(mentionHTML)
|
||||
.focus()
|
||||
.run();
|
||||
},
|
||||
render: renderMentionSuggestions,
|
||||
},
|
||||
renderText({ options, node }) {
|
||||
return `${options.suggestion.char}${node.attrs.label ?? node.attrs.id}`;
|
||||
},
|
||||
}),
|
||||
],
|
||||
content,
|
||||
|
||||
@@ -24,7 +24,10 @@ import { api } from "~/utils/api";
|
||||
import LoadingSpinner from "./LoadingSpinner";
|
||||
|
||||
const schema = z.object({
|
||||
name: z.string().min(1, { message: t`Workspace name is required` }),
|
||||
name: z
|
||||
.string()
|
||||
.min(1, { message: t`Workspace name is required` })
|
||||
.max(64, { message: t`Workspace name cannot exceed 64 characters` }),
|
||||
slug: z
|
||||
.string()
|
||||
.min(3, {
|
||||
|
||||
@@ -2,14 +2,19 @@ import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
import { Button } from "@headlessui/react";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { env } from "next-runtime-env";
|
||||
import { useTheme } from "next-themes";
|
||||
import { useEffect, useState } from "react";
|
||||
import { HiBolt } from "react-icons/hi2";
|
||||
import {
|
||||
TbLayoutSidebarLeftCollapse,
|
||||
TbLayoutSidebarLeftExpand,
|
||||
} from "react-icons/tb";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
import type { Subscription } from "@kan/shared/utils";
|
||||
import { hasActiveSubscription } from "@kan/shared/utils";
|
||||
|
||||
import boardsIconDark from "~/assets/boards-dark.json";
|
||||
import boardsIconLight from "~/assets/boards-light.json";
|
||||
import membersIconDark from "~/assets/members-dark.json";
|
||||
@@ -18,9 +23,13 @@ import settingsIconDark from "~/assets/settings-dark.json";
|
||||
import settingsIconLight from "~/assets/settings-light.json";
|
||||
import templatesIconDark from "~/assets/templates-dark.json";
|
||||
import templatesIconLight from "~/assets/templates-light.json";
|
||||
import ButtonComponent from "~/components/Button";
|
||||
import ReactiveButton from "~/components/ReactiveButton";
|
||||
import UserMenu from "~/components/UserMenu";
|
||||
import WorkspaceMenu from "~/components/WorkspaceMenu";
|
||||
import { useModal } from "~/providers/modal";
|
||||
import { useWorkspace } from "~/providers/workspace";
|
||||
import { api } from "~/utils/api";
|
||||
|
||||
interface SideNavigationProps {
|
||||
user: UserType;
|
||||
@@ -39,13 +48,23 @@ export default function SideNavigation({
|
||||
onCloseSideNav,
|
||||
}: SideNavigationProps) {
|
||||
const router = useRouter();
|
||||
const { workspace } = useWorkspace();
|
||||
const [isCollapsed, setIsCollapsed] = useState(false);
|
||||
const [isInitialised, setIsInitialised] = useState(false);
|
||||
const { openModal } = useModal();
|
||||
|
||||
const { data: workspaceData } = api.workspace.byId.useQuery({
|
||||
workspacePublicId: workspace.publicId,
|
||||
});
|
||||
|
||||
const subscriptions = workspaceData?.subscriptions as
|
||||
| Subscription[]
|
||||
| undefined;
|
||||
|
||||
useEffect(() => {
|
||||
const savedState = localStorage.getItem("kan_sidebar-collapsed");
|
||||
if (savedState !== null) {
|
||||
setIsCollapsed(JSON.parse(savedState));
|
||||
setIsCollapsed(Boolean(JSON.parse(savedState)));
|
||||
}
|
||||
setIsInitialised(true);
|
||||
}, []);
|
||||
@@ -61,7 +80,9 @@ export default function SideNavigation({
|
||||
|
||||
const { pathname } = router;
|
||||
|
||||
const { theme, resolvedTheme } = useTheme();
|
||||
const { resolvedTheme } = useTheme();
|
||||
|
||||
const isCloudEnv = env("NEXT_PUBLIC_KAN_ENV") === "cloud";
|
||||
|
||||
const isDarkMode = resolvedTheme === "dark";
|
||||
|
||||
@@ -101,10 +122,10 @@ export default function SideNavigation({
|
||||
)}
|
||||
>
|
||||
<div>
|
||||
<div className="hidden h-14 items-center justify-between pb-[18px] pt-1.5 md:flex">
|
||||
<div className="hidden h-[45px] items-center justify-between pb-3 md:flex">
|
||||
{!isCollapsed && (
|
||||
<Link href="/" className="block">
|
||||
<h1 className="pl-2 text-lg font-bold tracking-tight text-neutral-900 dark:text-dark-1000">
|
||||
<h1 className="pl-2 text-[16px] font-bold tracking-tight text-neutral-900 dark:text-dark-1000">
|
||||
kan.bn
|
||||
</h1>
|
||||
</Link>
|
||||
@@ -148,7 +169,7 @@ export default function SideNavigation({
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div className="space-y-3">
|
||||
<div className="space-y-2">
|
||||
<UserMenu
|
||||
email={user.email ?? ""}
|
||||
imageUrl={user.image ?? undefined}
|
||||
@@ -156,6 +177,33 @@ export default function SideNavigation({
|
||||
isCollapsed={isCollapsed}
|
||||
onCloseSideNav={onCloseSideNav}
|
||||
/>
|
||||
{isCloudEnv &&
|
||||
!hasActiveSubscription(subscriptions, "pro") &&
|
||||
!hasActiveSubscription(subscriptions, "team") && (
|
||||
<div className={twMerge(isCollapsed && "flex justify-center")}>
|
||||
{isCollapsed ? (
|
||||
<ButtonComponent
|
||||
iconLeft={<HiBolt />}
|
||||
variant="secondary"
|
||||
href="/settings/workspace?upgrade=pro"
|
||||
aria-label="Upgrade to Pro"
|
||||
title="Upgrade to Pro"
|
||||
iconOnly
|
||||
onClick={() => openModal("UPGRADE_TO_PRO")}
|
||||
/>
|
||||
) : (
|
||||
<ButtonComponent
|
||||
iconLeft={<HiBolt />}
|
||||
fullWidth
|
||||
variant="secondary"
|
||||
href="/settings/workspace?upgrade=pro"
|
||||
onClick={() => openModal("UPGRADE_TO_PRO")}
|
||||
>
|
||||
{t`Upgrade to Pro`}
|
||||
</ButtonComponent>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</nav>
|
||||
</>
|
||||
|
||||
@@ -2,7 +2,7 @@ import { CgDarkMode } from "react-icons/cg";
|
||||
import { useTheme } from "next-themes";
|
||||
|
||||
const ThemeToggle = () => {
|
||||
const { theme, setTheme } = useTheme();
|
||||
const { theme, resolvedTheme, setTheme } = useTheme();
|
||||
|
||||
const toggleTheme = () => {
|
||||
setTheme(theme === "light" ? "dark" : "light");
|
||||
@@ -12,11 +12,11 @@ const ThemeToggle = () => {
|
||||
<button
|
||||
onClick={toggleTheme}
|
||||
className="rounded p-1.5 transition-all hover:bg-light-200 dark:hover:bg-dark-100"
|
||||
aria-label={`Switch to ${theme === "light" ? "dark" : "light"} theme`}
|
||||
aria-label={`Switch to ${resolvedTheme === "light" ? "dark" : "light"} theme`}
|
||||
>
|
||||
<CgDarkMode
|
||||
className={`h-4 w-4 text-light-900 transition-transform duration-200 dark:text-dark-900 ${
|
||||
theme === "dark" ? "rotate-180" : "rotate-0"
|
||||
resolvedTheme === "dark" ? "rotate-180" : "rotate-0"
|
||||
}`}
|
||||
/>
|
||||
</button>
|
||||
|
||||
@@ -3,6 +3,7 @@ import Link from "next/link";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { Menu, Transition } from "@headlessui/react";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { useTheme } from "next-themes";
|
||||
import { Fragment } from "react";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
@@ -10,7 +11,6 @@ import { authClient } from "@kan/auth/client";
|
||||
|
||||
import { useIsMobile } from "~/hooks/useMediaQuery";
|
||||
import { useModal } from "~/providers/modal";
|
||||
import { useTheme } from "next-themes";
|
||||
import { getAvatarUrl } from "~/utils/helpers";
|
||||
|
||||
interface UserMenuProps {
|
||||
|
||||
@@ -48,13 +48,13 @@ export default function WorkspaceMenu({
|
||||
) : (
|
||||
<div
|
||||
className={twMerge(
|
||||
"flex items-center gap-1",
|
||||
isCollapsed && "md:flex-col-reverse md:items-stretch",
|
||||
"flex items-center justify-start gap-1",
|
||||
isCollapsed && "md:flex-col-reverse md:items-center",
|
||||
)}
|
||||
>
|
||||
<Menu.Button
|
||||
className={twMerge(
|
||||
"mb-1 flex h-[34px] flex-1 items-center rounded-md p-1.5 hover:bg-light-200 dark:hover:bg-dark-200",
|
||||
"mb-1 flex h-[34px] min-w-0 flex-1 items-center justify-start rounded-md p-1.5 hover:bg-light-200 dark:hover:bg-dark-200",
|
||||
isCollapsed &&
|
||||
"md:mb-1.5 md:h-9 md:w-9 md:flex-none md:justify-center md:p-0",
|
||||
)}
|
||||
@@ -67,7 +67,7 @@ export default function WorkspaceMenu({
|
||||
</span>
|
||||
<span
|
||||
className={twMerge(
|
||||
"ml-2 truncate text-sm font-bold text-neutral-900 dark:text-dark-1000",
|
||||
"ml-2 min-w-0 flex-1 truncate text-left text-sm font-bold text-neutral-900 dark:text-dark-1000",
|
||||
isCollapsed && "md:hidden",
|
||||
)}
|
||||
>
|
||||
@@ -87,7 +87,7 @@ export default function WorkspaceMenu({
|
||||
<Button
|
||||
className={twMerge(
|
||||
"mb-1 h-[34px] w-[34px] flex-shrink-0 rounded-lg bg-light-200 p-2 hover:bg-light-300 focus:outline-none dark:bg-dark-200 dark:hover:bg-dark-300",
|
||||
isCollapsed && "md:mb-2 md:h-9 md:w-9 md:self-center",
|
||||
isCollapsed && "md:mb-2 md:h-9 md:w-9",
|
||||
)}
|
||||
onClick={() => setIsOpen(true)}
|
||||
>
|
||||
|
||||
@@ -90,6 +90,7 @@ export const env = createEnv({
|
||||
NEXT_PUBLIC_BASE_URL: z.string().url(),
|
||||
NEXT_PUBLIC_STORAGE_URL: z.string().url().optional(),
|
||||
NEXT_PUBLIC_AVATAR_BUCKET_NAME: z.string().optional(),
|
||||
NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME: z.string().optional(),
|
||||
NEXT_PUBLIC_STORAGE_DOMAIN: z.string().optional(),
|
||||
NEXT_PUBLIC_ALLOW_CREDENTIALS: z
|
||||
.string()
|
||||
@@ -125,6 +126,8 @@ export const env = createEnv({
|
||||
NEXT_PUBLIC_BASE_URL: process.env.NEXT_PUBLIC_BASE_URL,
|
||||
NEXT_PUBLIC_STORAGE_URL: process.env.NEXT_PUBLIC_STORAGE_URL,
|
||||
NEXT_PUBLIC_AVATAR_BUCKET_NAME: process.env.NEXT_PUBLIC_AVATAR_BUCKET_NAME,
|
||||
NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME:
|
||||
process.env.NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME,
|
||||
NEXT_PUBLIC_STORAGE_DOMAIN: process.env.NEXT_PUBLIC_STORAGE_DOMAIN,
|
||||
NEXT_PUBLIC_ALLOW_CREDENTIALS: process.env.NEXT_PUBLIC_ALLOW_CREDENTIALS,
|
||||
NEXT_PUBLIC_DISABLE_SIGN_UP: process.env.NEXT_PUBLIC_DISABLE_SIGN_UP,
|
||||
|
||||
48
apps/web/src/pages/api/download/attatchment.ts
Normal file
@@ -0,0 +1,48 @@
|
||||
import type { NextApiRequest, NextApiResponse } from "next";
|
||||
|
||||
export default async function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse,
|
||||
) {
|
||||
if (req.method !== "GET") {
|
||||
return res.status(405).json({ message: "Method not allowed" });
|
||||
}
|
||||
|
||||
const { url, filename } = req.query;
|
||||
|
||||
if (!url || typeof url !== "string") {
|
||||
return res.status(400).json({
|
||||
message: "url parameter is required",
|
||||
});
|
||||
}
|
||||
|
||||
try {
|
||||
const downloadUrl = decodeURIComponent(url);
|
||||
const downloadFilename =
|
||||
(typeof filename === "string" ? decodeURIComponent(filename) : null) ??
|
||||
"attachment";
|
||||
|
||||
const upstream = await fetch(downloadUrl);
|
||||
|
||||
if (!upstream.ok) {
|
||||
return res.status(upstream.status).json({
|
||||
message: "Failed to fetch attachment",
|
||||
});
|
||||
}
|
||||
|
||||
const contentType =
|
||||
upstream.headers.get("Content-Type") ?? "application/octet-stream";
|
||||
|
||||
res.setHeader("Content-Type", contentType);
|
||||
res.setHeader(
|
||||
"Content-Disposition",
|
||||
`attachment; filename="${downloadFilename}"`,
|
||||
);
|
||||
|
||||
const buffer = await upstream.arrayBuffer();
|
||||
return res.send(Buffer.from(buffer));
|
||||
} catch (error) {
|
||||
console.error("Error downloading attachment:", error);
|
||||
return res.status(500).json({ message: "Failed to download attachment" });
|
||||
}
|
||||
}
|
||||
23
apps/web/src/pages/api/oss-friends.ts
Normal file
@@ -0,0 +1,23 @@
|
||||
import type { NextApiRequest, NextApiResponse } from "next";
|
||||
|
||||
export default async function handler(
|
||||
req: NextApiRequest,
|
||||
res: NextApiResponse,
|
||||
) {
|
||||
if (req.method !== "GET") {
|
||||
return res.status(405).json({ message: "Method not allowed" });
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch("https://formbricks.com/api/oss-friends");
|
||||
if (!response.ok) {
|
||||
throw new Error("Failed to fetch from Formbricks");
|
||||
}
|
||||
const data = await response.json();
|
||||
|
||||
return res.status(200).json(data);
|
||||
} catch (error) {
|
||||
console.error("Error fetching OSS friends:", error);
|
||||
return res.status(500).json({ message: "Failed to fetch OSS friends" });
|
||||
}
|
||||
}
|
||||
@@ -94,6 +94,9 @@ export default async function handler(
|
||||
quantity: 1,
|
||||
},
|
||||
],
|
||||
subscription_data: {
|
||||
trial_period_days: 14,
|
||||
},
|
||||
success_url: `${env("NEXT_PUBLIC_BASE_URL")}${successUrl}`,
|
||||
cancel_url: `${env("NEXT_PUBLIC_BASE_URL")}${cancelUrl}`,
|
||||
client_reference_id: workspacePublicId,
|
||||
|
||||
5
apps/web/src/pages/oss-friends/index.tsx
Normal file
@@ -0,0 +1,5 @@
|
||||
import OSSFriendsView from "~/views/oss-friends";
|
||||
|
||||
export default function OSSFriends() {
|
||||
return <OSSFriendsView />;
|
||||
}
|
||||
@@ -59,7 +59,18 @@ export const ModalProvider: React.FC<Props> = ({ children }) => {
|
||||
entityLabel,
|
||||
closeOnClickOutside,
|
||||
};
|
||||
setModalStack((prev) => [...prev, newModal]);
|
||||
setModalStack((prev) => {
|
||||
const last = prev[prev.length - 1];
|
||||
if (
|
||||
last &&
|
||||
last.contentType === newModal.contentType &&
|
||||
last.entityId === newModal.entityId &&
|
||||
last.entityLabel === newModal.entityLabel
|
||||
) {
|
||||
return prev; // prevent stacking duplicate modal on top
|
||||
}
|
||||
return [...prev, newModal];
|
||||
});
|
||||
},
|
||||
[],
|
||||
);
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { HiOutlinePaperClip } from "react-icons/hi";
|
||||
import { HiBars3BottomLeft, HiChatBubbleLeft } from "react-icons/hi2";
|
||||
|
||||
import Avatar from "~/components/Avatar";
|
||||
@@ -13,6 +14,7 @@ const Card = ({
|
||||
checklists,
|
||||
description,
|
||||
comments,
|
||||
attachments,
|
||||
}: {
|
||||
title: string;
|
||||
labels: { name: string; colourCode: string | null }[];
|
||||
@@ -33,6 +35,7 @@ const Card = ({
|
||||
}[];
|
||||
description: string | null;
|
||||
comments: { publicId: string }[];
|
||||
attachments?: { publicId: string }[];
|
||||
}) => {
|
||||
const completedItems = checklists.reduce((acc, checklist) => {
|
||||
return acc + checklist.items.filter((item) => item.completed).length;
|
||||
@@ -47,6 +50,7 @@ const Card = ({
|
||||
|
||||
const hasDescription =
|
||||
description && description.replace(/<[^>]*>/g, "").trim().length > 0;
|
||||
const hasAttachments = attachments && attachments.length > 0;
|
||||
|
||||
return (
|
||||
<div className="flex flex-col rounded-md border border-light-200 bg-light-50 px-3 py-2 text-sm text-neutral-900 dark:border-dark-200 dark:bg-dark-200 dark:text-dark-1000 dark:hover:bg-dark-300">
|
||||
@@ -55,7 +59,8 @@ const Card = ({
|
||||
members.length ||
|
||||
checklists.length > 0 ||
|
||||
hasDescription ||
|
||||
comments.length > 0 ? (
|
||||
comments.length > 0 ||
|
||||
hasAttachments ? (
|
||||
<div className="mt-2 flex flex-col justify-end">
|
||||
<div className="space-x-0.5">
|
||||
{labels.map((label) => (
|
||||
@@ -77,6 +82,11 @@ const Card = ({
|
||||
<HiChatBubbleLeft className="h-4 w-4" />
|
||||
</div>
|
||||
)}
|
||||
{hasAttachments && (
|
||||
<div className="flex items-center gap-1 text-light-700 dark:text-dark-800">
|
||||
<HiOutlinePaperClip className="h-4 w-4" />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center justify-end gap-1">
|
||||
{checklists.length > 0 && (
|
||||
|
||||
@@ -12,6 +12,7 @@ interface QueryParams {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
}
|
||||
|
||||
export function DeleteListConfirmation({
|
||||
|
||||
@@ -2,6 +2,7 @@ import { useRouter } from "next/router";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import {
|
||||
HiMiniXMark,
|
||||
HiOutlineSquare3Stack3D,
|
||||
HiOutlineTag,
|
||||
HiOutlineUserCircle,
|
||||
} from "react-icons/hi2";
|
||||
@@ -32,15 +33,22 @@ interface Label {
|
||||
colourCode: string | null;
|
||||
}
|
||||
|
||||
interface List {
|
||||
publicId: string;
|
||||
name: string;
|
||||
}
|
||||
|
||||
const Filters = ({
|
||||
position = "right",
|
||||
labels,
|
||||
members,
|
||||
lists,
|
||||
isLoading,
|
||||
}: {
|
||||
position?: "left" | "right";
|
||||
labels: Label[];
|
||||
members: Member[];
|
||||
lists: List[];
|
||||
isLoading: boolean;
|
||||
}) => {
|
||||
const router = useRouter();
|
||||
@@ -52,7 +60,7 @@ const Filters = ({
|
||||
try {
|
||||
await router.push({
|
||||
pathname: router.pathname,
|
||||
query: { ...router.query, members: [], labels: [] },
|
||||
query: { ...router.query, members: [], labels: [], lists: [] },
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
@@ -85,6 +93,12 @@ const Filters = ({
|
||||
leftIcon: <LabelIcon colourCode={label.colourCode} />,
|
||||
}));
|
||||
|
||||
const formattedLists = lists.map((list) => ({
|
||||
key: list.publicId,
|
||||
value: list.name,
|
||||
selected: !!router.query.lists?.includes(list.publicId),
|
||||
}));
|
||||
|
||||
const groups = [
|
||||
...(formattedMembers.length
|
||||
? [
|
||||
@@ -102,6 +116,16 @@ const Filters = ({
|
||||
icon: <HiOutlineTag size={16} />,
|
||||
items: formattedLabels,
|
||||
},
|
||||
...(formattedLists.length
|
||||
? [
|
||||
{
|
||||
key: "lists",
|
||||
label: t`Lists`,
|
||||
icon: <HiOutlineSquare3Stack3D size={16} />,
|
||||
items: formattedLists,
|
||||
},
|
||||
]
|
||||
: []),
|
||||
];
|
||||
|
||||
const handleSelect = async (
|
||||
@@ -131,6 +155,7 @@ const Filters = ({
|
||||
const numOfFilters = [
|
||||
...formatToArray(router.query.members),
|
||||
...formatToArray(router.query.labels),
|
||||
...formatToArray(router.query.lists),
|
||||
].length;
|
||||
|
||||
return (
|
||||
|
||||
@@ -33,6 +33,7 @@ interface QueryParams {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
}
|
||||
|
||||
interface NewCardFormProps {
|
||||
|
||||
@@ -21,6 +21,7 @@ interface QueryParams {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
}
|
||||
|
||||
export function NewListForm({
|
||||
|
||||
@@ -17,6 +17,7 @@ interface QueryParams {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
}
|
||||
|
||||
export function UpdateBoardSlugForm({
|
||||
|
||||
@@ -11,6 +11,7 @@ interface QueryParams {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
}
|
||||
|
||||
const VisibilityButton = ({
|
||||
|
||||
@@ -80,11 +80,13 @@ export default function BoardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
boardPublicId: string;
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
type: "regular" | "template";
|
||||
} = {
|
||||
boardPublicId: boardId ?? "",
|
||||
members: formatToArray(router.query.members),
|
||||
labels: formatToArray(router.query.labels),
|
||||
lists: formatToArray(router.query.lists),
|
||||
type: isTemplate ? "template" : "regular",
|
||||
};
|
||||
|
||||
@@ -418,6 +420,7 @@ export default function BoardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
members={boardData.workspace.members.filter(
|
||||
(member) => member.user !== null,
|
||||
)}
|
||||
lists={boardData.allLists}
|
||||
position="left"
|
||||
isLoading={!boardData}
|
||||
/>
|
||||
@@ -550,6 +553,7 @@ export default function BoardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
card.description ?? null
|
||||
}
|
||||
comments={card.comments ?? []}
|
||||
attachments={card.attachments}
|
||||
/>
|
||||
</Link>
|
||||
)}
|
||||
|
||||
462
apps/web/src/views/card/components/AttachmentThumbnails.tsx
Normal file
@@ -0,0 +1,462 @@
|
||||
import Image from "next/image";
|
||||
import { Dialog, Transition } from "@headlessui/react";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { Fragment, useEffect, useState } from "react";
|
||||
import {
|
||||
HiArrowDownTray,
|
||||
HiChevronLeft,
|
||||
HiChevronRight,
|
||||
HiDocumentText,
|
||||
HiOutlineTrash,
|
||||
HiXMark,
|
||||
} from "react-icons/hi2";
|
||||
|
||||
import { usePopup } from "~/providers/popup";
|
||||
import { api } from "~/utils/api";
|
||||
|
||||
interface Attachment {
|
||||
publicId: string;
|
||||
contentType: string;
|
||||
url: string | null;
|
||||
originalFilename: string | null;
|
||||
s3Key: string;
|
||||
size?: number | null;
|
||||
}
|
||||
|
||||
export function AttachmentThumbnails({
|
||||
attachments,
|
||||
cardPublicId,
|
||||
isReadOnly = false,
|
||||
}: {
|
||||
attachments?: Attachment[];
|
||||
cardPublicId: string;
|
||||
isReadOnly?: boolean;
|
||||
}) {
|
||||
const { showPopup } = usePopup();
|
||||
const utils = api.useUtils();
|
||||
const imageAttachments =
|
||||
attachments?.filter(
|
||||
(attachment) =>
|
||||
attachment.contentType.startsWith("image/") && attachment.url,
|
||||
) ?? [];
|
||||
|
||||
const nonImageAttachments =
|
||||
attachments?.filter(
|
||||
(attachment) =>
|
||||
!attachment.contentType.startsWith("image/") && attachment.url,
|
||||
) ?? [];
|
||||
|
||||
const [selectedIndex, setSelectedIndex] = useState<number | null>(null);
|
||||
|
||||
const deleteAttachment = api.attachment.delete.useMutation({
|
||||
onMutate: async (args) => {
|
||||
if (isReadOnly) return;
|
||||
|
||||
await utils.card.byId.cancel({ cardPublicId });
|
||||
const currentState = utils.card.byId.getData({ cardPublicId });
|
||||
|
||||
utils.card.byId.setData({ cardPublicId }, (oldCard) => {
|
||||
if (!oldCard) return oldCard;
|
||||
const updatedAttachments = oldCard.attachments.filter(
|
||||
(attachment) => attachment.publicId !== args.attachmentPublicId,
|
||||
);
|
||||
return { ...oldCard, attachments: updatedAttachments };
|
||||
});
|
||||
|
||||
return { previousState: currentState };
|
||||
},
|
||||
onError: (_error, _args, context) => {
|
||||
if (isReadOnly) return;
|
||||
utils.card.byId.setData({ cardPublicId }, context?.previousState);
|
||||
showPopup({
|
||||
header: t`Unable to delete attachment`,
|
||||
message: t`Please try again later, or contact customer support.`,
|
||||
icon: "error",
|
||||
});
|
||||
},
|
||||
onSuccess: () => {
|
||||
if (isReadOnly) return;
|
||||
// Close viewer if the deleted image was being viewed
|
||||
setSelectedIndex(null);
|
||||
},
|
||||
onSettled: async () => {
|
||||
if (isReadOnly) return;
|
||||
await utils.card.byId.invalidate({ cardPublicId });
|
||||
},
|
||||
});
|
||||
|
||||
// Keyboard navigation
|
||||
useEffect(() => {
|
||||
if (selectedIndex === null) return;
|
||||
|
||||
const handleKeyDown = (e: KeyboardEvent) => {
|
||||
if (e.key === "Escape") {
|
||||
setSelectedIndex(null);
|
||||
} else if (e.key === "ArrowLeft") {
|
||||
setSelectedIndex((prev) => {
|
||||
if (prev === null) return null;
|
||||
return prev === 0 ? imageAttachments.length - 1 : prev - 1;
|
||||
});
|
||||
} else if (e.key === "ArrowRight") {
|
||||
setSelectedIndex((prev) => {
|
||||
if (prev === null) return null;
|
||||
return prev === imageAttachments.length - 1 ? 0 : prev + 1;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
window.addEventListener("keydown", handleKeyDown);
|
||||
return () => window.removeEventListener("keydown", handleKeyDown);
|
||||
}, [selectedIndex, imageAttachments.length]);
|
||||
|
||||
if (imageAttachments.length === 0 && nonImageAttachments.length === 0) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const openViewer = (index: number) => {
|
||||
setSelectedIndex(index);
|
||||
};
|
||||
|
||||
const closeViewer = () => {
|
||||
setSelectedIndex(null);
|
||||
};
|
||||
|
||||
const goToPrevious = () => {
|
||||
if (selectedIndex === null) return;
|
||||
const newIndex =
|
||||
selectedIndex === 0 ? imageAttachments.length - 1 : selectedIndex - 1;
|
||||
setSelectedIndex(newIndex);
|
||||
};
|
||||
|
||||
const goToNext = () => {
|
||||
if (selectedIndex === null) return;
|
||||
const newIndex =
|
||||
selectedIndex === imageAttachments.length - 1 ? 0 : selectedIndex + 1;
|
||||
setSelectedIndex(newIndex);
|
||||
};
|
||||
|
||||
const handleDownload = (attachment: Attachment) => {
|
||||
if (!attachment.url) {
|
||||
showPopup({
|
||||
header: t`Download failed`,
|
||||
message: t`No download URL available for this attachment.`,
|
||||
icon: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const downloadUrl = `/api/download/attatchment?url=${encodeURIComponent(attachment.url)}&filename=${encodeURIComponent(attachment.originalFilename ?? "attachment")}`;
|
||||
|
||||
const link = document.createElement("a");
|
||||
link.href = downloadUrl;
|
||||
link.style.display = "none";
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
};
|
||||
|
||||
const selectedAttachment =
|
||||
selectedIndex !== null ? imageAttachments[selectedIndex] : null;
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="mb-3 flex flex-wrap gap-2 pt-1">
|
||||
{imageAttachments.map((attachment, index) => {
|
||||
if (!attachment.url) return null;
|
||||
return (
|
||||
<AttachmentThumbnail
|
||||
key={attachment.publicId}
|
||||
attachment={{
|
||||
publicId: attachment.publicId,
|
||||
url: attachment.url,
|
||||
originalFilename: attachment.originalFilename ?? "",
|
||||
contentType: attachment.contentType,
|
||||
}}
|
||||
onClick={() => openViewer(index)}
|
||||
isImage={true}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
{nonImageAttachments.length > 0 && (
|
||||
<div className="mb-3 flex flex-col gap-2">
|
||||
{nonImageAttachments.map((attachment) => {
|
||||
if (!attachment.url) return null;
|
||||
return (
|
||||
<FileListItem
|
||||
key={attachment.publicId}
|
||||
attachment={attachment}
|
||||
onDownload={() => handleDownload(attachment)}
|
||||
onDelete={
|
||||
isReadOnly
|
||||
? undefined
|
||||
: () => {
|
||||
deleteAttachment.mutate({
|
||||
attachmentPublicId: attachment.publicId,
|
||||
});
|
||||
}
|
||||
}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Transition.Root show={selectedIndex !== null} as={Fragment}>
|
||||
<Dialog
|
||||
as="div"
|
||||
className="relative z-50"
|
||||
onClose={() => {
|
||||
// Dialog closing is handled by the background overlay click
|
||||
}}
|
||||
static
|
||||
>
|
||||
<Transition.Child
|
||||
as={Fragment}
|
||||
enter="ease-out duration-300"
|
||||
enterFrom="opacity-0"
|
||||
enterTo="opacity-100"
|
||||
leave="ease-in duration-200"
|
||||
leaveFrom="opacity-100"
|
||||
leaveTo="opacity-0"
|
||||
>
|
||||
<div
|
||||
className="fixed inset-0 bg-light-50 transition-opacity dark:bg-dark-50"
|
||||
onClick={(e) => {
|
||||
// Only close if clicking directly on the background, not on buttons
|
||||
if (e.target === e.currentTarget) {
|
||||
closeViewer();
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Transition.Child>
|
||||
|
||||
<div className="fixed inset-0 z-10 overflow-y-auto">
|
||||
{selectedIndex !== null && selectedAttachment && (
|
||||
<div
|
||||
className="fixed left-2 top-2 z-20 flex gap-1"
|
||||
onMouseDown={(e) => e.stopPropagation()}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{!isReadOnly && (
|
||||
<button
|
||||
onMouseDown={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}}
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
deleteAttachment.mutate({
|
||||
attachmentPublicId: selectedAttachment.publicId,
|
||||
});
|
||||
}}
|
||||
className="rounded-full bg-light-50 p-1.5 text-light-1000 transition-colors hover:bg-light-100 focus:outline-none dark:bg-dark-50 dark:text-dark-1000 dark:hover:bg-dark-100"
|
||||
aria-label="Delete image"
|
||||
disabled={deleteAttachment.isPending}
|
||||
>
|
||||
<HiOutlineTrash className="h-4 w-4" />
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onMouseDown={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
}}
|
||||
onClick={(e) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
handleDownload(selectedAttachment);
|
||||
}}
|
||||
className="rounded-full bg-light-50 p-1.5 text-light-1000 transition-colors hover:bg-light-100 focus:outline-none dark:bg-dark-50 dark:text-dark-1000 dark:hover:bg-dark-100"
|
||||
aria-label="Download image"
|
||||
>
|
||||
<HiArrowDownTray className="h-4 w-4" />
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="fixed right-2 top-2 z-20 flex gap-1">
|
||||
{imageAttachments.length > 1 && selectedIndex !== null && (
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
goToPrevious();
|
||||
}}
|
||||
className="rounded-full bg-light-50 p-1.5 text-light-1000 transition-colors hover:bg-light-100 focus:outline-none dark:bg-dark-50 dark:text-dark-1000 dark:hover:bg-dark-100"
|
||||
aria-label="Previous image"
|
||||
>
|
||||
<HiChevronLeft className="h-4 w-4" />
|
||||
</button>
|
||||
)}
|
||||
|
||||
{imageAttachments.length > 1 && selectedIndex !== null && (
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
goToNext();
|
||||
}}
|
||||
className="rounded-full bg-light-50 p-1.5 text-light-1000 transition-colors hover:bg-light-100 focus:outline-none dark:bg-dark-50 dark:text-dark-1000 dark:hover:bg-dark-100"
|
||||
aria-label="Next image"
|
||||
>
|
||||
<HiChevronRight className="h-4 w-4" />
|
||||
</button>
|
||||
)}
|
||||
|
||||
{selectedIndex !== null && (
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
closeViewer();
|
||||
}}
|
||||
className="rounded-full bg-light-50 p-1.5 text-light-1000 transition-colors hover:bg-light-100 focus:outline-none dark:bg-dark-50 dark:text-dark-1000 dark:hover:bg-dark-100"
|
||||
aria-label="Close"
|
||||
>
|
||||
<HiXMark className="h-4 w-4" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex min-h-full items-center justify-center p-4">
|
||||
<Transition.Child
|
||||
as={Fragment}
|
||||
enter="ease-out duration-300"
|
||||
enterFrom="opacity-0 scale-95"
|
||||
enterTo="opacity-100 scale-100"
|
||||
leave="ease-in duration-200"
|
||||
leaveFrom="opacity-100 scale-100"
|
||||
leaveTo="opacity-0 scale-95"
|
||||
>
|
||||
<Dialog.Panel
|
||||
className="relative w-full max-w-7xl"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{selectedAttachment?.url && (
|
||||
<div className="relative">
|
||||
<div className="relative mx-auto max-h-[90vh] w-full">
|
||||
<Image
|
||||
src={selectedAttachment.url}
|
||||
alt={
|
||||
selectedAttachment.originalFilename ?? "Attachment"
|
||||
}
|
||||
width={1920}
|
||||
height={1080}
|
||||
className="mx-auto max-h-[90vh] w-auto object-contain"
|
||||
unoptimized
|
||||
/>
|
||||
</div>
|
||||
|
||||
{imageAttachments.length > 1 && (
|
||||
<div className="absolute bottom-4 left-1/2 -translate-x-1/2 rounded-full bg-black/50 px-3 py-1.5 text-[10px] text-white">
|
||||
{selectedIndex !== null && selectedIndex + 1} /{" "}
|
||||
{imageAttachments.length}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</Dialog.Panel>
|
||||
</Transition.Child>
|
||||
</div>
|
||||
</div>
|
||||
</Dialog>
|
||||
</Transition.Root>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
function AttachmentThumbnail({
|
||||
attachment,
|
||||
onClick,
|
||||
isImage,
|
||||
}: {
|
||||
attachment: {
|
||||
publicId: string;
|
||||
url: string;
|
||||
originalFilename: string;
|
||||
contentType: string;
|
||||
};
|
||||
onClick: () => void;
|
||||
isImage: boolean;
|
||||
}) {
|
||||
return (
|
||||
<button
|
||||
onClick={onClick}
|
||||
className="relative h-16 w-16 overflow-hidden rounded-xl border border-light-300 transition-transform hover:scale-105 dark:border-dark-300"
|
||||
aria-label={`View ${attachment.originalFilename}`}
|
||||
>
|
||||
{isImage ? (
|
||||
<Image
|
||||
src={attachment.url}
|
||||
alt={attachment.originalFilename}
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="64px"
|
||||
/>
|
||||
) : (
|
||||
<div className="flex h-full w-full items-center justify-center bg-light-100 dark:bg-dark-100">
|
||||
<HiDocumentText className="h-6 w-6 text-light-700 dark:text-dark-700" />
|
||||
</div>
|
||||
)}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
function formatFileSize(bytes: number | null | undefined): string {
|
||||
if (!bytes || bytes === 0 || isNaN(bytes)) return "0 B";
|
||||
const k = 1024;
|
||||
const sizes = ["B", "KB", "MB", "GB"];
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
return `${(bytes / Math.pow(k, i)).toFixed(1)} ${sizes[i] ?? "B"}`;
|
||||
}
|
||||
|
||||
function FileListItem({
|
||||
attachment,
|
||||
onDownload,
|
||||
onDelete,
|
||||
}: {
|
||||
attachment: Attachment;
|
||||
onDownload: () => void;
|
||||
onDelete?: () => void;
|
||||
}) {
|
||||
return (
|
||||
<div className="group flex w-full items-center gap-3 rounded-lg border border-light-300 bg-light-50 px-3 py-2 dark:border-dark-200 dark:bg-dark-100">
|
||||
<div className="flex-shrink-0">
|
||||
<HiDocumentText className="h-5 w-5 text-light-700 dark:text-dark-700" />
|
||||
</div>
|
||||
<div className="min-w-0 flex-1 truncate text-sm text-light-1000 dark:text-dark-1000">
|
||||
{attachment.originalFilename ?? "File"}
|
||||
</div>
|
||||
<div className="flex items-center gap-2 opacity-0 transition-opacity group-hover:opacity-100">
|
||||
<div className="text-xs text-light-500 dark:text-dark-900">
|
||||
{attachment.size != null &&
|
||||
!isNaN(attachment.size) &&
|
||||
`${formatFileSize(attachment.size)}`}
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
onDownload();
|
||||
}}
|
||||
className="flex-shrink-0 rounded-full bg-light-100 p-1.5 text-light-1000 transition-colors hover:bg-light-200 focus:outline-none dark:bg-dark-100 dark:text-dark-950 dark:hover:bg-dark-300"
|
||||
aria-label={`Download ${attachment.originalFilename}`}
|
||||
>
|
||||
<HiArrowDownTray className="h-4 w-4" />
|
||||
</button>
|
||||
{onDelete && (
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
onDelete();
|
||||
}}
|
||||
className="flex-shrink-0 rounded-full bg-light-100 p-1.5 text-light-1000 transition-colors hover:bg-light-200 focus:outline-none dark:bg-dark-100 dark:text-dark-950 dark:hover:bg-dark-300"
|
||||
aria-label={`Delete ${attachment.originalFilename}`}
|
||||
>
|
||||
<HiXMark className="h-4 w-4" />
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
174
apps/web/src/views/card/components/AttachmentUpload.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { useRef, useState } from "react";
|
||||
import { HiOutlinePaperClip } from "react-icons/hi";
|
||||
import { HiCheckBadge } from "react-icons/hi2";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
import Button from "~/components/Button";
|
||||
import { useModal } from "~/providers/modal";
|
||||
import { usePopup } from "~/providers/popup";
|
||||
import { api } from "~/utils/api";
|
||||
|
||||
export function AttachmentUpload({ cardPublicId }: { cardPublicId: string }) {
|
||||
const { openModal } = useModal();
|
||||
const { showPopup } = usePopup();
|
||||
const utils = api.useUtils();
|
||||
const [uploading, setUploading] = useState(false);
|
||||
const [isDragging, setIsDragging] = useState(false);
|
||||
const inputRef = useRef<HTMLInputElement | null>(null);
|
||||
|
||||
const generateUploadUrl = api.attachment.generateUploadUrl.useMutation();
|
||||
const confirmAttachment = api.attachment.confirm.useMutation({
|
||||
onSuccess: async () => {
|
||||
await utils.card.byId.invalidate({ cardPublicId });
|
||||
showPopup({
|
||||
header: t`Attachment uploaded`,
|
||||
message: t`Your file has been uploaded successfully.`,
|
||||
icon: "success",
|
||||
});
|
||||
},
|
||||
onError: () => {
|
||||
showPopup({
|
||||
header: t`Upload failed`,
|
||||
message: t`Failed to upload attachment. Please try again.`,
|
||||
icon: "error",
|
||||
});
|
||||
},
|
||||
onSettled: () => {
|
||||
setUploading(false);
|
||||
},
|
||||
});
|
||||
|
||||
const uploadFile = async (file: File) => {
|
||||
setUploading(true);
|
||||
|
||||
try {
|
||||
// Generate presigned URL
|
||||
const { url, key } = await generateUploadUrl.mutateAsync({
|
||||
cardPublicId,
|
||||
filename: file.name,
|
||||
contentType: file.type,
|
||||
size: file.size,
|
||||
});
|
||||
|
||||
// Upload file to S3
|
||||
const uploadResponse = await fetch(url, {
|
||||
method: "PUT",
|
||||
body: file,
|
||||
headers: {
|
||||
"Content-Type": file.type,
|
||||
},
|
||||
});
|
||||
|
||||
if (!uploadResponse.ok) {
|
||||
throw new Error("Upload failed");
|
||||
}
|
||||
|
||||
// Confirm attachment in database
|
||||
await confirmAttachment.mutateAsync({
|
||||
cardPublicId,
|
||||
s3Key: key,
|
||||
filename: file.name,
|
||||
originalFilename: file.name,
|
||||
contentType: file.type,
|
||||
size: file.size,
|
||||
});
|
||||
} catch {
|
||||
showPopup({
|
||||
header: t`Upload failed`,
|
||||
message: t`Failed to upload attachment. Please try again.`,
|
||||
icon: "error",
|
||||
});
|
||||
setUploading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleFileSelect = async (
|
||||
event: React.ChangeEvent<HTMLInputElement>,
|
||||
) => {
|
||||
const file = event.target.files?.[0];
|
||||
if (!file) return;
|
||||
|
||||
// Reset input
|
||||
event.target.value = "";
|
||||
|
||||
await uploadFile(file);
|
||||
};
|
||||
|
||||
const handleDragOver = (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
if (!uploading) {
|
||||
setIsDragging(true);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDragLeave = (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setIsDragging(false);
|
||||
};
|
||||
|
||||
const handleDrop = async (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setIsDragging(false);
|
||||
|
||||
if (uploading) return;
|
||||
|
||||
const files = Array.from(e.dataTransfer.files);
|
||||
if (files.length === 0) return;
|
||||
|
||||
// Upload the first file (or could upload all files)
|
||||
await uploadFile(files[0] ?? new File([], ""));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mb-6">
|
||||
<input
|
||||
ref={inputRef}
|
||||
type="file"
|
||||
id="attachment-upload"
|
||||
className="hidden"
|
||||
onChange={handleFileSelect}
|
||||
disabled={uploading}
|
||||
/>
|
||||
<div
|
||||
onDragOver={handleDragOver}
|
||||
onDragLeave={handleDragLeave}
|
||||
onDrop={handleDrop}
|
||||
className={twMerge(
|
||||
"rounded-lg border-2 border-dashed transition-colors",
|
||||
isDragging
|
||||
? "border-light-300 bg-light-100 dark:border-dark-300 dark:bg-dark-100"
|
||||
: "border-transparent",
|
||||
)}
|
||||
>
|
||||
<div className="flex items-center justify-between p-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
iconLeft={
|
||||
<HiCheckBadge className="h-4 w-4 text-light-950 dark:text-dark-950" />
|
||||
}
|
||||
iconOnly
|
||||
size="sm"
|
||||
onClick={() => openModal("ADD_CHECKLIST")}
|
||||
/>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
iconLeft={
|
||||
<HiOutlinePaperClip className="h-4 w-4 text-light-950 dark:text-dark-950" />
|
||||
}
|
||||
isLoading={uploading}
|
||||
disabled={uploading}
|
||||
iconOnly
|
||||
size="sm"
|
||||
onClick={() => inputRef.current?.click()}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -28,7 +28,7 @@ export default function BoardDropdown() {
|
||||
},
|
||||
]}
|
||||
>
|
||||
<HiEllipsisHorizontal className="h-6 w-6 text-dark-900" />
|
||||
<HiEllipsisHorizontal className="h-5 w-5 text-dark-900" />
|
||||
</Dropdown>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -20,6 +20,8 @@ import { api } from "~/utils/api";
|
||||
import { formatMemberDisplayName, getAvatarUrl } from "~/utils/helpers";
|
||||
import { DeleteLabelConfirmation } from "../../components/DeleteLabelConfirmation";
|
||||
import ActivityList from "./components/ActivityList";
|
||||
import { AttachmentThumbnails } from "./components/AttachmentThumbnails";
|
||||
import { AttachmentUpload } from "./components/AttachmentUpload";
|
||||
import Checklists from "./components/Checklists";
|
||||
import { DeleteCardConfirmation } from "./components/DeleteCardConfirmation";
|
||||
import { DeleteChecklistConfirmation } from "./components/DeleteChecklistConfirmation";
|
||||
@@ -105,7 +107,7 @@ export function CardRightPanel({ isTemplate }: { isTemplate?: boolean }) {
|
||||
|
||||
return (
|
||||
<div className="h-full w-[360px] border-l-[1px] border-light-300 bg-light-50 p-8 text-light-900 dark:border-dark-300 dark:bg-dark-50 dark:text-dark-900">
|
||||
<div className="mb-4 flex w-full flex-row">
|
||||
<div className="mb-4 flex w-full flex-row pt-[18px]">
|
||||
<p className="my-2 mb-2 w-[100px] text-sm font-medium">{t`List`}</p>
|
||||
<ListSelector
|
||||
cardPublicId={cardId ?? ""}
|
||||
@@ -208,6 +210,17 @@ export default function CardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
}
|
||||
}, [card, getModalState, clearModalState]);
|
||||
|
||||
// Auto-resize title textarea
|
||||
useEffect(() => {
|
||||
const titleTextarea = document.getElementById(
|
||||
"title",
|
||||
) as HTMLTextAreaElement;
|
||||
if (titleTextarea) {
|
||||
titleTextarea.style.height = "auto";
|
||||
titleTextarea.style.height = `${titleTextarea.scrollHeight}px`;
|
||||
}
|
||||
}, [card]);
|
||||
|
||||
if (!cardId) return <></>;
|
||||
|
||||
return (
|
||||
@@ -215,47 +228,71 @@ export default function CardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
<PageHead
|
||||
title={t`${card?.title ?? t`Card`} | ${board?.name ?? t`Board`}`}
|
||||
/>
|
||||
<div className="flex h-full flex-1 flex-row overflow-hidden">
|
||||
<div className="flex h-full flex-1 flex-col overflow-hidden">
|
||||
{/* Full-width top strip with board link and dropdown */}
|
||||
<div className="flex w-full items-center justify-between border-b-[1px] border-light-300 bg-light-50 px-8 py-2 dark:border-dark-300 dark:bg-dark-50">
|
||||
{!card && isLoading && (
|
||||
<div className="flex space-x-2">
|
||||
<div className="h-[1.5rem] w-[150px] animate-pulse rounded-[5px] bg-light-300 dark:bg-dark-300" />
|
||||
</div>
|
||||
)}
|
||||
{card && (
|
||||
<>
|
||||
<div className="flex items-center gap-1">
|
||||
<Link
|
||||
className="whitespace-nowrapleading-[1.5rem] text-sm font-bold text-light-900 dark:text-dark-950"
|
||||
href={`${isTemplate ? "/templates" : "/boards"}`}
|
||||
>
|
||||
{workspace.name}
|
||||
</Link>
|
||||
<IoChevronForwardSharp className="h-[10px] w-[10px] text-light-900 dark:text-dark-900" />
|
||||
<Link
|
||||
className="whitespace-nowrap text-sm font-bold leading-[1.5rem] text-light-900 dark:text-dark-950"
|
||||
href={`${isTemplate ? "/templates" : "/boards"}/${board?.publicId}`}
|
||||
>
|
||||
{board?.name}
|
||||
</Link>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<Dropdown />
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{!card && !isLoading && (
|
||||
<p className="block p-0 py-0 font-bold leading-[1.5rem] tracking-tight text-light-900 dark:text-dark-900 sm:text-[1rem]">
|
||||
{t`Card not found`}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<div className="scrollbar-thumb-rounded-[4px] scrollbar-track-rounded-[4px] w-full flex-1 overflow-y-auto scrollbar scrollbar-track-light-200 scrollbar-thumb-light-400 hover:scrollbar-thumb-light-400 dark:scrollbar-track-dark-100 dark:scrollbar-thumb-dark-300 dark:hover:scrollbar-thumb-dark-300">
|
||||
<div className="p-auto mx-auto flex h-full w-full max-w-[800px] flex-col">
|
||||
<div className="p-6 md:p-8">
|
||||
<div className="mb-8 flex w-full items-center justify-between md:mt-6">
|
||||
<div className="mb-8 md:mt-4">
|
||||
{!card && isLoading && (
|
||||
<div className="flex space-x-2">
|
||||
<div className="h-[2.3rem] w-[150px] animate-pulse rounded-[5px] bg-light-300 dark:bg-dark-300" />
|
||||
<div className="h-[2.3rem] w-[300px] animate-pulse rounded-[5px] bg-light-300 dark:bg-dark-300" />
|
||||
</div>
|
||||
)}
|
||||
{card && (
|
||||
<>
|
||||
<Link
|
||||
className="whitespace-nowrap font-bold leading-[2.3rem] tracking-tight text-light-900 dark:text-dark-900 sm:text-[1.2rem]"
|
||||
href={`${isTemplate ? "/templates" : "/boards"}/${board?.publicId}`}
|
||||
>
|
||||
{board?.name}
|
||||
</Link>
|
||||
<IoChevronForwardSharp
|
||||
size={18}
|
||||
className="mx-2 text-light-900 dark:text-dark-900"
|
||||
/>
|
||||
<form
|
||||
onSubmit={handleSubmit(onSubmit)}
|
||||
className="w-full space-y-6"
|
||||
>
|
||||
<div>
|
||||
<input
|
||||
type="text"
|
||||
id="title"
|
||||
{...register("title")}
|
||||
onBlur={handleSubmit(onSubmit)}
|
||||
className="block w-full border-0 bg-transparent p-0 py-0 font-bold tracking-tight text-neutral-900 focus:ring-0 dark:text-dark-1000 sm:text-[1.2rem]"
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
<div className="flex">
|
||||
<Dropdown />
|
||||
<form
|
||||
onSubmit={handleSubmit(onSubmit)}
|
||||
className="w-full space-y-6"
|
||||
>
|
||||
<div>
|
||||
<textarea
|
||||
id="title"
|
||||
{...register("title")}
|
||||
onBlur={handleSubmit(onSubmit)}
|
||||
rows={1}
|
||||
className="block w-full resize-none overflow-hidden border-0 bg-transparent p-0 py-0 font-bold leading-relaxed text-neutral-900 focus:ring-0 dark:text-dark-1000 sm:text-[1.2rem]"
|
||||
onInput={(e) => {
|
||||
const target = e.target as HTMLTextAreaElement;
|
||||
target.style.height = "auto";
|
||||
target.style.height = `${target.scrollHeight}px`;
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
</form>
|
||||
)}
|
||||
{!card && !isLoading && (
|
||||
<p className="block p-0 py-0 font-bold leading-[2.3rem] tracking-tight text-neutral-900 dark:text-dark-1000 sm:text-[1.2rem]">
|
||||
@@ -286,6 +323,21 @@ export default function CardPage({ isTemplate }: { isTemplate?: boolean }) {
|
||||
activeChecklistForm={activeChecklistForm}
|
||||
setActiveChecklistForm={setActiveChecklistForm}
|
||||
/>
|
||||
{!isTemplate && (
|
||||
<>
|
||||
{card?.attachments.length > 0 && (
|
||||
<div className="mt-6">
|
||||
<AttachmentThumbnails
|
||||
attachments={card.attachments}
|
||||
cardPublicId={cardId ?? ""}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-6">
|
||||
<AttachmentUpload cardPublicId={cardId} />
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
<div className="border-t-[1px] border-light-300 pt-12 dark:border-dark-300">
|
||||
<h2 className="text-md pb-4 font-medium text-light-1000 dark:text-dark-1000">
|
||||
{t`Activity`}
|
||||
|
||||
@@ -10,7 +10,7 @@ import { HiMiniMinusSmall, HiMiniPlusSmall } from "react-icons/hi2";
|
||||
|
||||
const Text = ({ children }: { children: React.ReactNode }) => {
|
||||
return (
|
||||
<p className="text-[15px] leading-[1.7rem] text-light-800 dark:text-dark-700">
|
||||
<p className="text-[14px] leading-[1.7rem] text-light-800 dark:text-dark-800">
|
||||
{children}
|
||||
</p>
|
||||
);
|
||||
@@ -22,7 +22,7 @@ const Faqs = () => {
|
||||
question: t`Why make an open source Trello?`,
|
||||
answer: (
|
||||
<Text>
|
||||
{t`When Trello launched in 2011, it blew everyone away with its carefully designed simplicity, but over time (and atlassification) it lost its magic and grew into something closer to "Jira Lite". This project is our attempt to recapture the original magic of Trello's simplicity, in open source.`}
|
||||
{t`When Trello launched in 2011, it blew everyone away with its carefully designed simplicity, but over the years it lost its magic and grew into something closer to "Jira Lite". This project is our attempt to recapture the original magic of Trello's simplicity, in open source.`}
|
||||
</Text>
|
||||
),
|
||||
},
|
||||
@@ -38,7 +38,7 @@ const Faqs = () => {
|
||||
question: t`How is the project funded?`,
|
||||
answer: (
|
||||
<Text>
|
||||
{t`For long-term sustainability, we recognise all good open source projects need a source of revenue. Ours comes from the paid cloud offering for workspaces with multiple users (free during the beta) and for custom workspace slugs. There's no obligation to use it, and you can self-host the software on your own infrastructure free of charge.`}
|
||||
{t`For long-term sustainability, we recognise all good open source projects need a source of revenue. Ours comes from the paid cloud offering for workspaces with multiple users and for custom workspace slugs. There's no obligation to use it, and you can self-host the software on your own infrastructure free of charge.`}
|
||||
</Text>
|
||||
),
|
||||
},
|
||||
@@ -146,10 +146,10 @@ const Faqs = () => {
|
||||
<p className="mt-2 text-center text-3xl font-bold text-light-1000 dark:text-dark-1000 lg:text-4xl">
|
||||
{t`Questions?`}
|
||||
</p>
|
||||
<p className="text:md lg:text-md mt-3 max-w-[500px] text-center text-light-950 dark:text-dark-900">
|
||||
<p className="text lg:text-md mt-3 max-w-[500px] text-center text-light-950 dark:text-dark-900">
|
||||
<Trans>
|
||||
Find answers to common questions about the project. Can't find what
|
||||
you're looking for? Feel free to{" "}
|
||||
Find answers to common questions about Kan. Can't find what you're
|
||||
looking for? Feel free to{" "}
|
||||
<Link href="mailto:support@kan.bn" className="underline">
|
||||
contact us
|
||||
</Link>
|
||||
@@ -157,22 +157,22 @@ const Faqs = () => {
|
||||
</Trans>
|
||||
</p>
|
||||
</div>
|
||||
<div className="rounded-2xl bg-light-50 ring-1 ring-light-300 dark:bg-dark-50 dark:ring-dark-400">
|
||||
<div className="rounded-2xl bg-light-50 ring-1 ring-light-300 dark:bg-dark-50 dark:ring-dark-200">
|
||||
<div className="mx-auto max-w-7xl px-6 py-20 lg:px-16">
|
||||
<div className="mx-auto max-w-4xl">
|
||||
<dl className="divide-y divide-light-300 dark:divide-dark-600">
|
||||
<dl className="divide-y divide-light-300 dark:divide-dark-200">
|
||||
{faqs.map((faq) => (
|
||||
<Disclosure
|
||||
key={faq.question}
|
||||
as="div"
|
||||
className="py-6 first:pt-0 last:pb-0"
|
||||
className="py-5 first:pt-0 last:pb-0"
|
||||
>
|
||||
<dt>
|
||||
<DisclosureButton className="group flex w-full items-start justify-between text-left text-light-1000 dark:text-dark-1000">
|
||||
<span className="text-base/7 font-semibold">
|
||||
<DisclosureButton className="group flex w-full items-center justify-between text-left text-light-1000 dark:text-dark-1000">
|
||||
<span className="text-[14px] font-semibold">
|
||||
{faq.question}
|
||||
</span>
|
||||
<span className="ml-6 flex h-7 items-center">
|
||||
<span className="ml-6 flex h-7 items-center text-light-800 dark:text-dark-800">
|
||||
<HiMiniPlusSmall
|
||||
aria-hidden="true"
|
||||
className="size-6 group-data-[open]:hidden"
|
||||
|
||||
@@ -36,6 +36,7 @@ const Footer = () => {
|
||||
{ name: t`Roadmap`, href: "/kan/roadmap" },
|
||||
{ name: t`GitHub`, href: "https://github.com/kanbn/kan" },
|
||||
{ name: t`Contact`, href: "mailto:support@kan.bn" },
|
||||
{ name: t`OSS Friends`, href: "/oss-friends" },
|
||||
],
|
||||
legal: [
|
||||
{ name: t`Terms of service`, href: "/terms" },
|
||||
|
||||
@@ -7,13 +7,13 @@ import Footer from "./Footer";
|
||||
import Header from "./Header";
|
||||
|
||||
export default function Layout({ children }: { children: React.ReactNode }) {
|
||||
const { theme } = useTheme();
|
||||
const { resolvedTheme } = useTheme();
|
||||
|
||||
const { data: session } = authClient.useSession();
|
||||
|
||||
const isLoggedIn = !!session?.user;
|
||||
|
||||
const isDarkMode = theme === "dark";
|
||||
const isDarkMode = resolvedTheme === "dark";
|
||||
|
||||
return (
|
||||
<>
|
||||
|
||||
258
apps/web/src/views/home/components/Testimonials.tsx
Normal file
@@ -0,0 +1,258 @@
|
||||
import Image from "next/image";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
|
||||
interface Testimonial {
|
||||
name: string;
|
||||
handle: string;
|
||||
image?: string;
|
||||
colour?: string;
|
||||
text: string | React.ReactNode;
|
||||
role?: string;
|
||||
link?: string;
|
||||
rowSpan?: number;
|
||||
}
|
||||
|
||||
const TestimonialCard = ({
|
||||
testimonial,
|
||||
rowSpan,
|
||||
}: {
|
||||
testimonial: Testimonial;
|
||||
rowSpan?: number;
|
||||
}) => {
|
||||
// Generate initials for avatar
|
||||
const initials = testimonial.name
|
||||
.split(" ")
|
||||
.map((n) => n[0])
|
||||
.join("")
|
||||
.toUpperCase();
|
||||
|
||||
return (
|
||||
<div
|
||||
className={twMerge(
|
||||
"group relative rounded-2xl border border-light-200 bg-light-50 p-6 transition-all duration-200 hover:shadow-sm dark:border-dark-200 dark:bg-dark-50",
|
||||
rowSpan === 2 ? "md:row-span-2" : "",
|
||||
)}
|
||||
>
|
||||
<div className="flex items-start gap-3">
|
||||
{testimonial.image ? (
|
||||
<div className="relative h-10 w-10 shrink-0 overflow-hidden rounded-full">
|
||||
<Image
|
||||
src={testimonial.image}
|
||||
alt={testimonial.name}
|
||||
fill
|
||||
className="object-cover"
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className="flex h-10 w-10 shrink-0 items-center justify-center rounded-full text-sm font-semibold text-light-50 dark:text-dark-1000"
|
||||
style={
|
||||
testimonial.colour
|
||||
? { backgroundColor: testimonial.colour }
|
||||
: undefined
|
||||
}
|
||||
>
|
||||
{initials}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex-1">
|
||||
<div className="flex items-center gap-2">
|
||||
<p className="font-semibold text-light-1000 dark:text-dark-1000">
|
||||
{testimonial.name}
|
||||
</p>
|
||||
</div>
|
||||
{testimonial.link ? (
|
||||
<a
|
||||
href={testimonial.link}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="-mt-1 block text-sm text-light-800 transition-colors hover:text-light-900 dark:text-dark-800 dark:hover:text-dark-900"
|
||||
>
|
||||
{testimonial.handle}
|
||||
</a>
|
||||
) : (
|
||||
<p className="-mt-0.5 block text-sm text-light-800 dark:text-dark-800">
|
||||
{testimonial.handle}
|
||||
</p>
|
||||
)}
|
||||
{testimonial.role && (
|
||||
<p className="text-xs text-light-600 dark:text-dark-600">
|
||||
{testimonial.role}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 text-sm leading-relaxed text-light-950 dark:text-dark-900">
|
||||
<p>{testimonial.text}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const Testimonials = () => {
|
||||
const testimonials: Testimonial[] = [
|
||||
{
|
||||
name: "Bobby Compüters",
|
||||
handle: "@bobbycomputers",
|
||||
image: "/testimonials/avatars/bobby_computers.jpg",
|
||||
text: (
|
||||
<>
|
||||
Holy crap I love this app. It's brutally minimal but somehow has
|
||||
everything I need.
|
||||
</>
|
||||
),
|
||||
link: "https://x.com/bobbycomputers",
|
||||
},
|
||||
{
|
||||
name: "JR Raphael",
|
||||
handle: "@JRRaphael",
|
||||
image: "/testimonials/avatars/jrraphael.png",
|
||||
link: "https://www.fastcompany.com/91376028/trello-alternative-kan",
|
||||
rowSpan: 2,
|
||||
text: (
|
||||
<>
|
||||
The interesting thing about signing into Kan for the first time is
|
||||
that it feels new and electrifying—and yet simultaneously quite
|
||||
familiar, especially if you’ve spent any time in Trello over the
|
||||
years.
|
||||
<br />
|
||||
<br />
|
||||
As someone who connected more with Trello’s original vision and mostly
|
||||
just tolerated the more recent pivots and additions, it’s a bit of a
|
||||
revelation to use.
|
||||
<br />
|
||||
<br />
|
||||
At its core, Kan gives you a super-minimalist and frills-free
|
||||
Trello-style Kanban board. And the extent to which it has been able to
|
||||
build upon the original Trello vision is staggering.
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "singiamtel",
|
||||
handle: "@singiamtel",
|
||||
colour: "#ff6600",
|
||||
text: <>The project seems nice, but how good is that domain name</>,
|
||||
link: "https://news.ycombinator.com/item?id=44157177",
|
||||
},
|
||||
|
||||
{
|
||||
name: "Jan Stgmnn",
|
||||
handle: "@JanStgmnn",
|
||||
image: "/testimonials/avatars/jan_stgmnn.jpg",
|
||||
link: "https://x.com/JanStgmnn",
|
||||
text: (
|
||||
<>
|
||||
Just wanted to say, that I really love the project. It's so easy to
|
||||
use and has a really nice UI!
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "Fox",
|
||||
handle: "@dscfox",
|
||||
image: "/testimonials/avatars/fox.png",
|
||||
link: "https://discord.gg/e6ejRb6CmT",
|
||||
rowSpan: 2,
|
||||
text: (
|
||||
<>
|
||||
I've been looking at alternatives for months, but everything came up
|
||||
short.
|
||||
<br />
|
||||
<br />
|
||||
Some were direct clones, but lacked features I was dependent on.
|
||||
Others were rich in features, but strayed too far away from the
|
||||
simplicity of Trello.
|
||||
<br />
|
||||
<br />
|
||||
This seems like the best alternative to Trello for me.
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "Hanno Braun",
|
||||
handle: "@hannobraun",
|
||||
image: "/testimonials/avatars/hanno_braun.webp",
|
||||
link: "https://discord.gg/e6ejRb6CmT",
|
||||
text: (
|
||||
<>
|
||||
I've been very impressed with the app so far! It's great to have such
|
||||
a nice open source alternative to Trello.
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "headlessdev_",
|
||||
handle: "@headlessdev_",
|
||||
image: "/testimonials/avatars/headless_dev.png",
|
||||
link: "https://www.reddit.com/r/selfhosted/comments/1l1f2st/i_made_an_opensource_alternative_to_trello/",
|
||||
text: <>This is the best thing I've seen here in a long time</>,
|
||||
},
|
||||
{
|
||||
name: "EHB",
|
||||
handle: "@ehb3839",
|
||||
image: "/testimonials/avatars/ehb.webp",
|
||||
link: "https://www.reddit.com/r/selfhosted/comments/1l1f2st/i_made_an_opensource_alternative_to_trello/",
|
||||
text: (
|
||||
<>
|
||||
It's exactly what I've been looking for recently. The simplicity of
|
||||
the overall app is a pleasure to use.
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "Tasneema Waquar",
|
||||
handle: "@tasneema_waquar",
|
||||
image: "/testimonials/avatars/tasneema_waquar.jpeg",
|
||||
link: "https://www.producthunt.com/products/kan-bn/reviews",
|
||||
text: (
|
||||
<>
|
||||
The design of this project management tool is impressive. The
|
||||
interface is intuitive, free of unnecessary clutter, and comes with a
|
||||
solid selection of templates.
|
||||
</>
|
||||
),
|
||||
},
|
||||
{
|
||||
name: "BRAVO68WEB",
|
||||
handle: "@bravo68web",
|
||||
image: "/testimonials/avatars/bravo68web.jpeg",
|
||||
link: "https://discord.gg/e6ejRb6CmT",
|
||||
text: <>I have fallen in love with the project.</>,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="flex flex-col items-center justify-center px-4 pb-24">
|
||||
<div className="flex items-center gap-2 rounded-full border bg-light-50 px-4 py-1 text-center text-xs text-light-1000 dark:border-dark-300 dark:bg-dark-50 dark:text-dark-900 lg:text-sm">
|
||||
<p>{t`Testimonials`}</p>
|
||||
</div>
|
||||
|
||||
<p className="mt-2 text-center text-3xl font-bold text-light-1000 dark:text-dark-1000 lg:text-4xl">
|
||||
{t`Loved by teams worldwide`}
|
||||
</p>
|
||||
<p className="text-md lg:text-md mt-3 max-w-[500px] text-center text-light-950 dark:text-dark-900">
|
||||
{t`See what our users are saying about Kan`}
|
||||
</p>
|
||||
|
||||
<div className="mx-auto mt-16 w-full max-w-7xl">
|
||||
<div className="grid grid-cols-1 gap-4 [mask-image:linear-gradient(to_bottom,black_90%,transparent_98%)] md:auto-rows-fr md:grid-cols-3">
|
||||
{testimonials.map((testimonial, index) => (
|
||||
<TestimonialCard
|
||||
key={`testimonial-${index}`}
|
||||
testimonial={testimonial}
|
||||
rowSpan={testimonial.rowSpan}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Testimonials;
|
||||
@@ -12,6 +12,7 @@ import FAQs from "./components/Faqs";
|
||||
import Features from "./components/Features";
|
||||
import Layout from "./components/Layout";
|
||||
import Logos from "./components/Logos";
|
||||
import Testimonials from "./components/Testimonials";
|
||||
|
||||
export default function HomeView() {
|
||||
const { resolvedTheme } = useTheme();
|
||||
@@ -110,6 +111,10 @@ export default function HomeView() {
|
||||
<div id="features" className="absolute -top-20" />
|
||||
<Features theme={resolvedTheme === "dark" ? "dark" : "light"} />
|
||||
</div>
|
||||
<div className="relative pt-10">
|
||||
<div id="testimonials" className="absolute -top-20" />
|
||||
<Testimonials />
|
||||
</div>
|
||||
<div className="relative pt-10">
|
||||
<div id="faq" className="absolute -top-20" />
|
||||
<FAQs />
|
||||
|
||||
@@ -176,6 +176,13 @@ export function InviteMemberForm({
|
||||
};
|
||||
|
||||
const handleInviteLinkToggle = async () => {
|
||||
if (
|
||||
env("NEXT_PUBLIC_KAN_ENV") === "cloud" &&
|
||||
!hasTeamSubscription &&
|
||||
!hasProSubscription
|
||||
)
|
||||
return handleUpgrade();
|
||||
|
||||
setIsLoadingInviteLink(true);
|
||||
|
||||
if (isShareInviteLinkEnabled && workspace.publicId) {
|
||||
@@ -342,11 +349,6 @@ export function InviteMemberForm({
|
||||
: t`Create invite link`
|
||||
}
|
||||
isChecked={isShareInviteLinkEnabled}
|
||||
disabled={
|
||||
env("NEXT_PUBLIC_KAN_ENV") === "cloud" &&
|
||||
!hasTeamSubscription &&
|
||||
!hasProSubscription
|
||||
}
|
||||
onChange={handleInviteLinkToggle}
|
||||
/>
|
||||
<div>
|
||||
@@ -354,7 +356,7 @@ export function InviteMemberForm({
|
||||
!hasTeamSubscription &&
|
||||
!hasProSubscription ? (
|
||||
<Button type="button" onClick={handleUpgrade}>
|
||||
{t`Upgrade to Team Plan`}
|
||||
{t`Start 14 day free trial`}
|
||||
</Button>
|
||||
) : (
|
||||
<Button
|
||||
|
||||
@@ -181,7 +181,7 @@ export default function MembersPage() {
|
||||
<div className="flex items-center gap-3">
|
||||
{env("NEXT_PUBLIC_KAN_ENV") === "cloud" && (
|
||||
<>
|
||||
{!proSubscription && (
|
||||
{!proSubscription && !teamSubscription && (
|
||||
<Link
|
||||
href="/settings/workspace?upgrade=pro"
|
||||
className="hidden items-center rounded-full border border-emerald-300 bg-emerald-50 px-3 py-1 text-center text-xs text-emerald-400 dark:border-emerald-700 dark:bg-emerald-950 dark:text-emerald-400 lg:flex"
|
||||
|
||||
120
apps/web/src/views/oss-friends/index.tsx
Normal file
@@ -0,0 +1,120 @@
|
||||
import Link from "next/link";
|
||||
import { t } from "@lingui/core/macro";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
import Button from "~/components/Button";
|
||||
import { PageHead } from "~/components/PageHead";
|
||||
import Layout from "../home/components/Layout";
|
||||
|
||||
interface OSSFriend {
|
||||
name: string;
|
||||
description: string;
|
||||
href: string;
|
||||
}
|
||||
|
||||
interface OSSFriendsResponse {
|
||||
data: OSSFriend[];
|
||||
}
|
||||
|
||||
export default function OSSFriendsView() {
|
||||
const [ossFriends, setOSSFriends] = useState<OSSFriend[]>([]);
|
||||
const [isLoading, setIsLoading] = useState<boolean>(true);
|
||||
const fetchOSSFriends = async (): Promise<OSSFriend[]> => {
|
||||
try {
|
||||
const response = await fetch("/api/oss-friends");
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error("Failed to fetch OSS friends");
|
||||
}
|
||||
const { data } = (await response.json()) as OSSFriendsResponse;
|
||||
|
||||
return data;
|
||||
} catch (error) {
|
||||
console.error("Error fetching OSS friends:", error);
|
||||
return [];
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchData() {
|
||||
try {
|
||||
const data = await fetchOSSFriends();
|
||||
setOSSFriends(data);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
}
|
||||
void fetchData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Layout>
|
||||
<PageHead title={`${t`OSS Friends`} | kan.bn`} />
|
||||
|
||||
<div className="flex h-full w-full flex-col lg:pt-[5rem]">
|
||||
<div className="w-full pb-10 pt-32">
|
||||
<div className="flex flex-col items-center justify-center px-4 pb-10">
|
||||
<p className="mt-4 text-center text-3xl font-bold text-light-1000 dark:text-dark-1000 lg:text-3xl">
|
||||
{t`Open Source Friends`}
|
||||
</p>
|
||||
<p className="text:md lg:text-md mt-4 max-w-[500px] text-center text-light-950 dark:text-dark-900">
|
||||
{t`Check out some of our favorite open source projects.`}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx-auto w-full max-w-7xl px-4 pb-24">
|
||||
<div className="grid grid-cols-1 gap-4 md:grid-cols-3">
|
||||
{isLoading &&
|
||||
Array.from({ length: 12 }).map((_, idx) => (
|
||||
<div
|
||||
key={`oss-friend-skeleton-${idx}`}
|
||||
className="group relative h-[200px] rounded-2xl border border-light-200 bg-light-50 p-6 dark:border-dark-200 dark:bg-dark-50"
|
||||
>
|
||||
<div className="mb-4 flex flex-col gap-3">
|
||||
<div className="h-5 w-2/3 animate-pulse rounded-sm bg-light-200 dark:bg-dark-200" />
|
||||
<div className="h-3 w-full animate-pulse rounded-sm bg-light-200 dark:bg-dark-200" />
|
||||
<div className="h-3 w-5/6 animate-pulse rounded-sm bg-light-200 dark:bg-dark-200" />
|
||||
</div>
|
||||
<div className="h-8 w-28 animate-pulse rounded-md bg-light-200 dark:bg-dark-200" />
|
||||
</div>
|
||||
))}
|
||||
|
||||
{!isLoading &&
|
||||
ossFriends.map((friend, idx) => {
|
||||
return (
|
||||
<div
|
||||
key={`oss-friend-${idx}`}
|
||||
className="group relative rounded-2xl border border-light-200 bg-light-50 p-6 transition-all duration-200 hover:shadow-sm dark:border-dark-200 dark:bg-dark-50"
|
||||
>
|
||||
<div className="mb-4 flex flex-col gap-2">
|
||||
<Link
|
||||
href={friend.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<h3 className="text-lg font-semibold text-light-1000 dark:text-dark-1000">
|
||||
{friend.name}
|
||||
</h3>
|
||||
</Link>
|
||||
|
||||
<p className="text-sm leading-relaxed text-light-900 dark:text-dark-900">
|
||||
{friend.description}
|
||||
</p>
|
||||
</div>
|
||||
<Button
|
||||
href={friend.href}
|
||||
variant="secondary"
|
||||
rel="noopener noreferrer"
|
||||
size="sm"
|
||||
>
|
||||
{t`Learn more`}
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
@@ -131,11 +131,11 @@ const Pricing = ({
|
||||
>
|
||||
{tier.name}
|
||||
</h3>
|
||||
{tier.highlighted && frequency?.value === "annually" ? (
|
||||
{tier.highlighted && (
|
||||
<p className="rounded-full bg-light-50 px-2.5 py-1 text-[12px] font-semibold text-dark-500 dark:bg-dark-1000 dark:text-dark-50">
|
||||
-20%
|
||||
{t`14 day free trial`}
|
||||
</p>
|
||||
) : null}
|
||||
)}
|
||||
</div>
|
||||
<p
|
||||
className={twMerge(
|
||||
|
||||
@@ -9,6 +9,7 @@ import LabelIcon from "~/components/LabelIcon";
|
||||
import { useModal } from "~/providers/modal";
|
||||
import { api } from "~/utils/api";
|
||||
import ActivityList from "~/views/card/components/ActivityList";
|
||||
import { AttachmentThumbnails } from "~/views/card/components/AttachmentThumbnails";
|
||||
import Checklists from "~/views/card/components/Checklists";
|
||||
|
||||
export function CardModal({
|
||||
@@ -126,11 +127,24 @@ export function CardModal({
|
||||
<Editor
|
||||
content={data.description}
|
||||
readOnly
|
||||
workspaceMembers={data?.list.board.workspace.members ?? []}
|
||||
workspaceMembers={
|
||||
data?.list.board.workspace.members ?? []
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{data?.attachments &&
|
||||
data.attachments.length > 0 &&
|
||||
cardPublicId && (
|
||||
<div className="mb-10 max-w-2xl">
|
||||
<AttachmentThumbnails
|
||||
attachments={data.attachments}
|
||||
cardPublicId={cardPublicId}
|
||||
isReadOnly
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
{data?.checklists && data.checklists.length > 0 && (
|
||||
<Checklists
|
||||
checklists={data.checklists}
|
||||
|
||||
@@ -44,6 +44,7 @@ export default function PublicBoardView() {
|
||||
workspaceSlug: workspaceSlug ?? "",
|
||||
members: formatToArray(router.query.members),
|
||||
labels: formatToArray(router.query.labels),
|
||||
lists: formatToArray(router.query.lists),
|
||||
},
|
||||
{
|
||||
enabled: router.isReady && !!boardSlug,
|
||||
@@ -130,6 +131,7 @@ export default function PublicBoardView() {
|
||||
<Filters
|
||||
labels={data.labels ?? []}
|
||||
members={[]}
|
||||
lists={data.allLists ?? []}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</div>
|
||||
@@ -187,6 +189,7 @@ export default function PublicBoardView() {
|
||||
members={[]}
|
||||
description={card.description}
|
||||
comments={card.comments ?? []}
|
||||
attachments={card.attachments}
|
||||
/>
|
||||
</Link>
|
||||
))}
|
||||
|
||||
@@ -80,7 +80,8 @@ export default function WorkspaceSettings() {
|
||||
/>
|
||||
|
||||
{env("NEXT_PUBLIC_KAN_ENV") === "cloud" &&
|
||||
!hasActiveSubscription(subscriptions, "pro") && (
|
||||
!hasActiveSubscription(subscriptions, "pro") &&
|
||||
!hasActiveSubscription(subscriptions, "team") && (
|
||||
<div className="my-8">
|
||||
<Button
|
||||
onClick={() => openModal("UPGRADE_TO_PRO")}
|
||||
|
||||
@@ -12,7 +12,7 @@ const schema = z.object({
|
||||
name: z
|
||||
.string()
|
||||
.min(3, { message: t`Workspace name must be at least 3 characters long` })
|
||||
.max(24, { message: t`Workspace name cannot exceed 24 characters` }),
|
||||
.max(64, { message: t`Workspace name cannot exceed 64 characters` }),
|
||||
});
|
||||
|
||||
type FormValues = z.infer<typeof schema>;
|
||||
|
||||
@@ -48,9 +48,11 @@ export function UpgradeToProConfirmation({
|
||||
return (
|
||||
<div className="p-5">
|
||||
<div className="flex w-full flex-col justify-between pb-4">
|
||||
<h2 className="text-md pb-4 font-bold text-neutral-900 dark:text-dark-1000">
|
||||
{t`Upgrade to Pro`}
|
||||
</h2>
|
||||
<div className="pb-4">
|
||||
<h2 className="text-md font-bold text-neutral-900 dark:text-dark-1000">
|
||||
{t`Upgrade to Pro`}
|
||||
</h2>
|
||||
</div>
|
||||
<p className="mb-4 text-sm font-medium text-light-900 dark:text-dark-900">
|
||||
{t`Supercharge your workspace for just $29/month. Here's what you'll get:`}
|
||||
</p>
|
||||
@@ -106,7 +108,7 @@ export function UpgradeToProConfirmation({
|
||||
<Button
|
||||
onClick={handleUpgrade}
|
||||
iconRight={<HiBolt />}
|
||||
>{t`Upgrade`}</Button>
|
||||
>{t`Start 14 day free trial`}</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -35,8 +35,10 @@ services:
|
||||
- SMTP_PASSWORD=${SMTP_PASSWORD}
|
||||
- SMTP_SECURE=${SMTP_SECURE}
|
||||
- EMAIL_FROM=${EMAIL_FROM}
|
||||
- PLUNK_API_KEY=${PLUNK_API_KEY}
|
||||
- PLUNK_API_URL=${PLUNK_API_URL}
|
||||
|
||||
# Notifications
|
||||
- NOVU_API_KEY=${NOVU_API_KEY}
|
||||
- DISCORD_WEBHOOK_URL=${DISCORD_WEBHOOK_URL}
|
||||
|
||||
# S3 storage
|
||||
- S3_ACCESS_KEY_ID=${S3_ACCESS_KEY_ID}
|
||||
@@ -46,6 +48,7 @@ services:
|
||||
- S3_FORCE_PATH_STYLE=${S3_FORCE_PATH_STYLE}
|
||||
- NEXT_PUBLIC_STORAGE_URL=${NEXT_PUBLIC_STORAGE_URL}
|
||||
- NEXT_PUBLIC_AVATAR_BUCKET_NAME=${NEXT_PUBLIC_AVATAR_BUCKET_NAME}
|
||||
- NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME=${NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME}
|
||||
- NEXT_PUBLIC_STORAGE_DOMAIN=${NEXT_PUBLIC_STORAGE_DOMAIN}
|
||||
|
||||
# Auth config
|
||||
|
||||
@@ -36,6 +36,7 @@ services:
|
||||
- S3_FORCE_PATH_STYLE=${S3_FORCE_PATH_STYLE}
|
||||
- NEXT_PUBLIC_STORAGE_URL=${NEXT_PUBLIC_STORAGE_URL}
|
||||
- NEXT_PUBLIC_AVATAR_BUCKET_NAME=${NEXT_PUBLIC_AVATAR_BUCKET_NAME}
|
||||
- NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME=${NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME}
|
||||
- NEXT_PUBLIC_STORAGE_DOMAIN=${NEXT_PUBLIC_STORAGE_DOMAIN}
|
||||
|
||||
# White label
|
||||
|
||||
@@ -35,6 +35,8 @@
|
||||
"typecheck": "tsc --noEmit --emitDeclarationOnly false"
|
||||
},
|
||||
"dependencies": {
|
||||
"@aws-sdk/client-s3": "^3.802.0",
|
||||
"@aws-sdk/s3-request-presigner": "^3.812.0",
|
||||
"@kan/auth": "workspace:*",
|
||||
"@kan/db": "workspace:*",
|
||||
"@kan/email": "workspace:^",
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import { attachmentRouter } from "./routers/attachment";
|
||||
import { boardRouter } from "./routers/board";
|
||||
import { cardRouter } from "./routers/card";
|
||||
import { checklistRouter } from "./routers/checklist";
|
||||
@@ -12,6 +13,7 @@ import { workspaceRouter } from "./routers/workspace";
|
||||
import { createTRPCRouter } from "./trpc";
|
||||
|
||||
export const appRouter = createTRPCRouter({
|
||||
attachment: attachmentRouter,
|
||||
board: boardRouter,
|
||||
card: cardRouter,
|
||||
checklist: checklistRouter,
|
||||
|
||||
205
packages/api/src/routers/attachment.ts
Normal file
@@ -0,0 +1,205 @@
|
||||
import { TRPCError } from "@trpc/server";
|
||||
import { z } from "zod";
|
||||
|
||||
import * as cardRepo from "@kan/db/repository/card.repo";
|
||||
import * as cardActivityRepo from "@kan/db/repository/cardActivity.repo";
|
||||
import * as cardAttachmentRepo from "@kan/db/repository/cardAttachment.repo";
|
||||
import * as workspaceRepo from "@kan/db/repository/workspace.repo";
|
||||
import { generateUID } from "@kan/shared/utils";
|
||||
|
||||
import { createTRPCRouter, protectedProcedure } from "../trpc";
|
||||
import { assertUserInWorkspace } from "../utils/auth";
|
||||
import { generateUploadUrl } from "../utils/s3";
|
||||
|
||||
export const attachmentRouter = createTRPCRouter({
|
||||
generateUploadUrl: protectedProcedure
|
||||
.meta({
|
||||
openapi: {
|
||||
summary: "Generate presigned URL for attachment upload",
|
||||
method: "POST",
|
||||
path: "/cards/{cardPublicId}/attachments/upload-url",
|
||||
description:
|
||||
"Generates a presigned URL for uploading an attachment to S3",
|
||||
tags: ["Attachments"],
|
||||
protect: true,
|
||||
},
|
||||
})
|
||||
.input(
|
||||
z.object({
|
||||
cardPublicId: z.string().min(12),
|
||||
filename: z.string().min(1).max(255),
|
||||
contentType: z.string(),
|
||||
size: z
|
||||
.number()
|
||||
.positive()
|
||||
.max(50 * 1024 * 1024), // 50MB max
|
||||
}),
|
||||
)
|
||||
.output(z.object({ url: z.string(), key: z.string() }))
|
||||
.mutation(async ({ ctx, input }) => {
|
||||
const userId = ctx.user?.id;
|
||||
|
||||
if (!userId)
|
||||
throw new TRPCError({
|
||||
message: `User not authenticated`,
|
||||
code: "UNAUTHORIZED",
|
||||
});
|
||||
|
||||
const card = await cardRepo.getWorkspaceAndCardIdByCardPublicId(
|
||||
ctx.db,
|
||||
input.cardPublicId,
|
||||
);
|
||||
|
||||
if (!card)
|
||||
throw new TRPCError({
|
||||
message: `Card with public ID ${input.cardPublicId} not found`,
|
||||
code: "NOT_FOUND",
|
||||
});
|
||||
|
||||
await assertUserInWorkspace(ctx.db, userId, card.workspaceId);
|
||||
|
||||
// Get workspace publicId
|
||||
const workspace = await workspaceRepo.getById(ctx.db, card.workspaceId);
|
||||
if (!workspace)
|
||||
throw new TRPCError({
|
||||
message: `Workspace not found`,
|
||||
code: "NOT_FOUND",
|
||||
});
|
||||
|
||||
const bucket = process.env.NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME;
|
||||
if (!bucket)
|
||||
throw new TRPCError({
|
||||
message: `Attachments bucket not configured`,
|
||||
code: "INTERNAL_SERVER_ERROR",
|
||||
});
|
||||
|
||||
// Sanitize filename
|
||||
const sanitizedFilename = input.filename
|
||||
.replace(/[^a-zA-Z0-9._-]/g, "_")
|
||||
.substring(0, 200);
|
||||
|
||||
const s3Key = `${workspace.publicId}/${input.cardPublicId}/${generateUID()}-${sanitizedFilename}`;
|
||||
|
||||
const url = await generateUploadUrl(
|
||||
bucket,
|
||||
s3Key,
|
||||
input.contentType,
|
||||
3600, // 1 hour
|
||||
);
|
||||
|
||||
return { url, key: s3Key };
|
||||
}),
|
||||
confirm: protectedProcedure
|
||||
.meta({
|
||||
openapi: {
|
||||
summary: "Confirm attachment upload and save to database",
|
||||
method: "POST",
|
||||
path: "/cards/{cardPublicId}/attachments/confirm",
|
||||
description:
|
||||
"Confirms an attachment upload and saves the record to the database",
|
||||
tags: ["Attachments"],
|
||||
protect: true,
|
||||
},
|
||||
})
|
||||
.input(
|
||||
z.object({
|
||||
cardPublicId: z.string().min(12),
|
||||
s3Key: z.string(),
|
||||
filename: z.string(),
|
||||
originalFilename: z.string(),
|
||||
contentType: z.string(),
|
||||
size: z.number().positive(),
|
||||
}),
|
||||
)
|
||||
.output(z.custom<Awaited<ReturnType<typeof cardAttachmentRepo.create>>>())
|
||||
.mutation(async ({ ctx, input }) => {
|
||||
const userId = ctx.user?.id;
|
||||
|
||||
if (!userId)
|
||||
throw new TRPCError({
|
||||
message: `User not authenticated`,
|
||||
code: "UNAUTHORIZED",
|
||||
});
|
||||
|
||||
const card = await cardRepo.getWorkspaceAndCardIdByCardPublicId(
|
||||
ctx.db,
|
||||
input.cardPublicId,
|
||||
);
|
||||
|
||||
if (!card)
|
||||
throw new TRPCError({
|
||||
message: `Card with public ID ${input.cardPublicId} not found`,
|
||||
code: "NOT_FOUND",
|
||||
});
|
||||
|
||||
await assertUserInWorkspace(ctx.db, userId, card.workspaceId);
|
||||
|
||||
const attachment = await cardAttachmentRepo.create(ctx.db, {
|
||||
cardId: card.id,
|
||||
filename: input.filename,
|
||||
originalFilename: input.originalFilename,
|
||||
contentType: input.contentType,
|
||||
size: input.size,
|
||||
s3Key: input.s3Key,
|
||||
createdBy: userId,
|
||||
});
|
||||
|
||||
await cardActivityRepo.create(ctx.db, {
|
||||
type: "card.updated.attachment.added",
|
||||
cardId: card.id,
|
||||
createdBy: userId,
|
||||
});
|
||||
|
||||
return attachment;
|
||||
}),
|
||||
delete: protectedProcedure
|
||||
.meta({
|
||||
openapi: {
|
||||
summary: "Delete an attachment",
|
||||
method: "DELETE",
|
||||
path: "/attachments/{attachmentPublicId}",
|
||||
description: "Soft deletes an attachment",
|
||||
tags: ["Attachments"],
|
||||
protect: true,
|
||||
},
|
||||
})
|
||||
.input(z.object({ attachmentPublicId: z.string().min(12) }))
|
||||
.output(z.object({ success: z.boolean() }))
|
||||
.mutation(async ({ ctx, input }) => {
|
||||
const userId = ctx.user?.id;
|
||||
|
||||
if (!userId)
|
||||
throw new TRPCError({
|
||||
message: `User not authenticated`,
|
||||
code: "UNAUTHORIZED",
|
||||
});
|
||||
|
||||
const attachment = await cardAttachmentRepo.getByPublicId(
|
||||
ctx.db,
|
||||
input.attachmentPublicId,
|
||||
);
|
||||
|
||||
if (!attachment || attachment.deletedAt)
|
||||
throw new TRPCError({
|
||||
message: `Attachment with public ID ${input.attachmentPublicId} not found`,
|
||||
code: "NOT_FOUND",
|
||||
});
|
||||
|
||||
const workspaceId = attachment.card.list.board.workspaceId;
|
||||
|
||||
await assertUserInWorkspace(ctx.db, userId, workspaceId);
|
||||
|
||||
await cardAttachmentRepo.softDelete(ctx.db, {
|
||||
attachmentId: attachment.id,
|
||||
deletedAt: new Date(),
|
||||
});
|
||||
|
||||
await cardActivityRepo.create(ctx.db, {
|
||||
type: "card.updated.attachment.removed",
|
||||
cardId: attachment.cardId,
|
||||
createdBy: userId,
|
||||
});
|
||||
|
||||
return { success: true };
|
||||
}),
|
||||
});
|
||||
@@ -78,6 +78,7 @@ export const boardRouter = createTRPCRouter({
|
||||
boardPublicId: z.string().min(12),
|
||||
members: z.array(z.string().min(12)).optional(),
|
||||
labels: z.array(z.string().min(12)).optional(),
|
||||
lists: z.array(z.string().min(12)).optional(),
|
||||
type: z.enum(["regular", "template"]).optional(),
|
||||
}),
|
||||
)
|
||||
@@ -110,6 +111,7 @@ export const boardRouter = createTRPCRouter({
|
||||
{
|
||||
members: input.members ?? [],
|
||||
labels: input.labels ?? [],
|
||||
lists: input.lists ?? [],
|
||||
type: input.type,
|
||||
},
|
||||
);
|
||||
@@ -142,6 +144,7 @@ export const boardRouter = createTRPCRouter({
|
||||
.regex(/^(?![-]+$)[a-zA-Z0-9-]+$/),
|
||||
members: z.array(z.string().min(12)).optional(),
|
||||
labels: z.array(z.string().min(12)).optional(),
|
||||
lists: z.array(z.string().min(12)).optional(),
|
||||
}),
|
||||
)
|
||||
.output(z.custom<Awaited<ReturnType<typeof boardRepo.getBySlug>>>())
|
||||
@@ -164,6 +167,7 @@ export const boardRouter = createTRPCRouter({
|
||||
{
|
||||
members: input.members ?? [],
|
||||
labels: input.labels ?? [],
|
||||
lists: input.lists ?? [],
|
||||
},
|
||||
);
|
||||
|
||||
@@ -234,6 +238,7 @@ export const boardRouter = createTRPCRouter({
|
||||
{
|
||||
members: [],
|
||||
labels: [],
|
||||
lists: [],
|
||||
type: sourceBoardInfo.type,
|
||||
},
|
||||
);
|
||||
|
||||
@@ -10,6 +10,7 @@ import * as workspaceRepo from "@kan/db/repository/workspace.repo";
|
||||
|
||||
import { createTRPCRouter, protectedProcedure, publicProcedure } from "../trpc";
|
||||
import { assertUserInWorkspace } from "../utils/auth";
|
||||
import { generateDownloadUrl } from "../utils/s3";
|
||||
|
||||
export const cardRouter = createTRPCRouter({
|
||||
create: protectedProcedure
|
||||
@@ -574,7 +575,21 @@ export const cardRouter = createTRPCRouter({
|
||||
.input(z.object({ cardPublicId: z.string().min(12) }))
|
||||
.output(
|
||||
z.custom<
|
||||
Awaited<ReturnType<typeof cardRepo.getWithListAndMembersByPublicId>>
|
||||
Omit<
|
||||
NonNullable<
|
||||
Awaited<ReturnType<typeof cardRepo.getWithListAndMembersByPublicId>>
|
||||
>,
|
||||
"attachments"
|
||||
> & {
|
||||
attachments: {
|
||||
publicId: string;
|
||||
contentType: string;
|
||||
s3Key: string;
|
||||
originalFilename: string | null;
|
||||
size?: number | null;
|
||||
url: string | null;
|
||||
}[];
|
||||
}
|
||||
>(),
|
||||
)
|
||||
.query(async ({ ctx, input }) => {
|
||||
@@ -612,7 +627,46 @@ export const cardRouter = createTRPCRouter({
|
||||
code: "NOT_FOUND",
|
||||
});
|
||||
|
||||
return result;
|
||||
// Generate URLs for all attachments
|
||||
const bucket = process.env.NEXT_PUBLIC_ATTACHMENTS_BUCKET_NAME;
|
||||
if (result.attachments && Array.isArray(result.attachments)) {
|
||||
const attachments = result.attachments as {
|
||||
publicId: string;
|
||||
contentType: string;
|
||||
s3Key: string;
|
||||
originalFilename: string | null;
|
||||
size?: number | null;
|
||||
}[];
|
||||
|
||||
const attachmentsWithUrls = await Promise.all(
|
||||
attachments.map(async (attachment) => {
|
||||
const base = {
|
||||
publicId: attachment.publicId,
|
||||
contentType: attachment.contentType,
|
||||
s3Key: attachment.s3Key,
|
||||
originalFilename: attachment.originalFilename,
|
||||
size: attachment.size,
|
||||
};
|
||||
if (!bucket || !attachment.s3Key) {
|
||||
return { ...base, url: null };
|
||||
}
|
||||
try {
|
||||
const url = await generateDownloadUrl(
|
||||
bucket,
|
||||
attachment.s3Key,
|
||||
86400, // 24 hours expiration
|
||||
);
|
||||
return { ...base, url };
|
||||
} catch {
|
||||
// If URL generation fails, return attachment with url: null
|
||||
return { ...base, url: null };
|
||||
}
|
||||
}),
|
||||
);
|
||||
return { ...result, attachments: attachmentsWithUrls };
|
||||
}
|
||||
|
||||
return { ...result, attachments: [] };
|
||||
}),
|
||||
update: protectedProcedure
|
||||
.meta({
|
||||
|
||||
@@ -4,6 +4,7 @@ import { z } from "zod";
|
||||
import * as boardRepo from "@kan/db/repository/board.repo";
|
||||
import * as cardRepo from "@kan/db/repository/card.repo";
|
||||
import * as cardActivityRepo from "@kan/db/repository/cardActivity.repo";
|
||||
import * as checklistRepo from "@kan/db/repository/checklist.repo";
|
||||
import * as importRepo from "@kan/db/repository/import.repo";
|
||||
import * as integrationsRepo from "@kan/db/repository/integration.repo";
|
||||
import * as labelRepo from "@kan/db/repository/label.repo";
|
||||
@@ -22,6 +23,7 @@ export interface TrelloBoard {
|
||||
labels: TrelloLabel[];
|
||||
lists: TrelloList[];
|
||||
cards: TrelloCard[];
|
||||
checklists: TrelloChecklist[];
|
||||
}
|
||||
|
||||
interface TrelloLabel {
|
||||
@@ -34,12 +36,34 @@ interface TrelloList {
|
||||
name: string;
|
||||
}
|
||||
|
||||
interface TrelloChecklist {
|
||||
id: string;
|
||||
idCard: string;
|
||||
name: string;
|
||||
checkItems: TrelloCheckItem[];
|
||||
}
|
||||
|
||||
interface TrelloCheckItem {
|
||||
id: string;
|
||||
name: string;
|
||||
state: "complete" | "incomplete";
|
||||
pos: number;
|
||||
}
|
||||
|
||||
interface TrelloCard {
|
||||
id: string;
|
||||
name: string;
|
||||
desc: string;
|
||||
idList: string;
|
||||
labels: TrelloLabel[];
|
||||
idChecklists: string[];
|
||||
checkItemStates: TrelloCheckItemState[];
|
||||
}
|
||||
|
||||
interface TrelloCheckItemState {
|
||||
idChecklist: string;
|
||||
idCheckItem: string;
|
||||
state: "complete" | "incomplete";
|
||||
}
|
||||
|
||||
export const importRouter = createTRPCRouter({
|
||||
@@ -170,7 +194,7 @@ export const importRouter = createTRPCRouter({
|
||||
|
||||
for (const boardId of input.boardIds) {
|
||||
const response = await fetch(
|
||||
`${urls.trello}/boards/${boardId}?key=${apiKey}&token=${integration.accessToken}&lists=open&cards=open&labels=all`,
|
||||
`${urls.trello}/boards/${boardId}?key=${apiKey}&token=${integration.accessToken}&lists=open&cards=open&labels=all&checklists=all&checkItemStates=all`,
|
||||
);
|
||||
const data = (await response.json()) as TrelloBoard;
|
||||
|
||||
@@ -194,6 +218,18 @@ export const importRouter = createTRPCRouter({
|
||||
sourceId: label.id,
|
||||
name: label.name,
|
||||
})),
|
||||
checklists: data.checklists
|
||||
.filter((checklist) => checklist.idCard === _card.id)
|
||||
.map((_checklist) => ({
|
||||
sourceId: _checklist.id,
|
||||
name: _checklist.name,
|
||||
items: _checklist.checkItems.map((_item) => ({
|
||||
sourceId: _item.id,
|
||||
title: _item.name,
|
||||
completed: _item.state === "complete",
|
||||
index: _item.pos,
|
||||
})),
|
||||
})),
|
||||
})),
|
||||
})),
|
||||
};
|
||||
@@ -289,6 +325,97 @@ export const importRouter = createTRPCRouter({
|
||||
await cardActivityRepo.bulkCreate(ctx.db, activities);
|
||||
}
|
||||
|
||||
const checklistsToCreate: {
|
||||
cardId: number;
|
||||
name: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
sourceId: string;
|
||||
items: {
|
||||
sourceId: string;
|
||||
title: string;
|
||||
completed: boolean;
|
||||
index: number;
|
||||
}[];
|
||||
}[] = [];
|
||||
|
||||
for (const card of list.cards) {
|
||||
const _card = createdCards.find(
|
||||
(c) => c.sourceId === card.sourceId,
|
||||
);
|
||||
|
||||
if (!_card || !card.checklists.length) continue;
|
||||
|
||||
for (
|
||||
let checklistIndex = 0;
|
||||
checklistIndex < card.checklists.length;
|
||||
checklistIndex++
|
||||
) {
|
||||
const checklist = card.checklists[checklistIndex];
|
||||
if (!checklist) continue;
|
||||
|
||||
checklistsToCreate.push({
|
||||
cardId: _card.id,
|
||||
name: checklist.name,
|
||||
createdBy: userId,
|
||||
index: checklistIndex,
|
||||
sourceId: checklist.sourceId,
|
||||
items: checklist.items.map((item) => ({
|
||||
sourceId: item.sourceId,
|
||||
title: item.title,
|
||||
completed: item.completed,
|
||||
index: item.index,
|
||||
})),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (checklistsToCreate.length > 0) {
|
||||
const newChecklists = await checklistRepo.bulkCreate(
|
||||
ctx.db,
|
||||
checklistsToCreate.map((checklist) => ({
|
||||
cardId: checklist.cardId,
|
||||
name: checklist.name,
|
||||
createdBy: checklist.createdBy,
|
||||
index: checklist.index,
|
||||
})),
|
||||
);
|
||||
|
||||
const itemsToCreate: {
|
||||
checklistId: number;
|
||||
title: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
completed: boolean;
|
||||
}[] = [];
|
||||
|
||||
for (let i = 0; i < checklistsToCreate.length; i++) {
|
||||
const checklistData = checklistsToCreate[i];
|
||||
const newChecklist = newChecklists[i];
|
||||
|
||||
if (!newChecklist || !checklistData?.items.length) continue;
|
||||
|
||||
// NOTE: Sorting here to prevent checklist items being out of order
|
||||
const sortedItems = [...checklistData.items].sort(
|
||||
(a, b) => a.index - b.index,
|
||||
);
|
||||
|
||||
for (const item of sortedItems) {
|
||||
itemsToCreate.push({
|
||||
checklistId: newChecklist.id,
|
||||
title: item.title,
|
||||
createdBy: userId,
|
||||
index: item.index,
|
||||
completed: item.completed,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
if (itemsToCreate.length > 0) {
|
||||
await checklistRepo.bulkCreateItems(ctx.db, itemsToCreate);
|
||||
}
|
||||
}
|
||||
|
||||
if (createdLabels.length && createdCards.length) {
|
||||
const cardLabelRelations: {
|
||||
cardId: number;
|
||||
|
||||
@@ -476,7 +476,7 @@ export const memberRouter = createTRPCRouter({
|
||||
openapi: {
|
||||
summary: "Get invite information by code",
|
||||
method: "GET",
|
||||
path: "/workspaces/{workspacePublicId}/invites/{inviteCode}",
|
||||
path: "/invites/{inviteCode}",
|
||||
description: "Get invite information by invite code",
|
||||
tags: ["Invites"],
|
||||
protect: false,
|
||||
@@ -521,7 +521,7 @@ export const memberRouter = createTRPCRouter({
|
||||
openapi: {
|
||||
summary: "Accept an invite link",
|
||||
method: "POST",
|
||||
path: "/workspaces/{workspacePublicId}/invites/accept",
|
||||
path: "/invites/accept",
|
||||
description: "Accepts an invitation via invite link",
|
||||
tags: ["Invites"],
|
||||
protect: false,
|
||||
|
||||
@@ -139,7 +139,7 @@ export const workspaceRouter = createTRPCRouter({
|
||||
})
|
||||
.input(
|
||||
z.object({
|
||||
name: z.string().min(1),
|
||||
name: z.string().min(1).max(64),
|
||||
slug: z
|
||||
.string()
|
||||
.min(3)
|
||||
@@ -222,7 +222,7 @@ export const workspaceRouter = createTRPCRouter({
|
||||
.input(
|
||||
z.object({
|
||||
workspacePublicId: z.string().min(12),
|
||||
name: z.string().min(3).max(24).optional(),
|
||||
name: z.string().min(3).max(64).optional(),
|
||||
slug: z
|
||||
.string()
|
||||
.min(3)
|
||||
|
||||
53
packages/api/src/utils/s3.ts
Normal file
@@ -0,0 +1,53 @@
|
||||
import {
|
||||
GetObjectCommand,
|
||||
PutObjectCommand,
|
||||
S3Client,
|
||||
} from "@aws-sdk/client-s3";
|
||||
import { getSignedUrl } from "@aws-sdk/s3-request-presigner";
|
||||
|
||||
export function createS3Client() {
|
||||
return new S3Client({
|
||||
region: process.env.S3_REGION ?? "",
|
||||
endpoint: process.env.S3_ENDPOINT ?? "",
|
||||
forcePathStyle: process.env.S3_FORCE_PATH_STYLE === "true",
|
||||
credentials: {
|
||||
accessKeyId: process.env.S3_ACCESS_KEY_ID ?? "",
|
||||
secretAccessKey: process.env.S3_SECRET_ACCESS_KEY ?? "",
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
export async function generateUploadUrl(
|
||||
bucket: string,
|
||||
key: string,
|
||||
contentType: string,
|
||||
expiresIn = 3600,
|
||||
) {
|
||||
const client = createS3Client();
|
||||
return getSignedUrl(
|
||||
client,
|
||||
new PutObjectCommand({
|
||||
Bucket: bucket,
|
||||
Key: key,
|
||||
ContentType: contentType,
|
||||
// Don't set ACL for private files
|
||||
}),
|
||||
{ expiresIn },
|
||||
);
|
||||
}
|
||||
|
||||
export async function generateDownloadUrl(
|
||||
bucket: string,
|
||||
key: string,
|
||||
expiresIn = 3600,
|
||||
) {
|
||||
const client = createS3Client();
|
||||
return getSignedUrl(
|
||||
client,
|
||||
new GetObjectCommand({
|
||||
Bucket: bucket,
|
||||
Key: key,
|
||||
}),
|
||||
{ expiresIn },
|
||||
);
|
||||
}
|
||||
@@ -1,5 +1,8 @@
|
||||
import type { Subscription } from "@better-auth/stripe";
|
||||
import type Stripe from "stripe";
|
||||
import { PutObjectCommand, S3Client } from "@aws-sdk/client-s3";
|
||||
import { stripe } from "@better-auth/stripe";
|
||||
import { ChatOrPushProviderEnum } from "@novu/api/models/components";
|
||||
import { betterAuth } from "better-auth";
|
||||
import { drizzleAdapter } from "better-auth/adapters/drizzle";
|
||||
import { createAuthEndpoint, createAuthMiddleware } from "better-auth/api";
|
||||
@@ -14,7 +17,7 @@ import * as subscriptionRepo from "@kan/db/repository/subscription.repo";
|
||||
import * as userRepo from "@kan/db/repository/user.repo";
|
||||
import * as workspaceRepo from "@kan/db/repository/workspace.repo";
|
||||
import * as schema from "@kan/db/schema";
|
||||
import { cloudMailerClient, sendEmail } from "@kan/email";
|
||||
import { notificationClient, sendEmail } from "@kan/email";
|
||||
import { createStripeClient } from "@kan/stripe";
|
||||
|
||||
export const configuredProviders = socialProviderList.reduce<
|
||||
@@ -129,6 +132,11 @@ export const initAuth = (db: dbClient) => {
|
||||
user: schema.users,
|
||||
},
|
||||
}),
|
||||
session: {
|
||||
expiresIn: 60 * 60 * 24 * 30, // 30 days
|
||||
updateAge: 60 * 60 * 24 * 2, // Update session expiry every 48 hours if user is active
|
||||
freshAge: 0,
|
||||
},
|
||||
emailAndPassword: {
|
||||
enabled: env("NEXT_PUBLIC_ALLOW_CREDENTIALS")?.toLowerCase() === "true",
|
||||
disableSignUp:
|
||||
@@ -170,12 +178,44 @@ export const initAuth = (db: dbClient) => {
|
||||
priceId: process.env.STRIPE_TEAM_PLAN_MONTHLY_PRICE_ID!,
|
||||
annualDiscountPriceId:
|
||||
process.env.STRIPE_TEAM_PLAN_YEARLY_PRICE_ID!,
|
||||
freeTrial: {
|
||||
days: 14,
|
||||
onTrialStart: async (subscription) => {
|
||||
await triggerWorkflow(db, "trial-start", subscription);
|
||||
},
|
||||
onTrialEnd: async ({ subscription }) => {
|
||||
await triggerWorkflow(db, "trial-end", subscription);
|
||||
},
|
||||
onTrialExpired: async (subscription) => {
|
||||
await triggerWorkflow(
|
||||
db,
|
||||
"trial-expired",
|
||||
subscription,
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "pro",
|
||||
priceId: process.env.STRIPE_PRO_PLAN_MONTHLY_PRICE_ID!,
|
||||
annualDiscountPriceId:
|
||||
process.env.STRIPE_PRO_PLAN_YEARLY_PRICE_ID!,
|
||||
freeTrial: {
|
||||
days: 14,
|
||||
onTrialStart: async (subscription) => {
|
||||
await triggerWorkflow(db, "trial-start", subscription);
|
||||
},
|
||||
onTrialEnd: async ({ subscription }) => {
|
||||
await triggerWorkflow(db, "trial-end", subscription);
|
||||
},
|
||||
onTrialExpired: async (subscription) => {
|
||||
await triggerWorkflow(
|
||||
db,
|
||||
"trial-expired",
|
||||
subscription,
|
||||
);
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
authorizeReference: async (data) => {
|
||||
@@ -307,17 +347,7 @@ export const initAuth = (db: dbClient) => {
|
||||
return Promise.resolve(true);
|
||||
},
|
||||
async after(user) {
|
||||
if (cloudMailerClient) {
|
||||
await cloudMailerClient.events.track({
|
||||
event: "user-signup",
|
||||
email: user.email,
|
||||
data: {
|
||||
name: user.name,
|
||||
userId: user.id,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
let avatarKey = user.image;
|
||||
if (
|
||||
user.image &&
|
||||
!user.image.includes(process.env.NEXT_PUBLIC_STORAGE_DOMAIN!)
|
||||
@@ -350,6 +380,9 @@ export const initAuth = (db: dbClient) => {
|
||||
ACL: "public-read",
|
||||
}),
|
||||
);
|
||||
|
||||
avatarKey = key;
|
||||
|
||||
await userRepo.update(db, user.id, {
|
||||
image: key,
|
||||
});
|
||||
@@ -357,6 +390,51 @@ export const initAuth = (db: dbClient) => {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
if (notificationClient) {
|
||||
try {
|
||||
const [firstName, ...rest] = user.name
|
||||
.split(" ")
|
||||
.filter(Boolean);
|
||||
const lastName = rest.length ? rest.join(" ") : undefined;
|
||||
const avatarUrl = avatarKey
|
||||
? `${env("NEXT_PUBLIC_STORAGE_URL")}/${env("NEXT_PUBLIC_AVATAR_BUCKET_NAME")}/${avatarKey}`
|
||||
: undefined;
|
||||
|
||||
await notificationClient.trigger({
|
||||
to: {
|
||||
subscriberId: user.id,
|
||||
firstName: firstName,
|
||||
lastName: lastName,
|
||||
email: user.email,
|
||||
avatar: avatarUrl,
|
||||
data: {
|
||||
emailVerified: user.emailVerified,
|
||||
stripeCustomerId: user.stripeCustomerId,
|
||||
createdAt: user.createdAt,
|
||||
updatedAt: user.updatedAt,
|
||||
},
|
||||
},
|
||||
workflowId: "user-signup",
|
||||
});
|
||||
|
||||
await notificationClient.subscribers.credentials.update(
|
||||
{
|
||||
providerId: ChatOrPushProviderEnum.Discord,
|
||||
credentials: {
|
||||
webhookUrl: process.env.DISCORD_WEBHOOK_URL!,
|
||||
},
|
||||
integrationIdentifier: "discord",
|
||||
},
|
||||
user.id,
|
||||
);
|
||||
} catch (error) {
|
||||
console.error(
|
||||
"Error adding user to notification client",
|
||||
error,
|
||||
);
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
@@ -394,3 +472,34 @@ export const initAuth = (db: dbClient) => {
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
async function triggerWorkflow(
|
||||
db: dbClient,
|
||||
workflowId: string,
|
||||
subscription: Subscription,
|
||||
cancellationDetails?: Stripe.Subscription.CancellationDetails | null,
|
||||
) {
|
||||
try {
|
||||
if (!subscription.stripeCustomerId || !notificationClient) return;
|
||||
|
||||
const user = await userRepo.getByStripeCustomerId(
|
||||
db,
|
||||
subscription.stripeCustomerId,
|
||||
);
|
||||
|
||||
if (!user || !notificationClient) return;
|
||||
|
||||
await notificationClient.trigger({
|
||||
to: {
|
||||
subscriberId: user.id,
|
||||
},
|
||||
payload: {
|
||||
...subscription,
|
||||
cancellationDetails,
|
||||
},
|
||||
workflowId,
|
||||
});
|
||||
} catch (error) {
|
||||
console.error("Error triggering workflow", error);
|
||||
}
|
||||
}
|
||||
|
||||
29
packages/db/migrations/20251110204423_AddCardAttachments.sql
Normal file
@@ -0,0 +1,29 @@
|
||||
ALTER TYPE "public"."card_activity_type" ADD VALUE 'card.updated.attachment.added' BEFORE 'card.archived';--> statement-breakpoint
|
||||
ALTER TYPE "public"."card_activity_type" ADD VALUE 'card.updated.attachment.removed' BEFORE 'card.archived';--> statement-breakpoint
|
||||
CREATE TABLE IF NOT EXISTS "card_attachment" (
|
||||
"id" bigserial PRIMARY KEY NOT NULL,
|
||||
"publicId" varchar(12) NOT NULL,
|
||||
"cardId" bigint NOT NULL,
|
||||
"filename" varchar(255) NOT NULL,
|
||||
"originalFilename" varchar(255) NOT NULL,
|
||||
"contentType" varchar(100) NOT NULL,
|
||||
"size" bigint NOT NULL,
|
||||
"s3Key" varchar(500) NOT NULL,
|
||||
"createdBy" uuid,
|
||||
"createdAt" timestamp DEFAULT now() NOT NULL,
|
||||
"deletedAt" timestamp,
|
||||
CONSTRAINT "card_attachment_publicId_unique" UNIQUE("publicId")
|
||||
);
|
||||
--> statement-breakpoint
|
||||
ALTER TABLE "card_attachment" ENABLE ROW LEVEL SECURITY;--> statement-breakpoint
|
||||
DO $$ BEGIN
|
||||
ALTER TABLE "card_attachment" ADD CONSTRAINT "card_attachment_cardId_card_id_fk" FOREIGN KEY ("cardId") REFERENCES "public"."card"("id") ON DELETE cascade ON UPDATE no action;
|
||||
EXCEPTION
|
||||
WHEN duplicate_object THEN null;
|
||||
END $$;
|
||||
--> statement-breakpoint
|
||||
DO $$ BEGIN
|
||||
ALTER TABLE "card_attachment" ADD CONSTRAINT "card_attachment_createdBy_user_id_fk" FOREIGN KEY ("createdBy") REFERENCES "public"."user"("id") ON DELETE set null ON UPDATE no action;
|
||||
EXCEPTION
|
||||
WHEN duplicate_object THEN null;
|
||||
END $$;
|
||||
2954
packages/db/migrations/meta/20251110204423_snapshot.json
Normal file
@@ -134,6 +134,13 @@
|
||||
"when": 1760044396109,
|
||||
"tag": "20251009211316_AddBoardSourceIdToCardActivity",
|
||||
"breakpoints": true
|
||||
},
|
||||
{
|
||||
"idx": 19,
|
||||
"version": "7",
|
||||
"when": 1762807463569,
|
||||
"tag": "20251110204423_AddCardAttachments",
|
||||
"breakpoints": true
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -5,6 +5,7 @@ import type { BoardVisibilityStatus } from "@kan/db/schema";
|
||||
import {
|
||||
boards,
|
||||
cardActivities,
|
||||
cardAttachments,
|
||||
cards,
|
||||
cardsToLabels,
|
||||
cardToWorkspaceMembers,
|
||||
@@ -70,6 +71,7 @@ export const getByPublicId = async (
|
||||
filters: {
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
type: "regular" | "template" | undefined;
|
||||
},
|
||||
) => {
|
||||
@@ -195,6 +197,13 @@ export const getByPublicId = async (
|
||||
},
|
||||
},
|
||||
},
|
||||
attachments: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
},
|
||||
where: isNull(cardAttachments.deletedAt),
|
||||
orderBy: asc(cardAttachments.createdAt),
|
||||
},
|
||||
checklists: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
@@ -231,6 +240,19 @@ export const getByPublicId = async (
|
||||
orderBy: [asc(cards.index)],
|
||||
},
|
||||
},
|
||||
where: and(
|
||||
isNull(lists.deletedAt),
|
||||
filters.lists.length > 0
|
||||
? inArray(lists.publicId, filters.lists)
|
||||
: undefined,
|
||||
),
|
||||
orderBy: [asc(lists.index)],
|
||||
},
|
||||
allLists: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
name: true,
|
||||
},
|
||||
where: isNull(lists.deletedAt),
|
||||
orderBy: [asc(lists.index)],
|
||||
},
|
||||
@@ -268,6 +290,7 @@ export const getBySlug = async (
|
||||
filters: {
|
||||
members: string[];
|
||||
labels: string[];
|
||||
lists: string[];
|
||||
},
|
||||
) => {
|
||||
let cardIds: string[] = [];
|
||||
@@ -343,6 +366,13 @@ export const getBySlug = async (
|
||||
},
|
||||
},
|
||||
},
|
||||
attachments: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
},
|
||||
where: isNull(cardAttachments.deletedAt),
|
||||
orderBy: asc(cardAttachments.createdAt),
|
||||
},
|
||||
comments: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
@@ -379,6 +409,19 @@ export const getBySlug = async (
|
||||
orderBy: [asc(cards.index)],
|
||||
},
|
||||
},
|
||||
where: and(
|
||||
isNull(lists.deletedAt),
|
||||
filters.lists.length > 0
|
||||
? inArray(lists.publicId, filters.lists)
|
||||
: undefined,
|
||||
),
|
||||
orderBy: [asc(lists.index)],
|
||||
},
|
||||
allLists: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
name: true,
|
||||
},
|
||||
where: isNull(lists.deletedAt),
|
||||
orderBy: [asc(lists.index)],
|
||||
},
|
||||
|
||||
@@ -3,6 +3,7 @@ import { and, asc, desc, eq, gt, inArray, isNull, sql } from "drizzle-orm";
|
||||
import type { dbClient } from "@kan/db/client";
|
||||
import {
|
||||
cardActivities,
|
||||
cardAttachments,
|
||||
cards,
|
||||
cardsToLabels,
|
||||
cardToWorkspaceMembers,
|
||||
@@ -409,6 +410,17 @@ export const getWithListAndMembersByPublicId = async (
|
||||
},
|
||||
},
|
||||
},
|
||||
attachments: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
contentType: true,
|
||||
s3Key: true,
|
||||
originalFilename: true,
|
||||
size: true,
|
||||
},
|
||||
where: isNull(cardAttachments.deletedAt),
|
||||
orderBy: asc(cardAttachments.createdAt),
|
||||
},
|
||||
checklists: {
|
||||
columns: {
|
||||
publicId: true,
|
||||
|
||||
99
packages/db/src/repository/cardAttachment.repo.ts
Normal file
@@ -0,0 +1,99 @@
|
||||
import { and, eq, isNull } from "drizzle-orm";
|
||||
|
||||
import type { dbClient } from "@kan/db/client";
|
||||
import { cardAttachments } from "@kan/db/schema";
|
||||
import { generateUID } from "@kan/shared/utils";
|
||||
|
||||
export const create = async (
|
||||
db: dbClient,
|
||||
attachmentInput: {
|
||||
cardId: number;
|
||||
filename: string;
|
||||
originalFilename: string;
|
||||
contentType: string;
|
||||
size: number;
|
||||
s3Key: string;
|
||||
createdBy: string;
|
||||
},
|
||||
) => {
|
||||
const [result] = await db
|
||||
.insert(cardAttachments)
|
||||
.values({
|
||||
publicId: generateUID(),
|
||||
cardId: attachmentInput.cardId,
|
||||
filename: attachmentInput.filename,
|
||||
originalFilename: attachmentInput.originalFilename,
|
||||
contentType: attachmentInput.contentType,
|
||||
size: attachmentInput.size,
|
||||
s3Key: attachmentInput.s3Key,
|
||||
createdBy: attachmentInput.createdBy,
|
||||
})
|
||||
.returning({
|
||||
id: cardAttachments.id,
|
||||
publicId: cardAttachments.publicId,
|
||||
filename: cardAttachments.filename,
|
||||
originalFilename: cardAttachments.originalFilename,
|
||||
contentType: cardAttachments.contentType,
|
||||
size: cardAttachments.size,
|
||||
s3Key: cardAttachments.s3Key,
|
||||
createdBy: cardAttachments.createdBy,
|
||||
createdAt: cardAttachments.createdAt,
|
||||
});
|
||||
|
||||
return result;
|
||||
};
|
||||
|
||||
export const getByPublicId = (db: dbClient, publicId: string) => {
|
||||
return db.query.cardAttachments.findFirst({
|
||||
where: eq(cardAttachments.publicId, publicId),
|
||||
with: {
|
||||
card: {
|
||||
columns: {
|
||||
id: true,
|
||||
publicId: true,
|
||||
},
|
||||
with: {
|
||||
list: {
|
||||
columns: {
|
||||
id: true,
|
||||
},
|
||||
with: {
|
||||
board: {
|
||||
columns: {
|
||||
id: true,
|
||||
workspaceId: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const getAllByCardId = (db: dbClient, cardId: number) => {
|
||||
return db.query.cardAttachments.findMany({
|
||||
where: and(
|
||||
eq(cardAttachments.cardId, cardId),
|
||||
isNull(cardAttachments.deletedAt),
|
||||
),
|
||||
orderBy: (attachments, { desc }) => [desc(attachments.createdAt)],
|
||||
});
|
||||
};
|
||||
|
||||
export const softDelete = async (
|
||||
db: dbClient,
|
||||
args: {
|
||||
attachmentId: number;
|
||||
deletedAt: Date;
|
||||
},
|
||||
) => {
|
||||
const [result] = await db
|
||||
.update(cardAttachments)
|
||||
.set({ deletedAt: args.deletedAt })
|
||||
.where(eq(cardAttachments.id, args.attachmentId))
|
||||
.returning({ id: cardAttachments.id });
|
||||
|
||||
return result;
|
||||
};
|
||||
@@ -46,6 +46,7 @@ export const createItem = async (
|
||||
checklistId: number;
|
||||
title: string;
|
||||
createdBy: string;
|
||||
completed?: boolean;
|
||||
},
|
||||
) => {
|
||||
return db.transaction(async (tx) => {
|
||||
@@ -65,7 +66,7 @@ export const createItem = async (
|
||||
createdBy: checklistItemInput.createdBy,
|
||||
checklistId: checklistItemInput.checklistId,
|
||||
index: lastItem ? lastItem.index + 1 : 0,
|
||||
completed: false,
|
||||
completed: checklistItemInput.completed ?? false,
|
||||
})
|
||||
.returning({
|
||||
id: checklistItems.id,
|
||||
@@ -214,3 +215,129 @@ export const updateChecklistById = async (
|
||||
.returning({ publicId: checklists.publicId, name: checklists.name });
|
||||
return result;
|
||||
};
|
||||
|
||||
export const bulkCreate = async (
|
||||
db: dbClient,
|
||||
checklistInput: {
|
||||
cardId: number;
|
||||
name: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
}[],
|
||||
) => {
|
||||
if (checklistInput.length === 0) return [];
|
||||
|
||||
return db.transaction(async (tx) => {
|
||||
const byCard = groupByKey(checklistInput, "cardId");
|
||||
|
||||
const allValuesToInsert: {
|
||||
publicId: string;
|
||||
cardId: number;
|
||||
name: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
}[] = [];
|
||||
|
||||
for (const [cardId, items] of byCard.entries()) {
|
||||
const last = await tx.query.checklists.findFirst({
|
||||
columns: { index: true },
|
||||
where: and(eq(checklists.cardId, cardId), isNull(checklists.deletedAt)),
|
||||
orderBy: [desc(checklists.index)],
|
||||
});
|
||||
|
||||
let nextIndex = last ? last.index + 1 : 0;
|
||||
|
||||
const sorted = [...items].sort((a, b) => a.index - b.index);
|
||||
|
||||
for (const item of sorted) {
|
||||
allValuesToInsert.push({
|
||||
publicId: generateUID(),
|
||||
...item,
|
||||
index: nextIndex++,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const inserted = await tx
|
||||
.insert(checklists)
|
||||
.values(allValuesToInsert)
|
||||
.returning({ id: checklists.id, publicId: checklists.publicId });
|
||||
|
||||
return inserted;
|
||||
});
|
||||
};
|
||||
|
||||
export const bulkCreateItems = async (
|
||||
db: dbClient,
|
||||
checklistItemInput: {
|
||||
checklistId: number;
|
||||
title: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
completed: boolean;
|
||||
}[],
|
||||
) => {
|
||||
if (checklistItemInput.length === 0) return [];
|
||||
|
||||
return db.transaction(async (tx) => {
|
||||
const byChecklist = groupByKey(checklistItemInput, "checklistId");
|
||||
|
||||
const allValuesToInsert: {
|
||||
publicId: string;
|
||||
checklistId: number;
|
||||
title: string;
|
||||
createdBy: string;
|
||||
index: number;
|
||||
completed: boolean;
|
||||
}[] = [];
|
||||
|
||||
for (const [checklistId, items] of byChecklist.entries()) {
|
||||
const last = await tx.query.checklistItems.findFirst({
|
||||
columns: { index: true },
|
||||
where: and(
|
||||
eq(checklistItems.checklistId, checklistId),
|
||||
isNull(checklistItems.deletedAt),
|
||||
),
|
||||
orderBy: [desc(checklistItems.index)],
|
||||
});
|
||||
|
||||
let nextIndex = last ? last.index + 1 : 0;
|
||||
|
||||
const sorted = [...items].sort((a, b) => a.index - b.index);
|
||||
|
||||
for (const item of sorted) {
|
||||
allValuesToInsert.push({
|
||||
publicId: generateUID(),
|
||||
...item,
|
||||
index: nextIndex++,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const inserted = await tx
|
||||
.insert(checklistItems)
|
||||
.values(allValuesToInsert)
|
||||
.returning({
|
||||
id: checklistItems.id,
|
||||
publicId: checklistItems.publicId,
|
||||
title: checklistItems.title,
|
||||
completed: checklistItems.completed,
|
||||
});
|
||||
|
||||
return inserted;
|
||||
});
|
||||
};
|
||||
|
||||
const groupByKey = <T extends Record<string, unknown>>(
|
||||
items: T[],
|
||||
keyField: keyof T,
|
||||
): Map<number, T[]> => {
|
||||
const grouped = new Map<number, T[]>();
|
||||
for (const item of items) {
|
||||
const key = item[keyField] as number;
|
||||
const arr = grouped.get(key) ?? [];
|
||||
arr.push(item);
|
||||
grouped.set(key, arr);
|
||||
}
|
||||
return grouped;
|
||||
};
|
||||
|
||||
@@ -28,6 +28,15 @@ export const getById = async (db: dbClient, userId: string) => {
|
||||
});
|
||||
};
|
||||
|
||||
export const getByStripeCustomerId = async (
|
||||
db: dbClient,
|
||||
stripeCustomerId: string,
|
||||
) => {
|
||||
return await db.query.users.findFirst({
|
||||
where: eq(users.stripeCustomerId, stripeCustomerId),
|
||||
});
|
||||
};
|
||||
|
||||
export const getByEmail = (db: dbClient, email: string) => {
|
||||
return db.query.users.findFirst({
|
||||
columns: {
|
||||
|
||||
@@ -73,6 +73,7 @@ export const boardsRelations = relations(boards, ({ one, many }) => ({
|
||||
relationName: "boardCreatedByUser",
|
||||
}),
|
||||
lists: many(lists),
|
||||
allLists: many(lists),
|
||||
labels: many(labels),
|
||||
deletedBy: one(users, {
|
||||
fields: [boards.deletedBy],
|
||||
|
||||
@@ -42,6 +42,8 @@ export const activityTypes = [
|
||||
"card.updated.checklist.item.completed",
|
||||
"card.updated.checklist.item.uncompleted",
|
||||
"card.updated.checklist.item.deleted",
|
||||
"card.updated.attachment.added",
|
||||
"card.updated.attachment.removed",
|
||||
"card.archived",
|
||||
] as const;
|
||||
|
||||
@@ -96,6 +98,7 @@ export const cardsRelations = relations(cards, ({ one, many }) => ({
|
||||
comments: many(comments),
|
||||
activities: many(cardActivities),
|
||||
checklists: many(checklists),
|
||||
attachments: many(cardAttachments),
|
||||
}));
|
||||
|
||||
export const cardActivities = pgTable("card_activity", {
|
||||
@@ -273,3 +276,37 @@ export const commentsRelations = relations(comments, ({ one }) => ({
|
||||
relationName: "commentsDeletedByUser",
|
||||
}),
|
||||
}));
|
||||
|
||||
export const cardAttachments = pgTable("card_attachment", {
|
||||
id: bigserial("id", { mode: "number" }).primaryKey(),
|
||||
publicId: varchar("publicId", { length: 12 }).notNull().unique(),
|
||||
cardId: bigint("cardId", { mode: "number" })
|
||||
.notNull()
|
||||
.references(() => cards.id, { onDelete: "cascade" }),
|
||||
filename: varchar("filename", { length: 255 }).notNull(),
|
||||
originalFilename: varchar("originalFilename", { length: 255 }).notNull(),
|
||||
contentType: varchar("contentType", { length: 100 }).notNull(),
|
||||
size: bigint("size", { mode: "number" }).notNull(),
|
||||
s3Key: varchar("s3Key", { length: 500 }).notNull(),
|
||||
createdBy: uuid("createdBy").references(() => users.id, {
|
||||
onDelete: "set null",
|
||||
}),
|
||||
createdAt: timestamp("createdAt").defaultNow().notNull(),
|
||||
deletedAt: timestamp("deletedAt"),
|
||||
}).enableRLS();
|
||||
|
||||
export const cardAttachmentsRelations = relations(
|
||||
cardAttachments,
|
||||
({ one }) => ({
|
||||
card: one(cards, {
|
||||
fields: [cardAttachments.cardId],
|
||||
references: [cards.id],
|
||||
relationName: "cardAttachmentsCard",
|
||||
}),
|
||||
createdBy: one(users, {
|
||||
fields: [cardAttachments.createdBy],
|
||||
references: [users.id],
|
||||
relationName: "cardAttachmentsCreatedByUser",
|
||||
}),
|
||||
}),
|
||||
);
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
"typecheck": "tsc --noEmit --emitDeclarationOnly false"
|
||||
},
|
||||
"dependencies": {
|
||||
"@plunk/node": "^3.0.3",
|
||||
"@novu/api": "^3.11.0",
|
||||
"@react-email/components": "^0.0.25",
|
||||
"nodemailer": "^7.0.3",
|
||||
"react-email": "^3.0.1"
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
import Plunk from "@plunk/node";
|
||||
|
||||
export const cloudMailerClient =
|
||||
process.env.NEXT_PUBLIC_KAN_ENV === "cloud" &&
|
||||
process.env.PLUNK_API_KEY &&
|
||||
process.env.PLUNK_API_URL
|
||||
? new Plunk(process.env.PLUNK_API_KEY ?? "", {
|
||||
baseUrl: process.env.PLUNK_API_URL,
|
||||
})
|
||||
: null;
|
||||
@@ -1,4 +1,4 @@
|
||||
export const name = "email";
|
||||
|
||||
export { sendEmail } from "./sendEmail";
|
||||
export { cloudMailerClient } from "./cloudMailerClient";
|
||||
export { notificationClient } from "./notificationClient";
|
||||
|
||||
6
packages/email/src/notificationClient.tsx
Normal file
@@ -0,0 +1,6 @@
|
||||
import { Novu } from "@novu/api";
|
||||
|
||||
export const notificationClient =
|
||||
process.env.NEXT_PUBLIC_KAN_ENV === "cloud" && process.env.NOVU_API_KEY
|
||||
? new Novu({ secretKey: process.env.NOVU_API_KEY })
|
||||
: null;
|
||||
@@ -1,7 +1,6 @@
|
||||
import { render } from "@react-email/render";
|
||||
import nodemailer from "nodemailer";
|
||||
|
||||
import { cloudMailerClient } from "./cloudMailerClient";
|
||||
import JoinWorkspaceTemplate from "./templates/join-workspace";
|
||||
import MagicLinkTemplate from "./templates/magic-link";
|
||||
import ResetPasswordTemplate from "./templates/reset-password";
|
||||
@@ -45,15 +44,6 @@ export const sendEmail = async (
|
||||
html,
|
||||
};
|
||||
|
||||
// if (cloudMailerClient) {
|
||||
// const response = await cloudMailerClient.emails.send({
|
||||
// ...options,
|
||||
// body: html,
|
||||
// });
|
||||
|
||||
// return response;
|
||||
// }
|
||||
|
||||
const response = await transporter.sendMail(options);
|
||||
|
||||
if (!response.accepted.length) {
|
||||
|
||||
@@ -71,4 +71,13 @@ export const updateSubscriptionSeats = async (
|
||||
return updatedSubscription;
|
||||
};
|
||||
|
||||
export const getCancellationDetails = async (
|
||||
stripeSubscriptionId: string,
|
||||
): Promise<Stripe.Subscription.CancellationDetails | null> => {
|
||||
const stripe = createStripeClient();
|
||||
const stripeSubscription =
|
||||
await stripe.subscriptions.retrieve(stripeSubscriptionId);
|
||||
return stripeSubscription.cancellation_details ?? null;
|
||||
};
|
||||
|
||||
export { createStripeClient };
|
||||
|
||||
67
pnpm-lock.yaml
generated
@@ -223,6 +223,9 @@ importers:
|
||||
tippy.js:
|
||||
specifier: ^6.3.7
|
||||
version: 6.3.7
|
||||
tiptap-markdown:
|
||||
specifier: ^0.8
|
||||
version: 0.8.10(@tiptap/core@2.26.1(@tiptap/pm@2.26.1))
|
||||
zod:
|
||||
specifier: 'catalog:'
|
||||
version: 3.25.76
|
||||
@@ -290,6 +293,12 @@ importers:
|
||||
|
||||
packages/api:
|
||||
dependencies:
|
||||
'@aws-sdk/client-s3':
|
||||
specifier: ^3.802.0
|
||||
version: 3.879.0
|
||||
'@aws-sdk/s3-request-presigner':
|
||||
specifier: ^3.812.0
|
||||
version: 3.879.0
|
||||
'@kan/auth':
|
||||
specifier: workspace:*
|
||||
version: link:../auth
|
||||
@@ -431,9 +440,9 @@ importers:
|
||||
|
||||
packages/email:
|
||||
dependencies:
|
||||
'@plunk/node':
|
||||
specifier: ^3.0.3
|
||||
version: 3.0.3
|
||||
'@novu/api':
|
||||
specifier: ^3.11.0
|
||||
version: 3.11.0
|
||||
'@react-email/components':
|
||||
specifier: ^0.0.25
|
||||
version: 0.0.25(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
|
||||
@@ -2674,6 +2683,9 @@ packages:
|
||||
resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
|
||||
engines: {node: '>= 8'}
|
||||
|
||||
'@novu/api@3.11.0':
|
||||
resolution: {integrity: sha512-8u0mB5VThL7MhdxoN0UoA4CS9eu2k3Xa6iulauMhCHENuJNxUNuirJWq5t8jDoH4bFTQTfMN0VRkC0qodKR2qA==}
|
||||
|
||||
'@octokit/auth-token@3.0.4':
|
||||
resolution: {integrity: sha512-TWFX7cZF2LXoCvdmJWY7XVPi74aSY0+FfBZNSXEXFkMpjcqsQwDSYVv5FhRFaI0V1ECnwbz4j59T/G+rXNWaIQ==}
|
||||
engines: {node: '>= 14'}
|
||||
@@ -2753,9 +2765,6 @@ packages:
|
||||
resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
|
||||
engines: {node: '>=14'}
|
||||
|
||||
'@plunk/node@3.0.3':
|
||||
resolution: {integrity: sha512-f3NT418/EdLjebQ4arAwR64cnz7d5H7i1CeKh8+B0cVBrwzHvF+Q+QkhutF+FAp49yuI/BYc71qQH+RFc2fxxQ==}
|
||||
|
||||
'@popperjs/core@2.11.8':
|
||||
resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
|
||||
|
||||
@@ -3575,9 +3584,15 @@ packages:
|
||||
'@types/katex@0.16.7':
|
||||
resolution: {integrity: sha512-HMwFiRujE5PjrgwHQ25+bsLJgowjGjm5Z8FVSf0N6PwgJrwxH0QxzHYDcKsTfV3wva0vzrpqMTJS2jXPr5BMEQ==}
|
||||
|
||||
'@types/linkify-it@3.0.5':
|
||||
resolution: {integrity: sha512-yg6E+u0/+Zjva+buc3EIb+29XEg4wltq7cSmd4Uc2EE/1nUVmxyzpX6gUXD0V8jIrG0r7YeOGVIbYRkxeooCtw==}
|
||||
|
||||
'@types/linkify-it@5.0.0':
|
||||
resolution: {integrity: sha512-sVDA58zAw4eWAffKOaQH5/5j3XeayukzDk+ewSsnv3p4yJEZHCCzMDiZM8e0OUrRvmpGZ85jf4yDHkHsgBNr9Q==}
|
||||
|
||||
'@types/markdown-it@13.0.9':
|
||||
resolution: {integrity: sha512-1XPwR0+MgXLWfTn9gCsZ55AHOKW1WN+P9vr0PaQh5aerR9LLQXUbjfEAFhjmEmyoYFWAyuN2Mqkn40MZ4ukjBw==}
|
||||
|
||||
'@types/markdown-it@14.1.2':
|
||||
resolution: {integrity: sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==}
|
||||
|
||||
@@ -3587,6 +3602,9 @@ packages:
|
||||
'@types/mdast@4.0.4':
|
||||
resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
|
||||
|
||||
'@types/mdurl@1.0.5':
|
||||
resolution: {integrity: sha512-6L6VymKTzYSrEf4Nev4Xa1LCHKrlTlYCBMTlQKFuddo1CvQcE52I0mwfOJayueUC7MJuXOeHTcIU683lzd0cUA==}
|
||||
|
||||
'@types/mdurl@2.0.0':
|
||||
resolution: {integrity: sha512-RGdgjQUZba5p6QEFAVx2OGb8rQDL/cPRG7GiedRzMcJ1tYnUANBncjbSB1NRGwbvjcPeikRABz2nshyPk1bhWg==}
|
||||
|
||||
@@ -5730,6 +5748,9 @@ packages:
|
||||
make-error@1.3.6:
|
||||
resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==}
|
||||
|
||||
markdown-it-task-lists@2.1.1:
|
||||
resolution: {integrity: sha512-TxFAc76Jnhb2OUu+n3yz9RMu4CwGfaT788br6HhEDlvWfdeJcLUsxk1Hgw2yJio0OXsxv7pyIPmvECY7bMbluA==}
|
||||
|
||||
markdown-it@14.1.0:
|
||||
resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
|
||||
hasBin: true
|
||||
@@ -7411,6 +7432,11 @@ packages:
|
||||
tippy.js@6.3.7:
|
||||
resolution: {integrity: sha512-E1d3oP2emgJ9dRQZdf3Kkn0qJgI6ZLpyS5z6ZkY1DF3kaQaBsGZsndEpHwx+eC+tYM41HaSNvNtLx8tU57FzTQ==}
|
||||
|
||||
tiptap-markdown@0.8.10:
|
||||
resolution: {integrity: sha512-iDVkR2BjAqkTDtFX0h94yVvE2AihCXlF0Q7RIXSJPRSR5I0PA1TMuAg6FHFpmqTn4tPxJ0by0CK7PUMlnFLGEQ==}
|
||||
peerDependencies:
|
||||
'@tiptap/core': ^2.0.3
|
||||
|
||||
title-case@2.1.1:
|
||||
resolution: {integrity: sha512-EkJoZ2O3zdCz3zJsYCsxyq2OC5hrxR9mfdd5I+w8h/tmFfeOxJ+vvkxsKxdmN0WtS9zLdHEgfgVOiMVgv+Po4Q==}
|
||||
|
||||
@@ -10200,6 +10226,10 @@ snapshots:
|
||||
'@nodelib/fs.scandir': 2.1.5
|
||||
fastq: 1.19.1
|
||||
|
||||
'@novu/api@3.11.0':
|
||||
dependencies:
|
||||
zod: 3.25.76
|
||||
|
||||
'@octokit/auth-token@3.0.4': {}
|
||||
|
||||
'@octokit/core@4.2.4':
|
||||
@@ -10319,10 +10349,6 @@ snapshots:
|
||||
'@pkgjs/parseargs@0.11.0':
|
||||
optional: true
|
||||
|
||||
'@plunk/node@3.0.3':
|
||||
dependencies:
|
||||
tslib: 2.8.1
|
||||
|
||||
'@popperjs/core@2.11.8': {}
|
||||
|
||||
'@posthog/core@1.0.2': {}
|
||||
@@ -11321,8 +11347,15 @@ snapshots:
|
||||
|
||||
'@types/katex@0.16.7': {}
|
||||
|
||||
'@types/linkify-it@3.0.5': {}
|
||||
|
||||
'@types/linkify-it@5.0.0': {}
|
||||
|
||||
'@types/markdown-it@13.0.9':
|
||||
dependencies:
|
||||
'@types/linkify-it': 3.0.5
|
||||
'@types/mdurl': 1.0.5
|
||||
|
||||
'@types/markdown-it@14.1.2':
|
||||
dependencies:
|
||||
'@types/linkify-it': 5.0.0
|
||||
@@ -11336,6 +11369,8 @@ snapshots:
|
||||
dependencies:
|
||||
'@types/unist': 3.0.3
|
||||
|
||||
'@types/mdurl@1.0.5': {}
|
||||
|
||||
'@types/mdurl@2.0.0': {}
|
||||
|
||||
'@types/ms@2.1.0': {}
|
||||
@@ -13777,6 +13812,8 @@ snapshots:
|
||||
|
||||
make-error@1.3.6: {}
|
||||
|
||||
markdown-it-task-lists@2.1.1: {}
|
||||
|
||||
markdown-it@14.1.0:
|
||||
dependencies:
|
||||
argparse: 2.0.1
|
||||
@@ -16085,6 +16122,14 @@ snapshots:
|
||||
dependencies:
|
||||
'@popperjs/core': 2.11.8
|
||||
|
||||
tiptap-markdown@0.8.10(@tiptap/core@2.26.1(@tiptap/pm@2.26.1)):
|
||||
dependencies:
|
||||
'@tiptap/core': 2.26.1(@tiptap/pm@2.26.1)
|
||||
'@types/markdown-it': 13.0.9
|
||||
markdown-it: 14.1.0
|
||||
markdown-it-task-lists: 2.1.1
|
||||
prosemirror-markdown: 1.13.2
|
||||
|
||||
title-case@2.1.1:
|
||||
dependencies:
|
||||
no-case: 2.3.2
|
||||
@@ -16466,7 +16511,7 @@ snapshots:
|
||||
'@webassemblyjs/wasm-parser': 1.14.1
|
||||
acorn: 8.15.0
|
||||
acorn-import-phases: 1.0.4(acorn@8.15.0)
|
||||
browserslist: 4.25.4
|
||||
browserslist: 4.27.0
|
||||
chrome-trace-event: 1.0.4
|
||||
enhanced-resolve: 5.18.3
|
||||
es-module-lexer: 1.7.0
|
||||
|
||||