🎨(front) retour ui global (#80)
* 👷(front) fix scroll fix scroll + fix background model selector * 🎨(front) retour ui global retour ui robin : scroll, searchbar, margin
This commit is contained in:
+2
-1
@@ -8,10 +8,11 @@ and this project adheres to
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
- 👷(front) fix button scrollDown
|
||||
- 🎨(front) retour ui global
|
||||
|
||||
### Changed
|
||||
|
||||
- 👷(front) fix button scrollDown
|
||||
- 💥(front) disable input when error occurred
|
||||
- 👷(front) fix scroll
|
||||
- 🐛(front) fix left panel status + fix scroll
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
<svg width="139" height="40" viewBox="0 0 139 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M25.9806 10.0539C25.9806 9.37231 25.9806 9.03151 25.9098 8.72032C25.7791 8.14516 25.4727 7.62489 25.0331 7.23159C24.7953 7.0188 24.4973 6.8535 23.9012 6.52291L22.378 5.6781C21.8149 5.36579 21.5334 5.20963 21.2428 5.12176C20.7061 4.95941 20.1333 4.95941 19.5965 5.12176C19.3059 5.20963 19.0244 5.36579 18.4613 5.6781L17.8331 6.02651C17.0707 6.44937 16.6894 6.66081 16.5148 6.90692C16.1881 7.36724 16.1884 7.98382 16.5155 8.44382C16.6904 8.68977 17.0718 8.90084 17.8347 9.32298L18.3432 9.60438C18.9402 9.93474 19.2387 10.0999 19.4769 10.3127C19.9172 10.7061 20.2241 11.2267 20.3551 11.8023C20.4259 12.1138 20.4259 12.4549 20.4259 13.1373V13.7195C20.4259 14.5463 20.4259 14.9597 20.5502 15.2263C20.7823 15.7244 21.2975 16.0278 21.8457 15.9894C22.139 15.9688 22.5006 15.7684 23.2237 15.3675L23.9004 14.9925C24.4967 14.6619 24.7948 14.4967 25.0327 14.2839C25.4725 13.8906 25.779 13.3702 25.9098 12.7949C25.9806 12.4837 25.9806 12.1428 25.9806 11.461V10.0539Z" fill="#2845C1"/>
|
||||
<path d="M9.02562 20.1571C8.43534 20.4979 8.1402 20.6683 7.90608 20.8852C7.47335 21.286 7.17597 21.8115 7.05514 22.3888C6.98977 22.7012 6.99563 23.0419 7.00736 23.7234L7.03734 25.4649C7.04843 26.1088 7.05397 26.4307 7.12313 26.7262C7.25092 27.2723 7.53733 27.7683 7.94632 28.152C8.16767 28.3597 8.44369 28.5254 8.99572 28.857L9.61153 29.2268C10.359 29.6756 10.7327 29.9001 11.0331 29.9283C11.5951 29.981 12.1289 29.6724 12.3638 29.1592C12.4893 28.8847 12.4814 28.4489 12.4656 27.5772L12.455 26.9961C12.4426 26.3139 12.4364 25.9728 12.5016 25.6601C12.6221 25.0821 12.9195 24.556 13.3526 24.1548C13.5869 23.9377 13.8823 23.7671 14.4732 23.4259L14.9775 23.1348C15.6935 22.7214 16.0515 22.5147 16.2202 22.2739C16.5355 21.8238 16.5407 21.2259 16.2333 20.7703C16.0689 20.5266 15.7145 20.3137 15.0058 19.8878L14.3426 19.4894C13.7582 19.1382 13.466 18.9627 13.1628 18.863C12.6023 18.6788 11.9984 18.6736 11.4348 18.8479C11.1298 18.9423 10.8346 19.1127 10.2442 19.4536L9.02562 20.1571Z" fill="#2845C1"/>
|
||||
<path d="M25.9806 10.0539C25.9806 9.37231 25.9806 9.03151 25.9098 8.72032C25.7791 8.14516 25.4727 7.62489 25.0331 7.23159C24.7953 7.01879 24.4973 6.8535 23.9012 6.52291L22.378 5.6781C21.8149 5.36579 21.5334 5.20963 21.2428 5.12176C20.7061 4.95941 20.1333 4.95941 19.5965 5.12176C19.3059 5.20963 19.0244 5.36579 18.4613 5.6781L17.8331 6.02651C17.0707 6.44937 16.6894 6.66081 16.5148 6.90692C16.1881 7.36724 16.1884 7.98382 16.5155 8.44382C16.6904 8.68977 17.0718 8.90084 17.8347 9.32298L18.3432 9.60438C18.9402 9.93474 19.2387 10.0999 19.4769 10.3127C19.9172 10.7061 20.2241 11.2267 20.3551 11.8023C20.4259 12.1138 20.4259 12.4549 20.4259 13.1372V13.7195C20.4259 14.5463 20.4259 14.9597 20.5502 15.2263C20.7823 15.7243 21.2975 16.0278 21.8457 15.9894C22.139 15.9688 22.5006 15.7684 23.2237 15.3675L23.9004 14.9925C24.4967 14.6619 24.7948 14.4967 25.0327 14.2839C25.4725 13.8905 25.779 13.3702 25.9098 12.7949C25.9806 12.4837 25.9806 12.1428 25.9806 11.461V10.0539Z" fill="#2845C1"/>
|
||||
<path d="M9.02562 20.1571C8.43534 20.4979 8.1402 20.6683 7.90608 20.8852C7.47335 21.286 7.17597 21.8115 7.05514 22.3888C6.98977 22.7012 6.99563 23.0419 7.00736 23.7234L7.03734 25.4649C7.04843 26.1088 7.05397 26.4307 7.12313 26.7262C7.25092 27.2723 7.53733 27.7683 7.94632 28.152C8.16767 28.3597 8.44369 28.5254 8.99572 28.857L9.61153 29.2268C10.359 29.6756 10.7327 29.9001 11.0331 29.9282C11.5951 29.981 12.1289 29.6724 12.3638 29.1592C12.4893 28.8847 12.4814 28.4489 12.4656 27.5772L12.455 26.9961C12.4426 26.3139 12.4364 25.9728 12.5016 25.6601C12.6221 25.0821 12.9195 24.556 13.3526 24.1548C13.5869 23.9377 13.8823 23.7671 14.4732 23.4259L14.9775 23.1348C15.6935 22.7214 16.0515 22.5147 16.2202 22.2739C16.5355 21.8238 16.5407 21.2259 16.2333 20.7703C16.0689 20.5266 15.7145 20.3137 15.0058 19.8878L14.3426 19.4894C13.7582 19.1382 13.466 18.9627 13.1628 18.863C12.6023 18.6788 11.9984 18.6736 11.4348 18.8479C11.1298 18.9423 10.8346 19.1127 10.2442 19.4536L9.02562 20.1571Z" fill="#2845C1"/>
|
||||
<path d="M14.8587 29.9461C14.8587 30.6277 14.8587 30.9685 14.9295 31.2797C15.0602 31.8548 15.3666 32.3751 15.8062 32.7684C16.044 32.9812 16.342 33.1465 16.9381 33.4771L18.4613 34.3219C19.0244 34.6342 19.306 34.7904 19.5965 34.8782C20.1333 35.0406 20.7061 35.0406 21.2428 34.8782C21.5334 34.7904 21.8149 34.6342 22.378 34.3219L23.0062 33.9735C23.7686 33.5506 24.1499 33.3392 24.3245 33.0931C24.6512 32.6328 24.6509 32.0162 24.3238 31.5562C24.1489 31.3102 23.7675 31.0992 23.0046 30.677L22.4961 30.3956C21.8991 30.0653 21.6006 29.9001 21.3624 29.6873C20.9222 29.2939 20.6152 28.7733 20.4842 28.1977C20.4134 27.8862 20.4134 27.5451 20.4134 26.8627V26.2805C20.4134 25.4537 20.4134 25.0403 20.2892 24.7737C20.057 24.2757 19.5418 23.9722 18.9936 24.0106C18.7003 24.0312 18.3387 24.2316 17.6156 24.6325L16.9389 25.0075C16.3426 25.3381 16.0445 25.5033 15.8066 25.7161C15.3668 26.1095 15.0603 26.6298 14.9295 27.2051C14.8587 27.5163 14.8587 27.8572 14.8587 28.539V29.9461Z" fill="#2845C1"/>
|
||||
<path d="M26.2528 29.7889C26.843 30.1297 27.1382 30.3001 27.4431 30.3945C28.0065 30.5688 28.6103 30.5636 29.1707 30.3796C29.4739 30.28 29.766 30.1046 30.3504 29.7537L31.8436 28.8569C32.3956 28.5254 32.6716 28.3597 32.893 28.152C33.302 27.7683 33.5884 27.2723 33.7162 26.7262C33.7853 26.4307 33.7909 26.1088 33.802 25.4649L33.8143 24.7467C33.8293 23.875 33.8368 23.4391 33.711 23.1648C33.4757 22.6518 32.9416 22.3438 32.3797 22.397C32.0792 22.4255 31.7057 22.6503 30.9587 23.0999L30.4608 23.3996C29.8762 23.7514 29.5839 23.9273 29.2805 24.0272C28.7197 24.2118 28.1154 24.2173 27.5513 24.0429C27.2462 23.9485 26.9507 23.778 26.3598 23.4368L25.8556 23.1457C25.1395 22.7323 24.7815 22.5256 24.4886 22.4999C23.9411 22.4519 23.4208 22.7463 23.18 23.2403C23.0511 23.5046 23.0439 23.9179 23.0294 24.7446L23.0159 25.5182C23.004 26.1999 22.9981 26.5407 23.0634 26.8531C23.1842 27.4306 23.4816 27.9562 23.9144 28.3572C24.1485 28.5741 24.4438 28.7445 25.0342 29.0854L26.2528 29.7889Z" fill="#2845C1"/>
|
||||
<path d="M31.8137 19.8429C32.404 19.5021 32.6991 19.3317 32.9332 19.1148C33.366 18.714 33.6633 18.1885 33.7842 17.6112C33.8495 17.2988 33.8437 16.9581 33.8319 16.2766L33.802 14.5351C33.7909 13.8912 33.7853 13.5693 33.7162 13.2738C33.5884 12.7277 33.302 12.2317 32.893 11.848C32.6716 11.6403 32.3956 11.4746 31.8436 11.1431L31.2278 10.7732C30.4803 10.3244 30.1066 10.0999 29.8062 10.0718C29.2442 10.019 28.7104 10.3276 28.4755 10.8408C28.35 11.1153 28.3579 11.5511 28.3737 12.4228L28.3843 13.0039C28.3967 13.6861 28.4029 14.0272 28.3377 14.3399C28.2172 14.9179 27.9198 15.444 27.4867 15.8452C27.2524 16.0623 26.957 16.2329 26.3661 16.5741L25.8618 16.8652C25.1458 17.2786 24.7878 17.4853 24.6191 17.7261C24.3038 18.1762 24.2986 18.7741 24.606 19.2297C24.7704 19.4734 25.1248 19.6863 25.8335 20.1122L26.4967 20.5106C27.0811 20.8618 27.3733 21.0373 27.6765 21.137C28.237 21.3212 28.8409 21.3264 29.4045 21.1521C29.7095 21.0577 30.0047 20.8873 30.5951 20.5464L31.8137 19.8429Z" fill="#2845C1"/>
|
||||
<path d="M26.2528 29.7889C26.843 30.1297 27.1382 30.3001 27.4431 30.3945C28.0065 30.5688 28.6103 30.5636 29.1707 30.3796C29.4739 30.28 29.766 30.1046 30.3504 29.7537L31.8436 28.8569C32.3956 28.5254 32.6716 28.3597 32.893 28.152C33.302 27.7683 33.5884 27.2723 33.7162 26.7262C33.7853 26.4307 33.7909 26.1088 33.802 25.4649L33.8143 24.7467C33.8293 23.875 33.8368 23.4391 33.711 23.1648C33.4757 22.6518 32.9416 22.3437 32.3797 22.397C32.0792 22.4255 31.7057 22.6503 30.9587 23.0999L30.4608 23.3995C29.8762 23.7514 29.5839 23.9273 29.2805 24.0272C28.7197 24.2118 28.1154 24.2173 27.5513 24.0429C27.2462 23.9485 26.9507 23.778 26.3598 23.4368L25.8556 23.1457C25.1395 22.7323 24.7815 22.5256 24.4886 22.4999C23.9411 22.4519 23.4208 22.7463 23.18 23.2403C23.0511 23.5046 23.0439 23.9179 23.0294 24.7446L23.0159 25.5182C23.004 26.1998 22.9981 26.5407 23.0634 26.8531C23.1842 27.4306 23.4816 27.9562 23.9144 28.3572C24.1485 28.5741 24.4438 28.7445 25.0342 29.0854L26.2528 29.7889Z" fill="#2845C1"/>
|
||||
<path d="M31.8137 19.8429C32.404 19.5021 32.6991 19.3317 32.9332 19.1148C33.366 18.714 33.6633 18.1885 33.7842 17.6112C33.8495 17.2988 33.8437 16.9581 33.8319 16.2766L33.802 14.5351C33.7909 13.8912 33.7853 13.5693 33.7162 13.2738C33.5884 12.7277 33.302 12.2317 32.893 11.848C32.6716 11.6403 32.3956 11.4746 31.8436 11.1431L31.2278 10.7732C30.4804 10.3244 30.1066 10.0999 29.8062 10.0718C29.2442 10.019 28.7104 10.3276 28.4755 10.8408C28.35 11.1153 28.3579 11.5511 28.3737 12.4228L28.3843 13.0039C28.3967 13.6861 28.4029 14.0272 28.3377 14.3399C28.2172 14.9179 27.9198 15.444 27.4867 15.8452C27.2524 16.0623 26.957 16.2329 26.3661 16.5741L25.8618 16.8652C25.1458 17.2786 24.7878 17.4853 24.6191 17.7261C24.3038 18.1762 24.2986 18.7741 24.606 19.2297C24.7704 19.4734 25.1248 19.6863 25.8335 20.1122L26.4967 20.5106C27.0811 20.8618 27.3733 21.0373 27.6765 21.137C28.237 21.3212 28.8409 21.3264 29.4045 21.1521C29.7095 21.0577 30.0047 20.8873 30.5951 20.5464L31.8137 19.8429Z" fill="#2845C1"/>
|
||||
<path d="M14.5865 10.2111C13.9962 9.87031 13.7011 9.69991 13.3962 9.60558C12.8327 9.43123 12.229 9.43642 11.6686 9.62044C11.3654 9.72001 11.0732 9.89546 10.4889 10.2464L8.99568 11.1431C8.44365 11.4746 8.16763 11.6404 7.94627 11.848C7.53729 12.2317 7.25088 12.7278 7.12309 13.2738C7.05393 13.5694 7.04839 13.8913 7.0373 14.5351L7.02494 15.2533C7.00993 16.1251 7.00243 16.5609 7.12825 16.8352C7.36357 17.3483 7.89769 17.6563 8.45961 17.603C8.76005 17.5746 9.13355 17.3498 9.88056 16.9002L10.3785 16.6005C10.9631 16.2487 11.2554 16.0728 11.5588 15.9729C12.1196 15.7883 12.7239 15.7828 13.2879 15.9572C13.5931 16.0515 13.8885 16.2221 14.4794 16.5632L14.9837 16.8544C15.6997 17.2678 16.0577 17.4745 16.3507 17.5002C16.8981 17.5482 17.4185 17.2537 17.6593 16.7598C17.7882 16.4955 17.7954 16.0821 17.8098 15.2554L17.8233 14.4819C17.8352 13.8002 17.8412 13.4594 17.7758 13.1469C17.6551 12.5694 17.3577 12.0438 16.9249 11.6429C16.6907 11.426 16.3955 11.2555 15.8051 10.9146L14.5865 10.2111Z" fill="#C83F49"/>
|
||||
<rect x="8" y="27" width="24" height="9" rx="4.5" fill="#EEF1F4"/>
|
||||
<rect x="8" y="27" width="24" height="9" rx="4.5" fill="url(#paint0_linear_13455_5040)" fill-opacity="0.1"/>
|
||||
<path d="M12.3425 33.7364C12.2926 33.7364 12.2676 33.7364 12.2486 33.7267C12.2318 33.7181 12.2182 33.7045 12.2097 33.6877C12.2 33.6687 12.2 33.6437 12.2 33.5939V29.2426C12.2 29.1927 12.2 29.1678 12.2097 29.1487C12.2182 29.132 12.2318 29.1183 12.2486 29.1098C12.2676 29.1001 12.2926 29.1001 12.3425 29.1001H13.5643C14.5313 29.1001 15.1208 29.577 15.1208 30.3585C15.1208 30.6481 15.0195 30.9066 14.8257 31.1069C14.7572 31.1778 14.7229 31.2132 14.7171 31.2365C14.7109 31.2616 14.7123 31.2741 14.7237 31.2973C14.7343 31.3188 14.7739 31.3452 14.8532 31.398C15.1981 31.6276 15.3857 31.9701 15.3857 32.372C15.3857 33.2198 14.73 33.7364 13.6637 33.7364H12.3425ZM13.5842 29.8816H13.283C13.2331 29.8816 13.2081 29.8816 13.1891 29.8913C13.1723 29.8999 13.1587 29.9135 13.1502 29.9303C13.1405 29.9493 13.1405 29.9743 13.1405 30.0241V30.7856C13.1405 30.8355 13.1405 30.8604 13.1502 30.8795C13.1587 30.8962 13.1723 30.9099 13.1891 30.9184C13.2081 30.9281 13.2331 30.9281 13.283 30.9281H13.5842C13.9419 30.9281 14.1538 30.736 14.1538 30.3983C14.1538 30.0737 13.9419 29.8816 13.5842 29.8816ZM13.7167 31.7097H13.283C13.2331 31.7097 13.2081 31.7097 13.1891 31.7194C13.1723 31.7279 13.1587 31.7415 13.1502 31.7583C13.1405 31.7773 13.1405 31.8023 13.1405 31.8522V32.8123C13.1405 32.8622 13.1405 32.8871 13.1502 32.9062C13.1587 32.923 13.1723 32.9366 13.1891 32.9451C13.2081 32.9548 13.2331 32.9548 13.283 32.9548H13.7167C14.1538 32.9548 14.4187 32.723 14.4187 32.3322C14.4187 31.9348 14.1538 31.7097 13.7167 31.7097Z" fill="#2845C1"/>
|
||||
<path d="M16.4271 33.7364C16.3772 33.7364 16.3523 33.7364 16.3333 33.7267C16.3165 33.7181 16.3029 33.7045 16.2943 33.6877C16.2846 33.6687 16.2846 33.6437 16.2846 33.5939V29.2426C16.2846 29.1927 16.2846 29.1678 16.2943 29.1487C16.3029 29.132 16.3165 29.1183 16.3333 29.1098C16.3523 29.1001 16.3772 29.1001 16.4271 29.1001H18.8444C18.8943 29.1001 18.9192 29.1001 18.9383 29.1098C18.955 29.1183 18.9687 29.132 18.9772 29.1487C18.9869 29.1678 18.9869 29.1927 18.9869 29.2426V29.7391C18.9869 29.789 18.9869 29.814 18.9772 29.833C18.9687 29.8498 18.955 29.8634 18.9383 29.8719C18.9192 29.8816 18.8943 29.8816 18.8444 29.8816H17.3676C17.3177 29.8816 17.2928 29.8816 17.2738 29.8913C17.257 29.8999 17.2434 29.9135 17.2348 29.9303C17.2251 29.9493 17.2251 29.9743 17.2251 30.0241V30.8386C17.2251 30.8885 17.2251 30.9134 17.2348 30.9325C17.2434 30.9492 17.257 30.9629 17.2738 30.9714C17.2928 30.9811 17.3177 30.9811 17.3676 30.9811H18.5795C18.6294 30.9811 18.6543 30.9811 18.6734 30.9908C18.6901 30.9993 18.7037 31.013 18.7123 31.0297C18.722 31.0488 18.722 31.0737 18.722 31.1236V31.6201C18.722 31.67 18.722 31.695 18.7123 31.714C18.7037 31.7308 18.6901 31.7444 18.6734 31.7529C18.6543 31.7626 18.6294 31.7626 18.5795 31.7626H17.3676C17.3177 31.7626 17.2928 31.7626 17.2738 31.7723C17.257 31.7809 17.2434 31.7945 17.2348 31.8113C17.2251 31.8303 17.2251 31.8553 17.2251 31.9051V32.8123C17.2251 32.8622 17.2251 32.8871 17.2348 32.9062C17.2434 32.923 17.257 32.9366 17.2738 32.9451C17.2928 32.9548 17.3177 32.9548 17.3676 32.9548H18.8444C18.8943 32.9548 18.9192 32.9548 18.9383 32.9645C18.955 32.9731 18.9687 32.9867 18.9772 33.0035C18.9869 33.0225 18.9869 33.0474 18.9869 33.0973V33.5939C18.9869 33.6437 18.9869 33.6687 18.9772 33.6877C18.9687 33.7045 18.955 33.7181 18.9383 33.7267C18.9192 33.7364 18.8943 33.7364 18.8444 33.7364H16.4271Z" fill="#2845C1"/>
|
||||
<path d="M19.7762 29.9545C19.7263 29.9545 19.7014 29.9545 19.6823 29.9448C19.6656 29.9362 19.652 29.9226 19.6434 29.9059C19.6337 29.8868 19.6337 29.8619 19.6337 29.812V29.2426C19.6337 29.1927 19.6337 29.1678 19.6434 29.1487C19.652 29.132 19.6656 29.1183 19.6823 29.1098C19.7014 29.1001 19.7263 29.1001 19.7762 29.1001H23.2929C23.3428 29.1001 23.3678 29.1001 23.3868 29.1098C23.4036 29.1183 23.4172 29.132 23.4257 29.1487C23.4354 29.1678 23.4354 29.1927 23.4354 29.2426V29.812C23.4354 29.8619 23.4354 29.8868 23.4257 29.9059C23.4172 29.9226 23.4036 29.9362 23.3868 29.9448C23.3678 29.9545 23.3428 29.9545 23.2929 29.9545H22.1473C22.0974 29.9545 22.0725 29.9545 22.0535 29.9642C22.0367 29.9727 22.0231 29.9864 22.0145 30.0031C22.0048 30.0222 22.0048 30.0471 22.0048 30.097V33.5939C22.0048 33.6437 22.0048 33.6687 21.9951 33.6877C21.9866 33.7045 21.973 33.7181 21.9562 33.7267C21.9371 33.7364 21.9122 33.7364 21.8623 33.7364H21.2068C21.1569 33.7364 21.132 33.7364 21.113 33.7267C21.0962 33.7181 21.0826 33.7045 21.074 33.6877C21.0643 33.6687 21.0643 33.6437 21.0643 33.5939V30.097C21.0643 30.0471 21.0643 30.0222 21.0546 30.0031C21.0461 29.9864 21.0325 29.9727 21.0157 29.9642C20.9966 29.9545 20.9717 29.9545 20.9218 29.9545H19.7762Z" fill="#2845C1"/>
|
||||
<path d="M23.3724 33.7364C23.3031 33.7364 23.2685 33.7364 23.2463 33.7218C23.2268 33.7091 23.2131 33.6892 23.2081 33.6666C23.2024 33.6406 23.2146 33.6082 23.2392 33.5434L24.8864 29.1921C24.899 29.159 24.9053 29.1424 24.9161 29.1301C24.9257 29.1193 24.9377 29.111 24.9512 29.1059C24.9665 29.1001 24.9842 29.1001 25.0197 29.1001H26.0548C26.0903 29.1001 26.108 29.1001 26.1233 29.1059C26.1368 29.111 26.1488 29.1193 26.1584 29.1301C26.1692 29.1424 26.1755 29.159 26.188 29.1921L27.8353 33.5434C27.8598 33.6082 27.8721 33.6406 27.8664 33.6666C27.8613 33.6892 27.8477 33.7091 27.8282 33.7218C27.806 33.7364 27.7713 33.7364 27.702 33.7364H27.0076C26.9718 33.7364 26.9539 33.7364 26.9385 33.7305C26.925 33.7253 26.9129 33.7169 26.9033 33.7059C26.8925 33.6935 26.8863 33.6767 26.8739 33.6431L26.4988 32.6242C26.4865 32.5906 26.4803 32.5738 26.4694 32.5614C26.4599 32.5504 26.4478 32.542 26.4342 32.5368C26.4188 32.5309 26.4009 32.5309 26.3651 32.5309H24.7094C24.6736 32.5309 24.6556 32.5309 24.6403 32.5368C24.6267 32.542 24.6146 32.5504 24.605 32.5614C24.5942 32.5738 24.588 32.5906 24.5757 32.6242L24.2006 33.6431C24.1882 33.6767 24.182 33.6935 24.1712 33.7059C24.1616 33.7169 24.1495 33.7253 24.1359 33.7305C24.1206 33.7364 24.1027 33.7364 24.0668 33.7364H23.3724ZM24.9713 31.5382C24.9478 31.6025 24.936 31.6347 24.9419 31.6604C24.9471 31.6829 24.9608 31.7026 24.9802 31.7151C25.0023 31.7295 25.0366 31.7295 25.1051 31.7295H25.9694C26.0379 31.7295 26.0721 31.7295 26.0943 31.7151C26.1136 31.7026 26.1274 31.6829 26.1325 31.6604C26.1385 31.6347 26.1267 31.6025 26.1032 31.5382L25.6711 30.3543C25.6298 30.2413 25.6092 30.1847 25.579 30.1687C25.5529 30.1548 25.5216 30.1548 25.4955 30.1687C25.4653 30.1847 25.4447 30.2413 25.4034 30.3543L24.9713 31.5382Z" fill="#2845C1"/>
|
||||
<path d="M61.8577 15.8076C62.6931 15.8076 63.468 15.99 64.1819 16.3545C64.8463 16.6867 65.3785 17.1009 65.7781 17.5971C65.8437 17.6785 65.8294 17.7966 65.7498 17.8645L64.3459 19.0622C64.2574 19.1377 64.1237 19.1217 64.0503 19.0314C63.7909 18.7122 63.4929 18.4426 63.1565 18.2227C62.7616 17.9645 62.3285 17.835 61.8577 17.835C61.5237 17.835 61.2353 17.8962 60.9924 18.0176C60.7646 18.1391 60.5895 18.2986 60.468 18.4961C60.3617 18.6936 60.3088 18.9142 60.3088 19.1572C60.3089 19.5216 60.4375 19.8254 60.6956 20.0684C60.969 20.2962 61.319 20.494 61.7444 20.6611C62.1696 20.8282 62.6174 21.0106 63.0881 21.208C63.5742 21.3903 64.03 21.6182 64.4553 21.8916C64.8806 22.1498 65.2225 22.4989 65.4807 22.9395C65.7541 23.3647 65.8908 23.9037 65.8909 24.5566C65.8909 25.3312 65.7012 25.9923 65.3215 26.5391C64.957 27.0706 64.471 27.4809 63.8635 27.7695C63.2559 28.0582 62.5868 28.2031 61.8577 28.2031C60.8706 28.2031 60.0124 28.0207 59.2834 27.6563C58.6116 27.3063 58.0171 26.8462 57.5 26.2769C57.4264 26.1959 57.4354 26.0708 57.5176 25.9985L58.921 24.7635C59.0067 24.6881 59.1377 24.6998 59.2123 24.7863C59.5425 25.1694 59.9081 25.4884 60.3088 25.7422C60.7645 26.0307 61.2733 26.1748 61.8352 26.1748C62.3669 26.1748 62.7698 26.0381 63.0432 25.7647C63.3317 25.4761 63.4758 25.1268 63.4758 24.7168C63.4758 24.3371 63.339 24.0335 63.0657 23.8057C62.8074 23.5778 62.4656 23.38 62.0403 23.2129C61.615 23.0458 61.1592 22.8708 60.6731 22.6885C60.2024 22.4911 59.7545 22.2557 59.3293 21.9824C58.9041 21.709 58.5539 21.3598 58.2805 20.9346C58.0223 20.494 57.8938 19.9316 57.8938 19.248C57.8938 18.6101 58.0606 18.033 58.3948 17.5166C58.729 16.9849 59.192 16.5665 59.7844 16.2627C60.3919 15.959 61.0831 15.8077 61.8577 15.8076Z" fill="#2845C1"/>
|
||||
<path d="M71.3215 15.8076C72.1569 15.8077 72.9319 15.99 73.6457 16.3545C74.3101 16.6867 74.8424 17.1009 75.2419 17.5971C75.3075 17.6785 75.2933 17.7966 75.2137 17.8645L73.8098 19.0622C73.7213 19.1377 73.5875 19.1217 73.5141 19.0313C73.2548 18.7122 72.9568 18.4427 72.6204 18.2227C72.2255 17.9645 71.7923 17.835 71.3215 17.835C70.9873 17.835 70.6984 17.8961 70.4553 18.0176C70.2275 18.1391 70.0524 18.2986 69.9309 18.4961C69.8246 18.6935 69.7717 18.9142 69.7717 19.1572C69.7718 19.5217 69.9013 19.8254 70.1594 20.0684C70.4328 20.2962 70.782 20.4941 71.2073 20.6611C71.6326 20.8282 72.0811 21.0105 72.552 21.208C73.0379 21.3903 73.494 21.6182 73.9192 21.8916C74.3443 22.1498 74.6864 22.4991 74.9446 22.9395C75.2178 23.3646 75.3547 23.9038 75.3547 24.5566C75.3547 25.3313 75.1641 25.9922 74.7844 26.5391C74.4199 27.0707 73.934 27.4809 73.3264 27.7695C72.7189 28.0581 72.0506 28.2031 71.3215 28.2031C70.3341 28.2031 69.4755 28.0208 68.7463 27.6563C68.0745 27.3063 67.48 26.8462 66.9629 26.2769C66.8893 26.1959 66.8983 26.0708 66.9805 25.9985L68.3839 24.7635C68.4696 24.6881 68.6006 24.6998 68.6752 24.7863C69.0054 25.1694 69.371 25.4884 69.7717 25.7422C70.2273 26.0307 70.7362 26.1747 71.2981 26.1748C71.8298 26.1748 72.2327 26.0381 72.5061 25.7647C72.7946 25.4761 72.9387 25.1268 72.9387 24.7168C72.9387 24.3371 72.802 24.0335 72.5286 23.8057C72.2703 23.5778 71.9285 23.38 71.5032 23.2129C71.0779 23.0458 70.622 22.8707 70.136 22.6885C69.6653 22.4911 69.2174 22.2557 68.7922 21.9824C68.3671 21.7091 68.0178 21.3597 67.7444 20.9346C67.4861 20.494 67.3567 19.9316 67.3567 19.248C67.3567 18.6102 67.5236 18.033 67.8577 17.5166C68.1918 16.985 68.655 16.5665 69.2473 16.2627C69.8549 15.9589 70.5468 15.8076 71.3215 15.8076Z" fill="#2845C1"/>
|
||||
<path d="M86.3313 15.8076C87.1668 15.8076 87.9416 15.9899 88.6555 16.3545C89.32 16.6868 89.8522 17.1008 90.2517 17.5971C90.3173 17.6785 90.303 17.7966 90.2235 17.8645L88.8196 19.0622C88.731 19.1377 88.5973 19.1217 88.5239 19.0314C88.2646 18.7122 87.9666 18.4426 87.6301 18.2227C87.2352 17.9644 86.8022 17.835 86.3313 17.835C85.9971 17.835 85.7081 17.8961 85.4651 18.0176C85.2374 18.1391 85.0631 18.2988 84.9416 18.4961C84.8353 18.6936 84.7815 18.9142 84.7815 19.1572C84.7816 19.5216 84.9111 19.8254 85.1692 20.0684C85.4426 20.2962 85.7918 20.4941 86.217 20.6611C86.6424 20.8282 87.0909 21.0105 87.5618 21.208C88.0478 21.3903 88.5037 21.6182 88.929 21.8916C89.3542 22.1498 89.6961 22.499 89.9543 22.9395C90.2277 23.3647 90.3644 23.9037 90.3645 24.5566C90.3645 25.3311 90.1747 25.9923 89.7952 26.5391C89.4306 27.0707 88.9438 27.4809 88.3362 27.7695C87.7286 28.0581 87.0604 28.2031 86.3313 28.2031C85.3439 28.2031 84.4852 28.0208 83.7561 27.6563C83.0844 27.3063 82.4905 26.8461 81.9736 26.2769C81.9 26.1959 81.909 26.0708 81.9911 25.9985L83.3937 24.7636C83.4793 24.6881 83.6104 24.6998 83.685 24.7863C84.0152 25.1694 84.3808 25.4884 84.7815 25.7422C85.2372 26.0308 85.7468 26.1748 86.3088 26.1748C86.8403 26.1748 87.2425 26.038 87.5159 25.7647C87.8044 25.4761 87.9494 25.1269 87.9495 24.7168C87.9495 24.3372 87.8125 24.0335 87.5393 23.8057C87.2811 23.5779 86.9391 23.38 86.5139 23.2129C86.0886 23.0458 85.6328 22.8707 85.1467 22.6885C84.6758 22.491 84.2273 22.2559 83.802 21.9824C83.3768 21.7091 83.0275 21.3597 82.7541 20.9346C82.4959 20.494 82.3665 19.9316 82.3665 19.248C82.3665 18.61 82.5342 18.0331 82.8684 17.5166C83.2026 16.9849 83.6656 16.5665 84.2581 16.2627C84.8656 15.959 85.5567 15.8076 86.3313 15.8076Z" fill="#2845C1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M106.191 16.0361C107.239 16.0361 108.128 16.2257 108.857 16.6055C109.586 16.9852 110.133 17.5094 110.498 18.1777C110.877 18.8461 111.067 19.5981 111.067 20.4336V27.7756C111.067 27.886 110.977 27.9756 110.867 27.9756H108.76C108.65 27.9756 108.56 27.886 108.56 27.7756V27.0162C108.56 26.9218 108.438 26.8771 108.372 26.9448C108.27 27.0497 108.159 27.1502 108.037 27.2461C107.626 27.5803 107.148 27.8392 106.601 28.0215C106.054 28.2189 105.5 28.3173 104.938 28.3174C103.814 28.3174 102.894 28.0139 102.18 27.4063C101.466 26.7986 101.11 25.9855 101.11 24.9678C101.11 24.102 101.436 23.3654 102.089 22.7578C102.743 22.1502 103.684 21.7473 104.915 21.5498L108.394 20.9589C108.49 20.9426 108.56 20.8593 108.56 20.7618V20.4336C108.56 19.7502 108.333 19.2186 107.877 18.8389C107.422 18.444 106.829 18.2462 106.1 18.2461C105.508 18.2461 104.968 18.3756 104.482 18.6338C104.071 18.8594 103.717 19.1602 103.422 19.5365C103.351 19.626 103.222 19.6465 103.132 19.5773L101.606 18.4098C101.52 18.3442 101.501 18.2219 101.568 18.1365C102.052 17.5117 102.666 17.0165 103.411 16.6514C104.231 16.2412 105.158 16.0361 106.191 16.0361ZM105.553 23.2139C104.87 23.3202 104.376 23.5171 104.072 23.8057C103.768 24.079 103.616 24.4284 103.616 24.8535C103.616 25.2788 103.775 25.6289 104.094 25.9023C104.428 26.1758 104.877 26.3125 105.439 26.3125C106.138 26.3125 106.753 26.153 107.285 25.834C107.721 25.5722 108.09 25.2382 108.393 24.833C108.508 24.6795 108.56 24.4899 108.56 24.2983V22.9508C108.56 22.8272 108.449 22.7332 108.327 22.7535L105.553 23.2139Z" fill="#2845C1"/>
|
||||
<path d="M95.9868 16.2912C95.9868 16.4017 96.0764 16.4912 96.1868 16.4912H99.5017C99.6121 16.4912 99.7017 16.5808 99.7017 16.6912V18.5471C99.7017 18.6575 99.6121 18.7471 99.5017 18.7471H96.1868C96.0764 18.7471 95.9868 18.8366 95.9868 18.9471V23.9199C95.9868 24.421 96.0708 24.8159 96.2378 25.1045C96.4048 25.3929 96.6403 25.6055 96.9439 25.7422C97.2477 25.8637 97.605 25.9248 98.0152 25.9248C98.4101 25.9248 98.7447 25.902 99.0181 25.8564C99.1739 25.8218 99.3174 25.7847 99.4485 25.7451C99.5829 25.7045 99.7241 25.8022 99.7241 25.9426V27.7314C99.7241 27.8104 99.6778 27.8826 99.6042 27.9113C99.3605 28.0061 99.0889 28.0733 98.7896 28.1123C98.4554 28.173 98.0606 28.2031 97.605 28.2031C96.6936 28.2031 95.926 28.0436 95.3032 27.7246C94.6959 27.3904 94.2325 26.9117 93.9136 26.2891C93.6099 25.6512 93.4585 24.8615 93.4585 23.9199V18.9471C93.4585 18.8366 93.369 18.7471 93.2585 18.7471H91.6087C91.4982 18.7471 91.4087 18.6575 91.4087 18.5471V16.6912C91.4087 16.5808 91.4982 16.4912 91.6087 16.4912H93.2585C93.369 16.4912 93.4585 16.4017 93.4585 16.2912V13.8211C93.4585 13.7106 93.548 13.6211 93.6585 13.6211H95.7868C95.8973 13.6211 95.9868 13.7106 95.9868 13.8211V16.2912Z" fill="#2845C1"/>
|
||||
<rect x="8" y="27" width="24" height="9" rx="4.5" fill="url(#paint0_linear_6479_3681)" fill-opacity="0.1"/>
|
||||
<path d="M12.3425 33.7362C12.2926 33.7362 12.2676 33.7362 12.2486 33.7265C12.2318 33.718 12.2182 33.7044 12.2097 33.6876C12.2 33.6686 12.2 33.6436 12.2 33.5937V29.2425C12.2 29.1926 12.2 29.1677 12.2097 29.1486C12.2182 29.1318 12.2318 29.1182 12.2486 29.1097C12.2676 29.1 12.2926 29.1 12.3425 29.1H13.5643C14.5313 29.1 15.1208 29.5768 15.1208 30.3584C15.1208 30.648 15.0195 30.9064 14.8257 31.1068C14.7572 31.1777 14.7229 31.2131 14.7171 31.2364C14.7109 31.2615 14.7123 31.274 14.7237 31.2972C14.7343 31.3187 14.7739 31.3451 14.8532 31.3978C15.1981 31.6275 15.3857 31.9699 15.3857 32.3719C15.3857 33.2196 14.73 33.7362 13.6637 33.7362H12.3425ZM13.5842 29.8815H13.283C13.2331 29.8815 13.2081 29.8815 13.1891 29.8912C13.1723 29.8998 13.1587 29.9134 13.1502 29.9301C13.1405 29.9492 13.1405 29.9741 13.1405 30.024V30.7855C13.1405 30.8354 13.1405 30.8603 13.1502 30.8794C13.1587 30.8961 13.1723 30.9097 13.1891 30.9183C13.2081 30.928 13.2331 30.928 13.283 30.928H13.5842C13.9419 30.928 14.1538 30.7359 14.1538 30.3981C14.1538 30.0736 13.9419 29.8815 13.5842 29.8815ZM13.7167 31.7095H13.283C13.2331 31.7095 13.2081 31.7095 13.1891 31.7192C13.1723 31.7278 13.1587 31.7414 13.1502 31.7582C13.1405 31.7772 13.1405 31.8022 13.1405 31.852V32.8122C13.1405 32.8621 13.1405 32.887 13.1502 32.9061C13.1587 32.9228 13.1723 32.9365 13.1891 32.945C13.2081 32.9547 13.2331 32.9547 13.283 32.9547H13.7167C14.1538 32.9547 14.4187 32.7229 14.4187 32.3321C14.4187 31.9347 14.1538 31.7095 13.7167 31.7095Z" fill="#2845C1"/>
|
||||
<path d="M16.4271 33.7362C16.3772 33.7362 16.3523 33.7362 16.3333 33.7265C16.3165 33.718 16.3029 33.7044 16.2943 33.6876C16.2846 33.6686 16.2846 33.6436 16.2846 33.5937V29.2425C16.2846 29.1926 16.2846 29.1677 16.2943 29.1486C16.3029 29.1318 16.3165 29.1182 16.3333 29.1097C16.3523 29.1 16.3772 29.1 16.4271 29.1H18.8444C18.8943 29.1 18.9192 29.1 18.9383 29.1097C18.955 29.1182 18.9687 29.1318 18.9772 29.1486C18.9869 29.1677 18.9869 29.1926 18.9869 29.2425V29.739C18.9869 29.7889 18.9869 29.8138 18.9772 29.8329C18.9687 29.8496 18.955 29.8633 18.9383 29.8718C18.9192 29.8815 18.8943 29.8815 18.8444 29.8815H17.3676C17.3177 29.8815 17.2928 29.8815 17.2738 29.8912C17.257 29.8998 17.2434 29.9134 17.2348 29.9301C17.2251 29.9492 17.2251 29.9741 17.2251 30.024V30.8385C17.2251 30.8884 17.2251 30.9133 17.2348 30.9323C17.2434 30.9491 17.257 30.9627 17.2738 30.9713C17.2928 30.981 17.3177 30.981 17.3676 30.981H18.5795C18.6294 30.981 18.6543 30.981 18.6733 30.9907C18.6901 30.9992 18.7037 31.0128 18.7123 31.0296C18.722 31.0487 18.722 31.0736 18.722 31.1235V31.62C18.722 31.6699 18.722 31.6948 18.7123 31.7139C18.7037 31.7306 18.6901 31.7443 18.6733 31.7528C18.6543 31.7625 18.6294 31.7625 18.5795 31.7625H17.3676C17.3177 31.7625 17.2928 31.7625 17.2738 31.7722C17.257 31.7808 17.2434 31.7944 17.2348 31.8111C17.2251 31.8302 17.2251 31.8551 17.2251 31.905V32.8122C17.2251 32.8621 17.2251 32.887 17.2348 32.9061C17.2434 32.9228 17.257 32.9365 17.2738 32.945C17.2928 32.9547 17.3177 32.9547 17.3676 32.9547H18.8444C18.8943 32.9547 18.9192 32.9547 18.9383 32.9644C18.955 32.9729 18.9687 32.9866 18.9772 33.0033C18.9869 33.0224 18.9869 33.0473 18.9869 33.0972V33.5937C18.9869 33.6436 18.9869 33.6686 18.9772 33.6876C18.9687 33.7044 18.955 33.718 18.9383 33.7265C18.9192 33.7362 18.8943 33.7362 18.8444 33.7362H16.4271Z" fill="#2845C1"/>
|
||||
<path d="M19.7762 29.9544C19.7263 29.9544 19.7014 29.9544 19.6823 29.9447C19.6656 29.9361 19.652 29.9225 19.6434 29.9057C19.6337 29.8867 19.6337 29.8618 19.6337 29.8119V29.2425C19.6337 29.1926 19.6337 29.1677 19.6434 29.1486C19.652 29.1318 19.6656 29.1182 19.6823 29.1097C19.7014 29.1 19.7263 29.1 19.7762 29.1H23.2929C23.3428 29.1 23.3678 29.1 23.3868 29.1097C23.4036 29.1182 23.4172 29.1318 23.4257 29.1486C23.4354 29.1677 23.4354 29.1926 23.4354 29.2425V29.8119C23.4354 29.8618 23.4354 29.8867 23.4257 29.9057C23.4172 29.9225 23.4036 29.9361 23.3868 29.9447C23.3678 29.9544 23.3428 29.9544 23.2929 29.9544H22.1473C22.0974 29.9544 22.0725 29.9544 22.0535 29.9641C22.0367 29.9726 22.0231 29.9862 22.0145 30.003C22.0048 30.0221 22.0048 30.047 22.0048 30.0969V33.5937C22.0048 33.6436 22.0048 33.6686 21.9951 33.6876C21.9866 33.7044 21.973 33.718 21.9562 33.7265C21.9371 33.7362 21.9122 33.7362 21.8623 33.7362H21.2068C21.1569 33.7362 21.132 33.7362 21.113 33.7265C21.0962 33.718 21.0826 33.7044 21.074 33.6876C21.0643 33.6686 21.0643 33.6436 21.0643 33.5937V30.0969C21.0643 30.047 21.0643 30.0221 21.0546 30.003C21.0461 29.9862 21.0325 29.9726 21.0157 29.9641C20.9966 29.9544 20.9717 29.9544 20.9218 29.9544H19.7762Z" fill="#2845C1"/>
|
||||
<path d="M23.3724 33.7362C23.3031 33.7362 23.2685 33.7362 23.2463 33.7217C23.2268 33.709 23.2131 33.6891 23.2081 33.6664C23.2024 33.6405 23.2146 33.6081 23.2392 33.5433L24.8864 29.192C24.899 29.1588 24.9053 29.1422 24.9161 29.13C24.9257 29.1192 24.9377 29.1109 24.9512 29.1058C24.9665 29.1 24.9842 29.1 25.0197 29.1H26.0548C26.0903 29.1 26.108 29.1 26.1233 29.1058C26.1368 29.1109 26.1488 29.1192 26.1584 29.13C26.1692 29.1422 26.1755 29.1588 26.188 29.192L27.8353 33.5433C27.8598 33.6081 27.8721 33.6405 27.8664 33.6664C27.8613 33.6891 27.8476 33.709 27.8282 33.7217C27.806 33.7362 27.7713 33.7362 27.702 33.7362H27.0076C26.9718 33.7362 26.9539 33.7362 26.9385 33.7304C26.925 33.7252 26.9129 33.7167 26.9033 33.7058C26.8925 33.6934 26.8863 33.6766 26.8739 33.643L26.4988 32.6241C26.4865 32.5905 26.4803 32.5737 26.4694 32.5613C26.4599 32.5503 26.4478 32.5419 26.4342 32.5367C26.4188 32.5308 26.4009 32.5308 26.3651 32.5308H24.7094C24.6736 32.5308 24.6556 32.5308 24.6403 32.5367C24.6267 32.5419 24.6146 32.5503 24.605 32.5613C24.5942 32.5737 24.588 32.5905 24.5757 32.6241L24.2006 33.643C24.1882 33.6766 24.182 33.6934 24.1712 33.7058C24.1616 33.7167 24.1495 33.7252 24.1359 33.7304C24.1206 33.7362 24.1027 33.7362 24.0668 33.7362H23.3724ZM24.9713 31.538C24.9478 31.6024 24.936 31.6346 24.9419 31.6603C24.9471 31.6828 24.9608 31.7024 24.9802 31.715C25.0023 31.7294 25.0366 31.7294 25.1051 31.7294H25.9694C26.0379 31.7294 26.0721 31.7294 26.0943 31.715C26.1136 31.7024 26.1274 31.6828 26.1325 31.6603C26.1385 31.6346 26.1267 31.6024 26.1032 31.538L25.6711 30.3542C25.6298 30.2411 25.6092 30.1846 25.579 30.1686C25.5529 30.1547 25.5216 30.1547 25.4955 30.1686C25.4653 30.1846 25.4447 30.2411 25.4034 30.3542L24.9713 31.538Z" fill="#2845C1"/>
|
||||
<path d="M61.8577 15.8076C62.6931 15.8076 63.468 15.99 64.1819 16.3545C64.8463 16.6867 65.3785 17.1009 65.7781 17.5971C65.8437 17.6785 65.8294 17.7966 65.7498 17.8645L64.3459 19.0622C64.2574 19.1377 64.1236 19.1217 64.0503 19.0314C63.7909 18.7122 63.4929 18.4426 63.1565 18.2227C62.7616 17.9645 62.3285 17.835 61.8577 17.835C61.5237 17.835 61.2353 17.8962 60.9924 18.0176C60.7646 18.1391 60.5895 18.2986 60.468 18.4961C60.3617 18.6936 60.3088 18.9142 60.3088 19.1572C60.3089 19.5216 60.4375 19.8254 60.6955 20.0684C60.969 20.2962 61.319 20.494 61.7444 20.6611C62.1696 20.8282 62.6174 21.0106 63.0881 21.208C63.5742 21.3903 64.03 21.6182 64.4553 21.8916C64.8806 22.1498 65.2225 22.4989 65.4807 22.9395C65.7541 23.3647 65.8908 23.9037 65.8909 24.5566C65.8909 25.3312 65.7012 25.9923 65.3215 26.5391C64.957 27.0706 64.471 27.4809 63.8635 27.7695C63.2559 28.0582 62.5868 28.2031 61.8577 28.2031C60.8706 28.2031 60.0124 28.0207 59.2834 27.6562C58.6116 27.3063 58.0171 26.8462 57.5 26.2769C57.4264 26.1959 57.4354 26.0708 57.5176 25.9985L58.921 24.7635C59.0067 24.6881 59.1377 24.6998 59.2123 24.7863C59.5425 25.1694 59.9081 25.4884 60.3088 25.7422C60.7645 26.0307 61.2733 26.1748 61.8352 26.1748C62.3669 26.1748 62.7698 26.0381 63.0432 25.7646C63.3316 25.4761 63.4758 25.1268 63.4758 24.7168C63.4758 24.3371 63.339 24.0335 63.0657 23.8057C62.8074 23.5778 62.4656 23.38 62.0403 23.2129C61.6149 23.0458 61.1592 22.8708 60.6731 22.6885C60.2024 22.4911 59.7545 22.2557 59.3293 21.9824C58.9041 21.709 58.5539 21.3598 58.2805 20.9346C58.0223 20.494 57.8938 19.9316 57.8938 19.248C57.8938 18.6101 58.0606 18.033 58.3948 17.5166C58.729 16.9849 59.192 16.5665 59.7844 16.2627C60.3919 15.959 61.0831 15.8077 61.8577 15.8076Z" fill="#2845C1"/>
|
||||
<path d="M71.3215 15.8076C72.1569 15.8077 72.9319 15.99 73.6457 16.3545C74.3101 16.6867 74.8424 17.1009 75.2419 17.5971C75.3075 17.6785 75.2933 17.7966 75.2137 17.8644L73.8098 19.0622C73.7213 19.1377 73.5875 19.1217 73.5141 19.0313C73.2548 18.7122 72.9568 18.4427 72.6204 18.2227C72.2255 17.9645 71.7923 17.835 71.3215 17.835C70.9873 17.835 70.6984 17.8961 70.4553 18.0176C70.2275 18.1391 70.0524 18.2986 69.9309 18.4961C69.8246 18.6935 69.7717 18.9142 69.7717 19.1572C69.7718 19.5217 69.9013 19.8254 70.1594 20.0684C70.4328 20.2962 70.782 20.4941 71.2073 20.6611C71.6326 20.8282 72.0811 21.0105 72.552 21.208C73.0379 21.3903 73.494 21.6182 73.9192 21.8916C74.3443 22.1498 74.6864 22.4991 74.9446 22.9395C75.2178 23.3646 75.3547 23.9038 75.3547 24.5566C75.3547 25.3313 75.1641 25.9922 74.7844 26.5391C74.4199 27.0707 73.934 27.4809 73.3264 27.7695C72.7189 28.0581 72.0506 28.2031 71.3215 28.2031C70.3341 28.2031 69.4755 28.0208 68.7463 27.6562C68.0745 27.3063 67.48 26.8462 66.9629 26.2769C66.8893 26.1959 66.8983 26.0708 66.9805 25.9985L68.3839 24.7635C68.4696 24.6881 68.6006 24.6998 68.6752 24.7863C69.0054 25.1694 69.371 25.4884 69.7717 25.7422C70.2273 26.0307 70.7362 26.1747 71.2981 26.1748C71.8298 26.1748 72.2327 26.0381 72.5061 25.7646C72.7946 25.4761 72.9387 25.1268 72.9387 24.7168C72.9387 24.337 72.802 24.0335 72.5286 23.8057C72.2703 23.5778 71.9285 23.38 71.5032 23.2129C71.0779 23.0458 70.622 22.8707 70.136 22.6885C69.6653 22.4911 69.2174 22.2557 68.7922 21.9824C68.3671 21.7091 68.0178 21.3597 67.7444 20.9346C67.4861 20.494 67.3567 19.9316 67.3567 19.248C67.3567 18.6102 67.5236 18.033 67.8577 17.5166C68.1918 16.985 68.655 16.5665 69.2473 16.2627C69.8549 15.9589 70.5468 15.8076 71.3215 15.8076Z" fill="#2845C1"/>
|
||||
<path d="M86.3313 15.8076C87.1668 15.8076 87.9416 15.9899 88.6555 16.3545C89.32 16.6868 89.8521 17.1008 90.2517 17.5971C90.3173 17.6785 90.303 17.7966 90.2235 17.8644L88.8195 19.0622C88.731 19.1377 88.5973 19.1217 88.5239 19.0314C88.2646 18.7122 87.9666 18.4426 87.6301 18.2227C87.2352 17.9644 86.8022 17.835 86.3313 17.835C85.9971 17.835 85.7081 17.8961 85.4651 18.0176C85.2374 18.1391 85.0631 18.2988 84.9416 18.4961C84.8353 18.6936 84.7815 18.9142 84.7815 19.1572C84.7816 19.5216 84.911 19.8254 85.1692 20.0684C85.4426 20.2962 85.7918 20.4941 86.217 20.6611C86.6424 20.8282 87.0909 21.0105 87.5618 21.208C88.0478 21.3903 88.5036 21.6182 88.9289 21.8916C89.3542 22.1498 89.6961 22.499 89.9543 22.9395C90.2276 23.3647 90.3644 23.9037 90.3645 24.5566C90.3645 25.3311 90.1747 25.9923 89.7952 26.5391C89.4306 27.0707 88.9438 27.4809 88.3362 27.7695C87.7286 28.0581 87.0604 28.2031 86.3313 28.2031C85.3439 28.2031 84.4852 28.0208 83.7561 27.6562C83.0843 27.3063 82.4905 26.8461 81.9736 26.2769C81.9 26.1959 81.909 26.0708 81.9911 25.9985L83.3937 24.7636C83.4793 24.6881 83.6104 24.6998 83.685 24.7863C84.0152 25.1694 84.3808 25.4884 84.7815 25.7422C85.2372 26.0308 85.7468 26.1748 86.3088 26.1748C86.8403 26.1748 87.2425 26.038 87.5159 25.7646C87.8044 25.4761 87.9494 25.1269 87.9495 24.7168C87.9495 24.3372 87.8125 24.0335 87.5393 23.8057C87.2811 23.5779 86.9391 23.38 86.5139 23.2129C86.0886 23.0458 85.6328 22.8707 85.1467 22.6885C84.6758 22.491 84.2273 22.2559 83.802 21.9824C83.3768 21.7091 83.0275 21.3597 82.7541 20.9346C82.4959 20.494 82.3664 19.9316 82.3664 19.248C82.3664 18.61 82.5342 18.0331 82.8684 17.5166C83.2026 16.9849 83.6656 16.5665 84.258 16.2627C84.8656 15.959 85.5567 15.8076 86.3313 15.8076Z" fill="#2845C1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M106.191 16.0361C107.239 16.0361 108.128 16.2257 108.857 16.6055C109.586 16.9852 110.133 17.5094 110.498 18.1777C110.877 18.8461 111.067 19.5981 111.067 20.4336V27.7756C111.067 27.886 110.977 27.9756 110.867 27.9756H108.76C108.65 27.9756 108.56 27.886 108.56 27.7756V27.0162C108.56 26.9218 108.438 26.8771 108.372 26.9448C108.27 27.0497 108.159 27.1502 108.037 27.2461C107.626 27.5803 107.148 27.8392 106.601 28.0215C106.054 28.2189 105.5 28.3173 104.938 28.3174C103.814 28.3174 102.894 28.0139 102.18 27.4062C101.466 26.7986 101.11 25.9855 101.11 24.9678C101.11 24.102 101.436 23.3654 102.089 22.7578C102.743 22.1502 103.684 21.7473 104.915 21.5498L108.394 20.9589C108.49 20.9426 108.56 20.8593 108.56 20.7618V20.4336C108.56 19.7502 108.333 19.2186 107.877 18.8389C107.422 18.444 106.829 18.2462 106.1 18.2461C105.508 18.2461 104.968 18.3756 104.482 18.6338C104.071 18.8594 103.717 19.1602 103.422 19.5365C103.351 19.626 103.222 19.6465 103.132 19.5773L101.606 18.4098C101.52 18.3442 101.501 18.2219 101.568 18.1365C102.052 17.5117 102.666 17.0165 103.411 16.6514C104.231 16.2412 105.158 16.0361 106.191 16.0361ZM105.553 23.2139C104.87 23.3202 104.376 23.5171 104.072 23.8057C103.768 24.079 103.616 24.4284 103.616 24.8535C103.616 25.2788 103.775 25.6289 104.094 25.9023C104.428 26.1758 104.877 26.3125 105.439 26.3125C106.138 26.3125 106.753 26.153 107.285 25.834C107.721 25.5722 108.09 25.2382 108.393 24.833C108.508 24.6795 108.56 24.4899 108.56 24.2983V22.9508C108.56 22.8272 108.449 22.7332 108.327 22.7535L105.553 23.2139Z" fill="#2845C1"/>
|
||||
<path d="M95.9868 16.2912C95.9868 16.4017 96.0764 16.4912 96.1868 16.4912H99.5017C99.6121 16.4912 99.7017 16.5808 99.7017 16.6912V18.5471C99.7017 18.6575 99.6121 18.7471 99.5017 18.7471H96.1868C96.0764 18.7471 95.9868 18.8366 95.9868 18.9471V23.9199C95.9868 24.421 96.0708 24.8159 96.2378 25.1045C96.4048 25.3929 96.6403 25.6055 96.9439 25.7422C97.2477 25.8637 97.605 25.9248 98.0151 25.9248C98.4101 25.9248 98.7446 25.902 99.0181 25.8564C99.1739 25.8218 99.3174 25.7847 99.4485 25.7451C99.5829 25.7045 99.7241 25.8022 99.7241 25.9426V27.7314C99.7241 27.8104 99.6778 27.8826 99.6042 27.9113C99.3605 28.0061 99.0888 28.0733 98.7896 28.1123C98.4554 28.173 98.0605 28.2031 97.605 28.2031C96.6936 28.2031 95.926 28.0436 95.3032 27.7246C94.6959 27.3904 94.2325 26.9117 93.9136 26.2891C93.6099 25.6512 93.4585 24.8615 93.4585 23.9199V18.9471C93.4585 18.8366 93.369 18.7471 93.2585 18.7471H91.6087C91.4982 18.7471 91.4087 18.6575 91.4087 18.5471V16.6912C91.4087 16.5808 91.4982 16.4912 91.6087 16.4912H93.2585C93.369 16.4912 93.4585 16.4017 93.4585 16.2912V13.8211C93.4585 13.7106 93.548 13.6211 93.6585 13.6211H95.7868C95.8973 13.6211 95.9868 13.7106 95.9868 13.8211V16.2912Z" fill="#2845C1"/>
|
||||
<path d="M130.563 16.2912C130.563 16.4017 130.653 16.4912 130.763 16.4912H134.077C134.187 16.4912 134.277 16.5808 134.277 16.6912V18.5471C134.277 18.6575 134.187 18.7471 134.077 18.7471H130.763C130.653 18.7471 130.563 18.8366 130.563 18.9471V23.9199C130.563 24.421 130.646 24.8159 130.813 25.1045C130.98 25.3931 131.216 25.6055 131.52 25.7422C131.824 25.8637 132.18 25.9248 132.59 25.9248C132.985 25.9248 133.32 25.902 133.593 25.8564C133.749 25.8218 133.893 25.7847 134.024 25.7451C134.158 25.7045 134.299 25.8022 134.299 25.9425V27.7313C134.299 27.8104 134.253 27.8826 134.179 27.9113C133.936 28.0061 133.665 28.0733 133.366 28.1123C133.032 28.1731 132.636 28.2031 132.18 28.2031C131.269 28.2031 130.502 28.0436 129.879 27.7246C129.272 27.3904 128.809 26.9119 128.49 26.2891C128.186 25.6511 128.034 24.8616 128.034 23.9199V18.9471C128.034 18.8366 127.944 18.7471 127.834 18.7471H126.092C125.982 18.7471 125.892 18.6575 125.892 18.5471V16.6912C125.892 16.5808 125.982 16.4912 126.092 16.4912H127.834C127.944 16.4912 128.034 16.4017 128.034 16.2912V13.8211C128.034 13.7106 128.123 13.6211 128.234 13.6211H130.363C130.473 13.6211 130.563 13.7106 130.563 13.8211V16.2912Z" fill="#2845C1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M56.8209 27.7034C56.8716 27.8344 56.7749 27.9756 56.6344 27.9756H54.0801C53.9969 27.9756 53.9224 27.9241 53.893 27.8464L52.3355 23.7298C52.3061 23.652 52.2316 23.6006 52.1485 23.6006H45.6707C45.5876 23.6006 45.5132 23.6519 45.4837 23.7296L43.9196 27.8466C43.8901 27.9243 43.8157 27.9756 43.7326 27.9756H41.2002C41.0598 27.9756 40.9631 27.8347 41.0136 27.7036L47.0107 12.1534C47.0404 12.0763 47.1146 12.0254 47.1973 12.0254H50.6144C50.697 12.0254 50.7711 12.0762 50.8009 12.1532L56.8209 27.7034ZM46.5361 20.9604C46.4864 21.0913 46.5831 21.2314 46.7231 21.2314H51.1006C51.2405 21.2314 51.3372 21.0915 51.2876 20.9606L49.1032 15.1895C49.038 15.0173 48.7946 15.0172 48.7292 15.1892L46.5361 20.9604Z" fill="#2845C1"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M56.8209 27.7034C56.8716 27.8344 56.7749 27.9756 56.6344 27.9756H54.0801C53.9969 27.9756 53.9224 27.9241 53.893 27.8464L52.3355 23.7298C52.3061 23.652 52.2316 23.6006 52.1485 23.6006H45.6707C45.5876 23.6006 45.5132 23.6519 45.4837 23.7296L43.9196 27.8466C43.8901 27.9243 43.8157 27.9756 43.7326 27.9756H41.2002C41.0598 27.9756 40.9631 27.8346 41.0136 27.7036L47.0107 12.1534C47.0404 12.0763 47.1146 12.0254 47.1973 12.0254H50.6144C50.697 12.0254 50.7711 12.0762 50.8009 12.1532L56.8209 27.7034ZM46.5361 20.9604C46.4864 21.0913 46.5831 21.2314 46.7231 21.2314H51.1006C51.2405 21.2314 51.3372 21.0915 51.2876 20.9606L49.1032 15.1895C49.038 15.0173 48.7946 15.0172 48.7292 15.1892L46.5361 20.9604Z" fill="#2845C1"/>
|
||||
<path d="M80.1372 27.7756C80.1372 27.886 80.0477 27.9756 79.9372 27.9756H77.8314C77.7209 27.9756 77.6314 27.886 77.6314 27.7756V16.6912C77.6314 16.5808 77.7209 16.4912 77.8314 16.4912H79.9372C80.0477 16.4912 80.1372 16.5808 80.1372 16.6912V27.7756Z" fill="#2845C1"/>
|
||||
<path d="M120.009 16.0361C120.86 16.0361 121.619 16.2258 122.288 16.6055C122.971 16.9852 123.511 17.5477 123.906 18.292C124.301 19.0363 124.499 19.9708 124.499 21.0947V27.7756C124.499 27.886 124.409 27.9756 124.299 27.9756H122.169C122.059 27.9756 121.969 27.886 121.969 27.7756V21.1855C121.969 20.3046 121.741 19.6209 121.286 19.1348C120.83 18.6335 120.206 18.3828 119.417 18.3828C118.915 18.3829 118.475 18.4813 118.095 18.6787C117.715 18.861 117.389 19.0971 117.116 19.3857C116.919 19.6051 116.745 19.8331 116.592 20.0699C116.498 20.2162 116.455 20.3884 116.455 20.5624V27.7756C116.455 27.886 116.365 27.9756 116.255 27.9756H114.149C114.038 27.9756 113.949 27.886 113.949 27.7756V16.6912C113.949 16.5808 114.038 16.4912 114.149 16.4912H116.255C116.365 16.4912 116.455 16.5808 116.455 16.6912V17.2892C116.455 17.3794 116.566 17.4247 116.631 17.3628C117.008 17.0071 117.443 16.7088 117.936 16.4688C118.528 16.1802 119.219 16.0361 120.009 16.0361Z" fill="#2845C1"/>
|
||||
<path d="M78.9068 10.75C79.2105 10.75 79.484 10.8257 79.7271 10.9775C79.9853 11.1294 80.1831 11.3345 80.3198 11.5928C80.4717 11.8358 80.5474 12.1093 80.5474 12.4131C80.5474 12.7168 80.4716 12.9977 80.3198 13.2559C80.1831 13.5141 79.9853 13.7192 79.7271 13.8711C79.484 14.0078 79.2106 14.0762 78.9068 14.0762C78.603 14.0762 78.3222 14.0078 78.064 13.8711C77.8057 13.7192 77.6006 13.5141 77.4487 13.2559C77.2969 12.9977 77.2212 12.7168 77.2212 12.4131C77.2212 11.9574 77.3807 11.57 77.6997 11.251C78.0338 10.917 78.436 10.75 78.9068 10.75Z" fill="#2845C1"/>
|
||||
<path d="M78.9067 10.75C79.2105 10.75 79.484 10.8257 79.7271 10.9775C79.9853 11.1294 80.1831 11.3345 80.3198 11.5928C80.4717 11.8358 80.5474 12.1093 80.5474 12.4131C80.5474 12.7168 80.4716 12.9977 80.3198 13.2559C80.1831 13.5141 79.9853 13.7192 79.7271 13.8711C79.484 14.0078 79.2106 14.0762 78.9067 14.0762C78.603 14.0762 78.3222 14.0078 78.064 13.8711C77.8057 13.7192 77.6006 13.5141 77.4487 13.2559C77.2969 12.9977 77.2212 12.7168 77.2212 12.4131C77.2212 11.9574 77.3807 11.57 77.6997 11.251C78.0338 10.917 78.436 10.75 78.9067 10.75Z" fill="#2845C1"/>
|
||||
<defs>
|
||||
<linearGradient id="paint0_linear_13455_5040" x1="20" y1="27" x2="20" y2="36" gradientUnits="userSpaceOnUse">
|
||||
<linearGradient id="paint0_linear_6479_3681" x1="20" y1="27" x2="20" y2="36" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#2845C1"/>
|
||||
<stop offset="1" stop-color="#EEF1F4"/>
|
||||
</linearGradient>
|
||||
|
||||
|
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
@@ -69,7 +69,7 @@ export const Toast = ({
|
||||
const iconToUse = icon || config.icon;
|
||||
|
||||
useEffect(() => {
|
||||
const timer = setTimeout(() => setIsVisible(true), 100);
|
||||
setIsVisible(true);
|
||||
|
||||
const autoCloseTimer = setTimeout(() => {
|
||||
setIsLeaving(true);
|
||||
@@ -77,7 +77,6 @@ export const Toast = ({
|
||||
}, duration);
|
||||
|
||||
return () => {
|
||||
clearTimeout(timer);
|
||||
clearTimeout(autoCloseTimer);
|
||||
};
|
||||
}, [id, duration, onClose]);
|
||||
@@ -89,21 +88,18 @@ export const Toast = ({
|
||||
border: 1px solid ${config.borderColor};
|
||||
color: ${config.color};
|
||||
border-radius: 4px;
|
||||
padding: 8px 12px;
|
||||
padding: ${isVisible && !isLeaving ? '8px 12px' : '0 12px'};
|
||||
width: auto;
|
||||
margin-bottom: 8px;
|
||||
box-shadow: 0 6px 18px 0 rgba(0, 0, 145, 0.05);
|
||||
transform: translateY(${isVisible ? '0' : '100%'});
|
||||
opacity: ${isVisible ? '1' : '0'};
|
||||
transition: all 0.3s ease-in-out;
|
||||
opacity: ${isVisible && !isLeaving ? '1' : '0'};
|
||||
transform: translateY(${isVisible && !isLeaving ? '0' : '-3px'});
|
||||
max-height: ${isVisible && !isLeaving ? '100px' : '0px'};
|
||||
transition:
|
||||
padding 0.2s ease,
|
||||
opacity 0.2s ease,
|
||||
transform 0.2s ease;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
${isLeaving &&
|
||||
css`
|
||||
transform: translateY(-100%);
|
||||
opacity: 0;
|
||||
`}
|
||||
`}
|
||||
>
|
||||
<Box $direction="row" $align="center" $gap="12px">
|
||||
|
||||
@@ -50,7 +50,7 @@ export const ToastProvider = ({ children }: ToastProviderProps) => {
|
||||
const id = Math.random().toString(36).substr(2, 9);
|
||||
const newToast: ToastItem = { id, message, type, icon, duration };
|
||||
|
||||
setToasts((prev) => [...prev, newToast]);
|
||||
setToasts((prev) => [newToast, ...prev]);
|
||||
},
|
||||
[],
|
||||
);
|
||||
@@ -75,13 +75,14 @@ export const ToastProvider = ({ children }: ToastProviderProps) => {
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
z-index: 1000;
|
||||
display: inline-block;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
width: auto;
|
||||
pointer-events: none;
|
||||
& > * {
|
||||
pointer-events: auto;
|
||||
margin-bottom: 8px;
|
||||
transition: transform 0.3s ease-out, margin 0.3s ease-out;
|
||||
}
|
||||
`}
|
||||
>
|
||||
|
||||
@@ -80,7 +80,13 @@ export const QuickSearchInput = ({
|
||||
border: 1px solid #CFD5DE;
|
||||
background-color: #eff1f5;
|
||||
padding: 6px 8px;
|
||||
&:focus-within, &:hover {
|
||||
cursor: pointer !important;
|
||||
transition: border-color 0.2s ease;
|
||||
&:hover {
|
||||
border: 2px solid #CFD5DE;
|
||||
padding: 5px 7px;
|
||||
}
|
||||
&:focus-within {
|
||||
border: 2px solid #3E5DE7;
|
||||
padding: 5px 7px;
|
||||
}
|
||||
@@ -124,9 +130,11 @@ export const QuickSearchInput = ({
|
||||
right: 10px;
|
||||
border-radius: 4px;
|
||||
padding: 7px;
|
||||
background-color: #e4e6ea;
|
||||
z-index: 1000;
|
||||
&:focus {
|
||||
&:hover {
|
||||
background-color: #e4e6ea;
|
||||
}
|
||||
&:focus-visible {
|
||||
outline: 2px solid #3E5DE7;
|
||||
outline-offset: 2px;
|
||||
}`}
|
||||
|
||||
@@ -1,4 +1,7 @@
|
||||
import { Box, BoxButton, Icon, Text } from '@/components';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { css } from 'styled-components';
|
||||
|
||||
import { Box, Icon, Text } from '@/components';
|
||||
|
||||
// Define Attachment type locally (mirroring backend structure)
|
||||
export interface Attachment {
|
||||
@@ -18,6 +21,8 @@ export const AttachmentList = ({
|
||||
onRemove,
|
||||
isReadOnly = false,
|
||||
}: AttachmentListProps) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
if (!attachments || attachments.length === 0) {
|
||||
return null;
|
||||
}
|
||||
@@ -52,9 +57,9 @@ export const AttachmentList = ({
|
||||
$background="var(--c--theme--colors--greyscale-050)"
|
||||
$minWidth="200px"
|
||||
$direction="row"
|
||||
$gap="xs"
|
||||
$gap="8px"
|
||||
$align="center"
|
||||
$padding="xs"
|
||||
$padding={{ all: '4px', left: 'xs' }}
|
||||
$css={`
|
||||
border-radius: 4px;
|
||||
`}
|
||||
@@ -66,7 +71,6 @@ export const AttachmentList = ({
|
||||
$height="22px"
|
||||
$direction="row"
|
||||
$align="center"
|
||||
$margin={{ right: 'xs' }}
|
||||
$justify="center"
|
||||
$css={`
|
||||
flex-shrink: 0;
|
||||
@@ -101,12 +105,33 @@ export const AttachmentList = ({
|
||||
{name}
|
||||
</Text>
|
||||
{!isReadOnly && onRemove && (
|
||||
<BoxButton
|
||||
aria-label="Remove attachment"
|
||||
<Box
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
aria-label={t('Remove attachment')}
|
||||
onClick={removeAttachment}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
removeAttachment();
|
||||
}
|
||||
}}
|
||||
$css={css`
|
||||
display: block;
|
||||
padding: 4px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
background-color: #e1e3e7 !important;
|
||||
}
|
||||
&:focus-visible {
|
||||
outline: 2px solid #3e5de7;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
`}
|
||||
>
|
||||
<Icon iconName="close" $theme="greyscale" $size="18px" />
|
||||
</BoxButton>
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
@@ -32,8 +32,10 @@ import { ToolInvocationItem } from '@/features/chat/components/ToolInvocationIte
|
||||
import { useClipboard } from '@/hook';
|
||||
import { useResponsiveStore } from '@/stores';
|
||||
|
||||
import { useSourceMetadataCache } from '../hooks';
|
||||
import { useChatPreferencesStore } from '../stores/useChatPreferencesStore';
|
||||
import { usePendingChatStore } from '../stores/usePendingChatStore';
|
||||
import { useScrollStore } from '../stores/useScrollStore';
|
||||
|
||||
// Define Attachment type locally (mirroring backend structure)
|
||||
export interface Attachment {
|
||||
@@ -112,7 +114,29 @@ export const Chat = ({
|
||||
title: string;
|
||||
message: string;
|
||||
} | null>(null);
|
||||
|
||||
const { setIsAtTop } = useScrollStore();
|
||||
|
||||
// Gérer le scroll pour mettre à jour l'état du header
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
if (chatContainerRef.current) {
|
||||
const scrollTop = chatContainerRef.current.scrollTop;
|
||||
setIsAtTop(scrollTop <= 5);
|
||||
}
|
||||
};
|
||||
|
||||
const container = chatContainerRef.current;
|
||||
if (container) {
|
||||
container.addEventListener('scroll', handleScroll, { passive: true });
|
||||
handleScroll(); // Vérifier la position initiale
|
||||
|
||||
return () => container.removeEventListener('scroll', handleScroll);
|
||||
}
|
||||
}, [setIsAtTop]);
|
||||
|
||||
const [isSourceOpen, setIsSourceOpen] = useState<string | null>(null);
|
||||
const { prefetchMetadata, getMetadata } = useSourceMetadataCache();
|
||||
|
||||
const [initialConversationMessages, setInitialConversationMessages] =
|
||||
useState<Message[] | undefined>(undefined);
|
||||
@@ -126,7 +150,7 @@ export const Chat = ({
|
||||
const [streamingMessageHeight, setStreamingMessageHeight] = useState<
|
||||
number | null
|
||||
>(null);
|
||||
const [userScrolledUp, _setUserScrolledUp] = useState(false);
|
||||
const lastUserMessageIdRef = useRef<string | null>(null);
|
||||
|
||||
const { mutate: createChatConversation } = useCreateChatConversation();
|
||||
|
||||
@@ -201,6 +225,20 @@ export const Chat = ({
|
||||
void handleSubmit(event);
|
||||
};
|
||||
|
||||
// Précharger les métadonnées des sources dès que les messages arrivent
|
||||
useEffect(() => {
|
||||
messages.forEach((message) => {
|
||||
if (message.parts) {
|
||||
const sourceParts = message.parts.filter(
|
||||
(part): part is SourceUIPart => part.type === 'source',
|
||||
);
|
||||
sourceParts.forEach((part) => {
|
||||
void prefetchMetadata(part.source.url);
|
||||
});
|
||||
}
|
||||
});
|
||||
}, [messages, prefetchMetadata]);
|
||||
|
||||
const openSources = (messageId: string) => {
|
||||
if (isSourceOpen === messageId) {
|
||||
setIsSourceOpen(null);
|
||||
@@ -236,9 +274,7 @@ export const Chat = ({
|
||||
const userMessageHeight = (lastUserMessageElement as HTMLElement)
|
||||
.offsetHeight;
|
||||
|
||||
const thinkingHeight = 90;
|
||||
const availableHeight =
|
||||
containerHeight - userMessageHeight - thinkingHeight;
|
||||
const availableHeight = containerHeight - userMessageHeight - 38;
|
||||
|
||||
if (streamingMessageHeight !== availableHeight) {
|
||||
setStreamingMessageHeight(availableHeight);
|
||||
@@ -248,41 +284,48 @@ export const Chat = ({
|
||||
}
|
||||
}, [messages, streamingMessageHeight]);
|
||||
|
||||
// Détecter l'arrivée d'un nouveau message user et retirer la hauteur de l'ancien
|
||||
useEffect(() => {
|
||||
if (chatContainerRef.current && messages.length > 0) {
|
||||
const _userMessages = messages.filter((msg) => msg.role === 'user');
|
||||
const assistantMessages = messages.filter(
|
||||
(msg) => msg.role === 'assistant',
|
||||
);
|
||||
const lastMessage = messages[messages.length - 1];
|
||||
const userMessages = messages.filter((msg) => msg.role === 'user');
|
||||
const lastUserMessage = userMessages[userMessages.length - 1];
|
||||
|
||||
// Gérer la hauteur de streaming
|
||||
if (
|
||||
lastMessage &&
|
||||
lastMessage.role === 'user' &&
|
||||
assistantMessages.length > 0 &&
|
||||
status === 'ready'
|
||||
) {
|
||||
// Nouveau message user détecté, réinitialiser la hauteur
|
||||
if (
|
||||
lastUserMessage &&
|
||||
lastUserMessage.id !== lastUserMessageIdRef.current
|
||||
) {
|
||||
if (lastUserMessageIdRef.current !== null) {
|
||||
setStreamingMessageHeight(null);
|
||||
} else if (status === 'streaming' || status === 'submitted') {
|
||||
// Calculer la hauteur pendant le streaming
|
||||
calculateStreamingHeight();
|
||||
}
|
||||
lastUserMessageIdRef.current = lastUserMessage.id;
|
||||
}
|
||||
}, [
|
||||
messages,
|
||||
status,
|
||||
hasInitialized,
|
||||
calculateStreamingHeight,
|
||||
userScrolledUp,
|
||||
]);
|
||||
}, [messages]);
|
||||
|
||||
// Calculer la hauteur pendant submitted/streaming
|
||||
useEffect(() => {
|
||||
if (status === 'submitted') {
|
||||
scrollToBottom();
|
||||
if (status === 'submitted' || status === 'streaming') {
|
||||
calculateStreamingHeight();
|
||||
}
|
||||
}, [status, scrollToBottom]);
|
||||
}, [status, calculateStreamingHeight]);
|
||||
|
||||
// Scroller vers la question au moment du submit
|
||||
useEffect(() => {
|
||||
if (status !== 'submitted' || !chatContainerRef.current) {
|
||||
return;
|
||||
}
|
||||
|
||||
const lastUserMessage = messages.filter((msg) => msg.role === 'user').pop();
|
||||
if (!lastUserMessage) {
|
||||
return;
|
||||
}
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
const messageElement = chatContainerRef.current?.querySelector(
|
||||
`[data-message-id="${lastUserMessage.id}"]`,
|
||||
);
|
||||
|
||||
messageElement?.scrollIntoView({ block: 'start', behavior: 'smooth' });
|
||||
});
|
||||
}, [status, messages]);
|
||||
|
||||
// Synchronize conversationId state with prop when it changes (e.g., after navigation)
|
||||
useEffect(() => {
|
||||
@@ -482,12 +525,13 @@ export const Chat = ({
|
||||
$padding={{ all: 'base', left: '13px', bottom: '0', right: '0' }}
|
||||
$width="100%"
|
||||
$flex={1}
|
||||
$overflow="scroll"
|
||||
$overflow="auto"
|
||||
$css={`
|
||||
flex-basis: auto;
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
padding-bottom: 20px;
|
||||
height: ${messages.length > 0 ? 'calc(100vh - 62px)' : '0'};
|
||||
max-height: ${messages.length > 0 ? 'calc(100vh - 62px)' : '0'};
|
||||
`}
|
||||
@@ -495,12 +539,15 @@ export const Chat = ({
|
||||
{messages.length > 0 && (
|
||||
<Box>
|
||||
{messages.map((message, index) => {
|
||||
const isLastMessage = index === messages.length - 1;
|
||||
const isLastAssistantMessageInConversation =
|
||||
message.role === 'assistant' &&
|
||||
index ===
|
||||
messages.findLastIndex((msg) => msg.role === 'assistant');
|
||||
const _shouldApplyStreamingHeight =
|
||||
isLastAssistantMessageInConversation && streamingMessageHeight;
|
||||
const shouldApplyStreamingHeight =
|
||||
isLastAssistantMessageInConversation &&
|
||||
isLastMessage &&
|
||||
streamingMessageHeight;
|
||||
const isCurrentlyStreaming =
|
||||
isLastAssistantMessageInConversation &&
|
||||
(status === 'streaming' || status === 'submitted');
|
||||
@@ -543,7 +590,8 @@ export const Chat = ({
|
||||
$background={`${message.role === 'user' ? '#EEF1F4' : 'white'}`}
|
||||
$css={`
|
||||
display: inline-block;
|
||||
float: right;`}
|
||||
float: right;
|
||||
${shouldApplyStreamingHeight ? `min-height: ${streamingMessageHeight}px;` : ''}`}
|
||||
>
|
||||
{/* Message content */}
|
||||
{message.content && (
|
||||
@@ -581,6 +629,34 @@ export const Chat = ({
|
||||
)}
|
||||
|
||||
<Box $direction="column" $gap="2">
|
||||
{isCurrentlyStreaming &&
|
||||
isLastAssistantMessageInConversation &&
|
||||
status === 'streaming' &&
|
||||
message.parts?.some(
|
||||
(part) =>
|
||||
part.type === 'tool-invocation' &&
|
||||
part.toolInvocation.toolName !==
|
||||
'document_parsing',
|
||||
) && (
|
||||
<Box
|
||||
$direction="row"
|
||||
$align="center"
|
||||
$gap="6px"
|
||||
$width="100%"
|
||||
$maxWidth="750px"
|
||||
$margin={{
|
||||
all: 'auto',
|
||||
top: 'base',
|
||||
bottom: 'md',
|
||||
}}
|
||||
>
|
||||
<Loader />
|
||||
<Text $variation="600" $size="md">
|
||||
{t('Search...')}
|
||||
</Text>
|
||||
</Box>
|
||||
)}
|
||||
|
||||
{message.parts
|
||||
?.filter(
|
||||
(part) =>
|
||||
@@ -610,6 +686,7 @@ export const Chat = ({
|
||||
key={`tool-invocation-${partIndex}`}
|
||||
toolInvocation={part.toolInvocation}
|
||||
status={status}
|
||||
hideSearchLoader={true}
|
||||
/>
|
||||
) : null,
|
||||
)}
|
||||
@@ -696,9 +773,10 @@ export const Chat = ({
|
||||
$weight="500"
|
||||
$size="12px"
|
||||
>
|
||||
{t('Show') +
|
||||
` ${sourceCount} ` +
|
||||
t('sources')}
|
||||
{t('Show')} {sourceCount}{' '}
|
||||
{sourceCount !== 1
|
||||
? t('sources')
|
||||
: t('source')}
|
||||
</Text>
|
||||
</Box>
|
||||
);
|
||||
@@ -717,14 +795,26 @@ export const Chat = ({
|
||||
</Box>
|
||||
</Box>
|
||||
)}
|
||||
{message.parts && isSourceOpen === message.id && (
|
||||
<SourceItemList
|
||||
parts={message.parts.filter(
|
||||
{message.parts &&
|
||||
isSourceOpen === message.id &&
|
||||
(() => {
|
||||
const sourceParts = message.parts.filter(
|
||||
(part): part is SourceUIPart =>
|
||||
part.type === 'source',
|
||||
)}
|
||||
/>
|
||||
)}
|
||||
);
|
||||
return (
|
||||
<Box
|
||||
$css={`
|
||||
animation: fade-in 0.2s ease-out;
|
||||
`}
|
||||
>
|
||||
<SourceItemList
|
||||
parts={sourceParts}
|
||||
getMetadata={getMetadata}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
})()}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
@@ -735,12 +825,15 @@ export const Chat = ({
|
||||
{status !== 'ready' && status !== 'streaming' && status !== 'error' && (
|
||||
<Box
|
||||
$direction="row"
|
||||
$align="center"
|
||||
$align="start"
|
||||
$gap="6px"
|
||||
$width="100%"
|
||||
$maxWidth="750px"
|
||||
$margin={{ all: 'auto', top: 'base', bottom: 'md' }}
|
||||
$padding={{ left: '13px' }}
|
||||
$padding={{ left: '13px', bottom: 'md' }}
|
||||
$css={`
|
||||
${streamingMessageHeight ? `min-height: ${streamingMessageHeight}px;` : ''}
|
||||
`}
|
||||
>
|
||||
<Loader />
|
||||
<Text $variation="600" $size="md">
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { Button } from '@openfun/cunningham-react';
|
||||
import React from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import { useToast } from '@/components';
|
||||
import { Box, useToast } from '@/components';
|
||||
import { scoreMessage } from '@/features/chat/api/useScoreMessage';
|
||||
|
||||
interface FeedbackButtonsProps {
|
||||
@@ -12,34 +12,68 @@ interface FeedbackButtonsProps {
|
||||
|
||||
const ThumbUp = () => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M6.98683 2.2102C7.63449 1.13117 9.1595 1.02836 9.94591 2.01088C10.3165 2.47409 10.4362 3.09014 10.2658 3.65838L9.61836 5.81531H12.5963C13.9605 5.81547 14.9515 7.11253 14.5929 8.42873L13.2304 13.4242C12.9849 14.3246 12.167 14.9496 11.2338 14.9497H4.48701C4.48261 14.9498 4.4782 14.9504 4.47377 14.9504C4.46935 14.9504 4.46494 14.9498 4.46053 14.9497H2.40395C1.81297 14.9496 1.3336 14.4703 1.3335 13.8793V6.88577C1.33364 6.29479 1.81297 5.81546 2.40395 5.81531H4.37899C4.65463 5.81531 4.91031 5.67038 5.05221 5.4341L6.98683 2.2102ZM8.94306 2.81372C8.71594 2.53004 8.27512 2.55927 8.08795 2.87087L6.15402 6.09478C5.91175 6.49857 5.54322 6.80023 5.11632 6.96312V13.6653H11.2338C11.5877 13.6652 11.8975 13.4277 11.9906 13.0862L13.3531 8.09073C13.4889 7.59167 13.1136 7.09987 12.5963 7.09972H9.33123C8.61423 7.09972 8.1 6.40809 8.30608 5.72123L9.03505 3.28971C9.08409 3.12575 9.04993 2.94742 8.94306 2.81372ZM2.6186 7.09972V13.6653H3.83122V7.09972H2.6186Z"
|
||||
fill="#555E74"
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M10.48 3.31533C11.4515 1.69679 13.739 1.54257 14.9186 3.01635C15.4744 3.71116 15.654 4.63525 15.3984 5.4876L14.4273 8.723H18.8941C20.9405 8.72323 22.427 10.6688 21.8891 12.6431L19.8454 20.1363C19.4771 21.4869 18.2502 22.4245 16.8505 22.4246H6.73028C6.72367 22.4247 6.71705 22.4256 6.71041 22.4256C6.70377 22.4256 6.69716 22.4247 6.69055 22.4246H3.60568C2.71921 22.4244 2.00016 21.7055 2 20.8189V10.3287C2.00022 9.44222 2.71921 8.72323 3.60568 8.723H6.56824C6.9817 8.723 7.36522 8.5056 7.57807 8.15119L10.48 3.31533ZM13.4143 4.22061C13.0737 3.79509 12.4124 3.83894 12.1317 4.30633L9.23079 9.14219C8.86738 9.74788 8.31458 10.2004 7.67424 10.4447V20.498H16.8505C17.3813 20.4979 17.846 20.1415 17.9857 19.6293L20.0294 12.1361C20.2331 11.3875 19.6701 10.6498 18.8941 10.6496H13.9966C12.9211 10.6496 12.1498 9.61217 12.4589 8.58188L13.5523 4.9346C13.6259 4.68866 13.5747 4.42117 13.4143 4.22061ZM3.92765 10.6496V20.498H5.74659V10.6496H3.92765Z"
|
||||
fill="#1C1B1F"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
const ThumbDown = () => (
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="14"
|
||||
height="13"
|
||||
viewBox="0 0 14 13"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M10.2337 0C11.1669 7.56911e-05 11.9848 0.581603 12.2304 1.41911L13.5928 6.06606C13.9516 7.29054 12.9605 8.49766 11.5962 8.4978H8.61901L9.26573 10.5036C9.43623 11.0323 9.31647 11.6052 8.94585 12.0362C8.15943 12.9505 6.63442 12.8547 5.98679 11.8508L4.05218 8.85177C3.91028 8.63201 3.65459 8.4978 3.37897 8.4978H1.40394C0.812993 8.49766 0.333647 8.05181 0.333496 7.50203V0.995775C0.333647 0.44603 0.812973 0.000140027 1.40394 0H10.2337ZM4.1163 7.42877C4.54333 7.58028 4.91166 7.86149 5.15399 8.23719L7.0879 11.2362C7.27505 11.5263 7.71589 11.5535 7.94301 11.2893L7.97994 11.2414C8.05762 11.1242 8.07805 10.9809 8.035 10.8472L7.30604 8.58467C7.09997 7.9457 7.6142 7.30235 8.33118 7.30235H11.5962C12.1136 7.30221 12.4891 6.84482 12.353 6.38048L10.9906 1.73353C10.8975 1.41589 10.5876 1.19552 10.2337 1.19545H4.1163V7.42877ZM1.61859 7.30235H2.83121V1.19545H1.61859V7.30235Z"
|
||||
fill="#555E74"
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M16.8504 3C18.2501 3.00011 19.477 3.8724 19.8453 5.12866L21.889 12.0991C22.4272 13.9358 20.9405 15.7465 18.894 15.7467H14.4283L15.3984 18.7554C15.6541 19.5485 15.4745 20.4078 14.9185 21.0543C13.7389 22.4257 11.4514 22.2821 10.4799 20.7761L7.57803 16.2777C7.36518 15.948 6.98164 15.7467 6.56822 15.7467H3.60567C2.71925 15.7465 2.00023 15.0777 2 14.253V4.49366C2.00023 3.66904 2.71922 3.00021 3.60567 3H16.8504ZM7.6742 14.1432C8.31475 14.3704 8.86725 14.7922 9.23074 15.3558L12.1316 19.8543C12.4123 20.2894 13.0736 20.3302 13.4143 19.934L13.4697 19.8621C13.5862 19.6864 13.6168 19.4713 13.5523 19.2708L12.4588 15.877C12.1497 14.9185 12.9211 13.9535 13.9965 13.9535H18.894C19.6701 13.9533 20.2334 13.2672 20.0293 12.5707L17.9856 5.6003C17.8459 5.12383 17.3812 4.79329 16.8504 4.79317H7.6742V14.1432ZM3.92764 13.9535H5.74656V4.79317H3.92764V13.9535Z"
|
||||
fill="#1C1B1F"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
const ThumbDownFilled = () => (
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M16.8504 3C18.2501 3.00011 19.477 3.8724 19.8453 5.12866L21.889 12.0991C22.4272 13.9358 20.9405 15.7465 18.894 15.7467H14.4283L15.3984 18.7554C15.6541 19.5485 15.4745 20.4078 14.9185 21.0543C13.7389 22.4257 11.4514 22.2821 10.4799 20.7761L7.57803 16.2777C7.36518 15.948 6.98163 15.7467 6.56822 15.7467H3.60567C2.71925 15.7465 2.00023 15.0777 2 14.253V4.49366C2.00023 3.66904 2.71922 3.00021 3.60567 3H16.8504ZM5.92764 13.4535C5.92764 13.7297 6.1515 13.9535 6.42764 13.9535H7.07803C7.35417 13.9535 7.57803 13.7297 7.57803 13.4535V5.29317C7.57803 5.01703 7.35417 4.79317 7.07803 4.79317H6.42764C6.1515 4.79317 5.92764 5.01703 5.92764 5.29317V13.4535Z"
|
||||
fill="#3E5DE7"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
|
||||
const ThumbUpFilled = () => (
|
||||
<svg
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"
|
||||
d="M10.48 3.31533C11.4515 1.69679 13.739 1.54257 14.9186 3.01635C15.4744 3.71116 15.654 4.63525 15.3984 5.4876L14.4273 8.723H18.8941C20.9405 8.72323 22.427 10.6688 21.8891 12.6431L19.8454 20.1363C19.4771 21.4869 18.2502 22.4245 16.8505 22.4246H6.73028C6.72367 22.4247 6.71705 22.4256 6.71041 22.4256C6.70378 22.4256 6.69716 22.4247 6.69055 22.4246H3.60568C2.71921 22.4244 2.00016 21.7055 2 20.8189V10.3287C2.00022 9.44222 2.71921 8.72323 3.60568 8.723H6.56824C6.9817 8.723 7.36522 8.5056 7.57807 8.15119L10.48 3.31533ZM6.42765 10.6496C6.15151 10.6496 5.92765 10.8735 5.92765 11.1496V19.998C5.92765 20.2741 6.15151 20.498 6.42765 20.498H7C7.27614 20.498 7.5 20.2741 7.5 19.998V11.1496C7.5 10.8735 7.27614 10.6496 7 10.6496H6.42765Z"
|
||||
fill="#3E5DE7"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
@@ -50,6 +84,9 @@ export const FeedbackButtons = ({
|
||||
}: FeedbackButtonsProps) => {
|
||||
const { t } = useTranslation();
|
||||
const { showToast } = useToast();
|
||||
const [selectedFeedback, setSelectedFeedback] = useState<
|
||||
'positive' | 'negative' | null
|
||||
>(null);
|
||||
|
||||
const handleScore = async (value: 'positive' | 'negative') => {
|
||||
if (!conversationId) {
|
||||
@@ -63,29 +100,32 @@ export const FeedbackButtons = ({
|
||||
value,
|
||||
});
|
||||
|
||||
showToast(
|
||||
'success',
|
||||
value === 'positive'
|
||||
? t('Positive feedback sent')
|
||||
: t('Negative feedback sent'),
|
||||
'check_circle',
|
||||
3000,
|
||||
);
|
||||
setSelectedFeedback(value);
|
||||
} catch (error) {
|
||||
setSelectedFeedback(value);
|
||||
console.error('Error sending feedback:', error);
|
||||
showToast('error', t('Failed to send feedback'), 'error', 3000);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Box
|
||||
$direction="row"
|
||||
$gap="4px"
|
||||
$css={`
|
||||
button svg {
|
||||
width: 16px !important;
|
||||
height: 16px !important;
|
||||
}
|
||||
`}
|
||||
>
|
||||
<Button
|
||||
size="small"
|
||||
onClick={() => {
|
||||
void handleScore('positive');
|
||||
}}
|
||||
aria-label={t('Feedback positif')}
|
||||
icon={<ThumbUp />}
|
||||
icon={selectedFeedback === 'positive' ? <ThumbUpFilled /> : <ThumbUp />}
|
||||
className="c__button--neutral c__button--neutral--icon action-chat-button"
|
||||
/>
|
||||
<Button
|
||||
@@ -94,9 +134,11 @@ export const FeedbackButtons = ({
|
||||
void handleScore('negative');
|
||||
}}
|
||||
aria-label={t('Feedback Négatif')}
|
||||
icon={<ThumbDown />}
|
||||
icon={
|
||||
selectedFeedback === 'negative' ? <ThumbDownFilled /> : <ThumbDown />
|
||||
}
|
||||
className="c__button--neutral c__button--neutral--icon action-chat-button"
|
||||
/>
|
||||
</>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -162,9 +162,8 @@ export const InputChat = ({
|
||||
{messagesLength === 0 && (
|
||||
<Box
|
||||
$padding={{ all: 'base', bottom: 'md' }}
|
||||
$background="white"
|
||||
$align="center"
|
||||
$margin={{ horizontal: 'base', bottom: 'md', top: '0' }}
|
||||
$margin={{ horizontal: 'base', bottom: 'md', top: '-105px' }}
|
||||
>
|
||||
<Text as="h2" $size="xl" $weight="600" $margin={{ all: '0' }}>
|
||||
{t('What is on your mind?')}
|
||||
@@ -212,24 +211,24 @@ export const InputChat = ({
|
||||
}}
|
||||
style={{ width: '100%' }}
|
||||
>
|
||||
<Box
|
||||
$padding={{ bottom: `${isDesktop ? 'base' : ''}` }}
|
||||
$background="white"
|
||||
>
|
||||
<Box $padding={{ bottom: `${isDesktop ? 'base' : ''}` }}>
|
||||
<Box
|
||||
$flex={1}
|
||||
$radius="12px"
|
||||
$position="relative"
|
||||
$background="white"
|
||||
$css={`
|
||||
box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.08);
|
||||
border-radius: 12px;
|
||||
border: ${
|
||||
isDragActive
|
||||
? '2px dashed var(--c--theme--colors--primary-400)'
|
||||
: '1px solid var(--c--theme--colors--greyscale-200)'
|
||||
};
|
||||
position: relative;
|
||||
background: white;
|
||||
transition: all 0.2s ease;
|
||||
`}
|
||||
box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.08);
|
||||
border-radius: 12px;
|
||||
border: ${
|
||||
isDragActive
|
||||
? '2px dashed var(--c--theme--colors--primary-400)'
|
||||
: '1px solid var(--c--theme--colors--greyscale-200)'
|
||||
};
|
||||
position: relative;
|
||||
background: white;
|
||||
transition: all 0.2s ease;
|
||||
`}
|
||||
>
|
||||
<textarea
|
||||
ref={textareaRef}
|
||||
@@ -434,7 +433,10 @@ export const InputChat = ({
|
||||
size="small"
|
||||
type="button"
|
||||
disabled={!webSearchEnabled}
|
||||
onClick={onToggleWebSearch}
|
||||
onClick={() => {
|
||||
onToggleWebSearch();
|
||||
textareaRef.current?.focus();
|
||||
}}
|
||||
aria-label={t('Research on the web')}
|
||||
className="c__button--neutral research-web-button"
|
||||
icon={
|
||||
|
||||
@@ -14,17 +14,39 @@ const styles: Record<string, React.CSSProperties> = {
|
||||
},
|
||||
};
|
||||
|
||||
interface SourceItemProps {
|
||||
url: string;
|
||||
interface SourceMetadata {
|
||||
title: string | null;
|
||||
favicon: string | null;
|
||||
loading: boolean;
|
||||
error: boolean;
|
||||
}
|
||||
|
||||
export const SourceItem: React.FC<SourceItemProps> = ({ url }) => {
|
||||
const [title, setTitle] = useState<string | null>(null);
|
||||
const [favicon, setFavicon] = useState<string | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(false);
|
||||
interface SourceItemProps {
|
||||
url: string;
|
||||
metadata?: SourceMetadata;
|
||||
}
|
||||
|
||||
export const SourceItem: React.FC<SourceItemProps> = ({ url, metadata }) => {
|
||||
const [title, setTitle] = useState<string | null>(metadata?.title || null);
|
||||
const [favicon, setFavicon] = useState<string | null>(
|
||||
metadata?.favicon || null,
|
||||
);
|
||||
const [loading, setLoading] = useState(metadata ? metadata.loading : true);
|
||||
const [error, setError] = useState(metadata ? metadata.error : false);
|
||||
|
||||
useEffect(() => {
|
||||
if (metadata) {
|
||||
setTitle(metadata.title);
|
||||
setFavicon(metadata.favicon);
|
||||
setLoading(metadata.loading);
|
||||
setError(metadata.error);
|
||||
}
|
||||
}, [metadata]);
|
||||
|
||||
useEffect(() => {
|
||||
if (metadata && !metadata.loading) {
|
||||
return;
|
||||
}
|
||||
const fetchMetadata = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
@@ -98,10 +120,10 @@ export const SourceItem: React.FC<SourceItemProps> = ({ url }) => {
|
||||
}
|
||||
};
|
||||
|
||||
if (url) {
|
||||
if (url && (!metadata || metadata.loading)) {
|
||||
void fetchMetadata();
|
||||
}
|
||||
}, [url]);
|
||||
}, [url, metadata]);
|
||||
|
||||
// Fallback for favicon if none is found or if there's an error
|
||||
const renderFavicon = () => {
|
||||
|
||||
@@ -4,11 +4,22 @@ import React from 'react';
|
||||
import { Box } from '@/components';
|
||||
import { SourceItem } from '@/features/chat/components/SourceItem';
|
||||
|
||||
interface SourceItemListProps {
|
||||
parts: readonly SourceUIPart[];
|
||||
interface SourceMetadata {
|
||||
title: string | null;
|
||||
favicon: string | null;
|
||||
loading: boolean;
|
||||
error: boolean;
|
||||
}
|
||||
|
||||
export const SourceItemList: React.FC<SourceItemListProps> = ({ parts }) => {
|
||||
interface SourceItemListProps {
|
||||
parts: readonly SourceUIPart[];
|
||||
getMetadata: (url: string) => SourceMetadata | undefined;
|
||||
}
|
||||
|
||||
const SourceItemListComponent: React.FC<SourceItemListProps> = ({
|
||||
parts,
|
||||
getMetadata,
|
||||
}) => {
|
||||
if (parts.length === 0) {
|
||||
return null;
|
||||
}
|
||||
@@ -26,8 +37,16 @@ export const SourceItemList: React.FC<SourceItemListProps> = ({ parts }) => {
|
||||
`}
|
||||
>
|
||||
{parts.map((part) => (
|
||||
<SourceItem key={part.source.url} url={part.source.url} />
|
||||
<SourceItem
|
||||
key={part.source.url}
|
||||
url={part.source.url}
|
||||
metadata={getMetadata(part.source.url)}
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
SourceItemListComponent.displayName = 'SourceItemList';
|
||||
|
||||
export const SourceItemList = React.memo(SourceItemListComponent);
|
||||
|
||||
@@ -7,11 +7,13 @@ import { Box, Loader, Text } from '@/components';
|
||||
interface ToolInvocationItemProps {
|
||||
toolInvocation: ToolInvocation;
|
||||
status?: string;
|
||||
hideSearchLoader?: boolean;
|
||||
}
|
||||
|
||||
export const ToolInvocationItem: React.FC<ToolInvocationItemProps> = ({
|
||||
toolInvocation,
|
||||
status,
|
||||
hideSearchLoader = false,
|
||||
}) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
@@ -54,7 +56,7 @@ export const ToolInvocationItem: React.FC<ToolInvocationItemProps> = ({
|
||||
|
||||
return (
|
||||
<>
|
||||
{status === 'streaming' && (
|
||||
{status === 'streaming' && !hideSearchLoader && (
|
||||
<Box
|
||||
$direction="row"
|
||||
$align="center"
|
||||
|
||||
@@ -1 +1,2 @@
|
||||
export { useChatScroll } from './useChatScroll';
|
||||
export { useSourceMetadataCache } from './useSourceMetadata';
|
||||
|
||||
@@ -1,49 +1,6 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
// Ref globale pour le conteneur de chat
|
||||
let chatContainerRef: React.RefObject<HTMLDivElement | null> = {
|
||||
current: null,
|
||||
};
|
||||
|
||||
export const setChatContainerRef = (
|
||||
ref: React.RefObject<HTMLDivElement | null>,
|
||||
) => {
|
||||
chatContainerRef = ref;
|
||||
};
|
||||
import { useScrollStore } from '../stores/useScrollStore';
|
||||
|
||||
export const useChatScroll = () => {
|
||||
const [isAtTop, setIsAtTop] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
const handleScroll = () => {
|
||||
if (chatContainerRef.current) {
|
||||
const scrollTop = chatContainerRef.current.scrollTop;
|
||||
const newIsAtTop = scrollTop <= 5;
|
||||
setIsAtTop(newIsAtTop);
|
||||
}
|
||||
};
|
||||
|
||||
// Attendre que le conteneur soit disponible
|
||||
const checkContainer = () => {
|
||||
if (chatContainerRef.current) {
|
||||
const container = chatContainerRef.current;
|
||||
container.addEventListener('scroll', handleScroll, { passive: true });
|
||||
|
||||
// Vérifier la position initiale
|
||||
handleScroll();
|
||||
|
||||
return () => {
|
||||
container.removeEventListener('scroll', handleScroll);
|
||||
};
|
||||
} else {
|
||||
// Réessayer après un court délai si le conteneur n'est pas encore disponible
|
||||
const timeoutId = setTimeout(checkContainer, 100);
|
||||
return () => clearTimeout(timeoutId);
|
||||
}
|
||||
};
|
||||
|
||||
return checkContainer();
|
||||
}, []);
|
||||
|
||||
const { isAtTop } = useScrollStore();
|
||||
return { isAtTop };
|
||||
};
|
||||
|
||||
@@ -0,0 +1,117 @@
|
||||
import { useState } from 'react';
|
||||
|
||||
interface SourceMetadata {
|
||||
title: string | null;
|
||||
favicon: string | null;
|
||||
loading: boolean;
|
||||
error: boolean;
|
||||
}
|
||||
|
||||
// Cache global pour éviter de refetch les mêmes URLs
|
||||
const metadataCache = new Map<string, SourceMetadata>();
|
||||
|
||||
export const useSourceMetadataCache = () => {
|
||||
const [cache, setCache] =
|
||||
useState<Map<string, SourceMetadata>>(metadataCache);
|
||||
|
||||
const prefetchMetadata = async (url: string) => {
|
||||
// Si déjà en cache, ne rien faire
|
||||
if (metadataCache.has(url)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Marquer comme en cours de chargement
|
||||
metadataCache.set(url, {
|
||||
title: null,
|
||||
favicon: null,
|
||||
loading: true,
|
||||
error: false,
|
||||
});
|
||||
setCache(new Map(metadataCache));
|
||||
|
||||
try {
|
||||
if (!url.startsWith('http')) {
|
||||
metadataCache.set(url, {
|
||||
title: url,
|
||||
favicon: '📄',
|
||||
loading: false,
|
||||
error: false,
|
||||
});
|
||||
setCache(new Map(metadataCache));
|
||||
return;
|
||||
}
|
||||
|
||||
const parser = new DOMParser();
|
||||
|
||||
let response;
|
||||
try {
|
||||
response = await fetch(url, {
|
||||
mode: 'cors',
|
||||
headers: {
|
||||
'User-Agent': 'Mozilla/5.0 (compatible; ChatBot/1.0)',
|
||||
},
|
||||
});
|
||||
} catch {
|
||||
// Si CORS échoue, utiliser juste le hostname
|
||||
metadataCache.set(url, {
|
||||
title: new URL(url).hostname,
|
||||
favicon: null,
|
||||
loading: false,
|
||||
error: false,
|
||||
});
|
||||
setCache(new Map(metadataCache));
|
||||
return;
|
||||
}
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}`);
|
||||
}
|
||||
|
||||
const html = await response.text();
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
|
||||
// Récupérer le titre
|
||||
const pageTitle =
|
||||
doc.querySelector('title')?.textContent || new URL(url).hostname;
|
||||
|
||||
// Récupérer le favicon
|
||||
let faviconUrl =
|
||||
doc.querySelector('link[rel="icon"]')?.getAttribute('href') ||
|
||||
doc.querySelector('link[rel="shortcut icon"]')?.getAttribute('href');
|
||||
|
||||
if (!faviconUrl) {
|
||||
const urlObj = new URL(url);
|
||||
faviconUrl = `${urlObj.origin}/favicon.ico`;
|
||||
}
|
||||
|
||||
// Convertir les URLs relatives en absolues
|
||||
if (faviconUrl && !faviconUrl.startsWith('http')) {
|
||||
const urlObj = new URL(url);
|
||||
faviconUrl = new URL(faviconUrl, urlObj.origin).href;
|
||||
}
|
||||
|
||||
metadataCache.set(url, {
|
||||
title: pageTitle,
|
||||
favicon: faviconUrl || null,
|
||||
loading: false,
|
||||
error: false,
|
||||
});
|
||||
setCache(new Map(metadataCache));
|
||||
} catch (err) {
|
||||
console.log('Error fetching metadata for:', url, err);
|
||||
metadataCache.set(url, {
|
||||
title: new URL(url).hostname,
|
||||
favicon: null,
|
||||
loading: false,
|
||||
error: true,
|
||||
});
|
||||
setCache(new Map(metadataCache));
|
||||
}
|
||||
};
|
||||
|
||||
const getMetadata = (url: string): SourceMetadata | undefined => {
|
||||
return cache.get(url);
|
||||
};
|
||||
|
||||
return { prefetchMetadata, getMetadata, cache };
|
||||
};
|
||||
@@ -0,0 +1,11 @@
|
||||
import { create } from 'zustand';
|
||||
|
||||
interface ScrollState {
|
||||
isAtTop: boolean;
|
||||
setIsAtTop: (isAtTop: boolean) => void;
|
||||
}
|
||||
|
||||
export const useScrollStore = create<ScrollState>((set) => ({
|
||||
isAtTop: true,
|
||||
setIsAtTop: (isAtTop) => set({ isAtTop }),
|
||||
}));
|
||||
@@ -44,7 +44,7 @@ export const Header = () => {
|
||||
height: ${isDesktop ? HEADER_HEIGHT : '52'}px;
|
||||
padding: 0 ${spacingsTokens['base']};
|
||||
background-color: ${colorsTokens['greyscale-000']};
|
||||
border-bottom: ${isDesktop && isAtTop
|
||||
border-bottom: ${isAtTop
|
||||
? `1px solid transparent`
|
||||
: `1px solid ${colorsTokens['greyscale-100']}`};
|
||||
transition: border-bottom 0.2s ease;
|
||||
|
||||
+1
-1
@@ -53,7 +53,7 @@ export const ConversationItemActions = ({
|
||||
&:hover {
|
||||
background-color: #e1e3e7 !important;
|
||||
}
|
||||
&:focus {
|
||||
&:focus-visible {
|
||||
outline: 2px solid #3e5de7;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
+1
@@ -34,6 +34,7 @@ export const LeftPanelConversationItem = ({
|
||||
$css={css`
|
||||
border-radius: 4px;
|
||||
width: 100%;
|
||||
margin-bottom: 1px;
|
||||
background-color: ${isCurrentConversation ? '#ebedf1' : ''};
|
||||
font-weight: ${isCurrentConversation ? '700' : '500'};
|
||||
transition: background-color 0.2s cubic-bezier(1, 0, 0, 1);
|
||||
|
||||
@@ -131,16 +131,6 @@ nextjs-portal {
|
||||
background-color: inherit !important;
|
||||
}
|
||||
|
||||
.mainContent-chat a {
|
||||
color: var(--c--theme--colors--primary-text) !important;
|
||||
}
|
||||
|
||||
.mainContent-chat a:hover {
|
||||
color: var(
|
||||
--c--components--button--primary--background--color-hover
|
||||
) !important;
|
||||
}
|
||||
|
||||
ul a {
|
||||
color: var(--c--theme--colors--greyscale-700) !important;
|
||||
}
|
||||
@@ -159,6 +149,20 @@ ul a:hover {
|
||||
}
|
||||
}
|
||||
|
||||
.mainContent-chat code {
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
.mainContent-chat a {
|
||||
color: var(--c--theme--colors--primary-text) !important;
|
||||
}
|
||||
|
||||
.mainContent-chat a:hover {
|
||||
color: var(
|
||||
--c--components--button--primary--background--color-hover
|
||||
) !important;
|
||||
}
|
||||
|
||||
.lasuite-gaufre-btn.lasuite--gaufre-opened {
|
||||
box-shadow: none !important;
|
||||
}
|
||||
@@ -179,7 +183,6 @@ ul a:hover {
|
||||
}
|
||||
|
||||
.research-web-button:focus {
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
@@ -232,7 +235,3 @@ figure[data-rehype-pretty-code-figure] > pre {
|
||||
figure[data-rehype-pretty-code-figure] > pre > code {
|
||||
display: block;
|
||||
}
|
||||
|
||||
code {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user