diff --git a/backend/users/serializers.py b/backend/users/serializers.py index ee5ef33..780677f 100644 --- a/backend/users/serializers.py +++ b/backend/users/serializers.py @@ -2,6 +2,17 @@ from django.contrib.auth.models import User from django.contrib.auth.hashers import make_password +class UserPublicSerializer(serializers.ModelSerializer): + class Meta: + model = User + fields = [ + 'id', + 'username', + 'email', + 'first_name', + 'last_name', + ] + class UserSerializer(serializers.ModelSerializer): avatar = serializers.ImageField(required=False) custom_json = serializers.JSONField(required=False) diff --git a/backend/users/urls.py b/backend/users/urls.py index f6710ca..52aad89 100644 --- a/backend/users/urls.py +++ b/backend/users/urls.py @@ -5,5 +5,6 @@ app_name = 'users' urlpatterns = [ + path('', views.UserList.as_view()), path('me/', views.MyAccount.as_view()), ] diff --git a/backend/users/views.py b/backend/users/views.py index 0f493fc..3b03690 100644 --- a/backend/users/views.py +++ b/backend/users/views.py @@ -1,10 +1,15 @@ -from rest_framework import permissions, status +from django.contrib.auth.models import User + +from rest_framework import permissions, status, generics from rest_framework.views import APIView from rest_framework.response import Response -from .serializers import UserSerializer +from .serializers import UserPublicSerializer, UserSerializer +class UserList(generics.ListAPIView): + queryset = User.objects.all() + serializer_class = UserPublicSerializer class MyAccount(APIView): permissions=[permissions.IsAuthenticated, permissions.AllowAny] diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 61f7d63..d4b3e47 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -14,6 +14,7 @@ "antd": "^4.19.5", "axios": "^0.26.1", "react": "^17.0.2", + "react-chat-engine-advanced": "^0.1.7", "react-dom": "^17.0.2", "react-scripts": "5.0.0", "web-vitals": "^2.1.4" @@ -3648,6 +3649,14 @@ "@types/react": "*" } }, + "node_modules/@types/react-scroll": { + "version": "1.8.3", + "resolved": "https://registry.npmjs.org/@types/react-scroll/-/react-scroll-1.8.3.tgz", + "integrity": "sha512-Xt0+Y58pwrIv+vRFxcyKDoo0gBWBR2eNMJ4XRMhQpZdGUtmjnszPi/wFEJSAY+5r83ypJsSA+hOpSc3hRpYlWw==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -5066,8 +5075,6 @@ "resolved": "https://registry.npmjs.org/bufferutil/-/bufferutil-4.0.6.tgz", "integrity": "sha512-jduaYOYtnio4aIAyc6UbvPCVcgq7nYpVnucyxr6eCYg/Woad9Hf/oxxBRDnGGjPfjUm6j5O/uBWhIu4iLebFaw==", "hasInstallScript": true, - "optional": true, - "peer": true, "dependencies": { "node-gyp-build": "^4.3.0" }, @@ -6010,6 +6017,15 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" }, + "node_modules/d": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz", + "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==", + "dependencies": { + "es5-ext": "^0.10.50", + "type": "^1.0.1" + } + }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -6566,6 +6582,39 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/es5-ext": { + "version": "0.10.60", + "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.60.tgz", + "integrity": "sha512-jpKNXIt60htYG59/9FGf2PYT3pwMpnEbNKysU+k/4FGwyGtMotOvcZOuW+EmXXYASRqYSXQfGL5cVIthOTgbkg==", + "hasInstallScript": true, + "dependencies": { + "es6-iterator": "^2.0.3", + "es6-symbol": "^3.1.3", + "next-tick": "^1.1.0" + }, + "engines": { + "node": ">=0.10" + } + }, + "node_modules/es6-iterator": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz", + "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=", + "dependencies": { + "d": "1", + "es5-ext": "^0.10.35", + "es6-symbol": "^3.1.1" + } + }, + "node_modules/es6-symbol": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz", + "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==", + "dependencies": { + "d": "^1.0.1", + "ext": "^1.1.2" + } + }, "node_modules/escalade": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", @@ -7433,6 +7482,19 @@ } ] }, + "node_modules/ext": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/ext/-/ext-1.6.0.tgz", + "integrity": "sha512-sdBImtzkq2HpkdRLtlLWDa6w4DX22ijZLKx8BMPUuKe1c5lbN6xwQDQCxSfxBQnHZ13ls/FH0MQZx/q/gr6FQg==", + "dependencies": { + "type": "^2.5.0" + } + }, + "node_modules/ext/node_modules/type": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/type/-/type-2.6.0.tgz", + "integrity": "sha512-eiDBDOmkih5pMbo9OqsqPRGMljLodLcwd5XD5JbtNB0o89xZAwynY9EdCDsJU7LtcVCClu9DvM7/0Ep1hYX3EQ==" + }, "node_modules/fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", @@ -10982,6 +11044,11 @@ "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, + "node_modules/lodash-es": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", + "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" + }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -11002,6 +11069,11 @@ "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz", "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=" }, + "node_modules/lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=" + }, "node_modules/lodash.uniq": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz", @@ -11354,6 +11426,25 @@ "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz", "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" }, + "node_modules/next-tick": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz", + "integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==" + }, + "node_modules/nextjs-websocket": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/nextjs-websocket/-/nextjs-websocket-1.0.7.tgz", + "integrity": "sha512-fVqLhTQGj7DEXtAESqRJck+vY1Dn53YEQ1hgQS/M+eIVfP54hyU62nhwgTLOBkmDAzSbxAY2VSa4OlnhCrHgRQ==", + "dependencies": { + "websocket": "^1.0.33" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.1" + } + }, "node_modules/no-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", @@ -11375,8 +11466,6 @@ "version": "4.4.0", "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.4.0.tgz", "integrity": "sha512-amJnQCcgtRVw9SvoebO3BKGESClrfXGCUTX9hSn1OuGQTQBOZmVd0Z0OlecpuRksKvbsUqALE8jls/ErClAPuQ==", - "optional": true, - "peer": true, "bin": { "node-gyp-build": "bin.js", "node-gyp-build-optional": "optional.js", @@ -13886,6 +13975,34 @@ "node": ">=14" } }, + "node_modules/react-chat-engine-advanced": { + "version": "0.1.7", + "resolved": "https://registry.npmjs.org/react-chat-engine-advanced/-/react-chat-engine-advanced-0.1.7.tgz", + "integrity": "sha512-J7MfoPU8kn76inNLgDuKH/koxPng4POE+FsYWyBAA2L0wgzkOW0RMPtOy0Slzi6L5lKYMgFjdiZgRuopZlxMXA==", + "dependencies": { + "@types/react-scroll": "^1.8.3", + "axios": "^0.24.0", + "lodash": "^4.17.21", + "lodash-es": "^4.17.21", + "nextjs-websocket": "^1.0.7", + "react-grid-system": "^7.3.2", + "react-scroll": "^1.8.4" + }, + "engines": { + "node": ">=10" + }, + "peerDependencies": { + "react": ">=16" + } + }, + "node_modules/react-chat-engine-advanced/node_modules/axios": { + "version": "0.24.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.24.0.tgz", + "integrity": "sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA==", + "dependencies": { + "follow-redirects": "^1.14.4" + } + }, "node_modules/react-dev-utils": { "version": "12.0.0", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.0.tgz", @@ -14021,6 +14138,17 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz", "integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA==" }, + "node_modules/react-grid-system": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/react-grid-system/-/react-grid-system-7.3.2.tgz", + "integrity": "sha512-SR5FKJvvN+Sl/OqSpyhLaesfc2cHKxFlP5xL53jUp3m+vF40OYiJbCuW+U43YeNEZQUfR38K3Ec+dVxl9y6MUg==", + "dependencies": { + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.x" + } + }, "node_modules/react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -14106,6 +14234,19 @@ } } }, + "node_modules/react-scroll": { + "version": "1.8.6", + "resolved": "https://registry.npmjs.org/react-scroll/-/react-scroll-1.8.6.tgz", + "integrity": "sha512-VbbvjzLXvCjr2kiiG/lpLFim6mHpkXMdvOXQqwoSnUKyQPNmAo72r46x9C5PTLPSJq/dBd0gwrlZnnxqj5Yz1Q==", + "dependencies": { + "lodash.throttle": "^4.1.1", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": "^15.5.4 || ^16.0.0 || ^17.0.0", + "react-dom": "^15.5.4 || ^16.0.0 || ^17.0.0" + } + }, "node_modules/readable-stream": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", @@ -15738,6 +15879,11 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==" }, + "node_modules/type": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz", + "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==" + }, "node_modules/type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", @@ -15905,8 +16051,6 @@ "resolved": "https://registry.npmjs.org/utf-8-validate/-/utf-8-validate-5.0.9.tgz", "integrity": "sha512-Yek7dAy0v3Kl0orwMlvi7TPtiCNrdfHNd7Gcc/pLq4BLXqfAmd0J7OWMizUQnTTJsyjKn02mU7anqwfmUP4J8Q==", "hasInstallScript": true, - "optional": true, - "peer": true, "dependencies": { "node-gyp-build": "^4.3.0" }, @@ -16373,6 +16517,22 @@ "node": ">=4.0" } }, + "node_modules/websocket": { + "version": "1.0.34", + "resolved": "https://registry.npmjs.org/websocket/-/websocket-1.0.34.tgz", + "integrity": "sha512-PRDso2sGwF6kM75QykIesBijKSVceR6jL2G8NGYyq2XrItNC2P5/qL5XeR056GhA+Ly7JMFvJb9I312mJfmqnQ==", + "dependencies": { + "bufferutil": "^4.0.1", + "debug": "^2.2.0", + "es5-ext": "^0.10.50", + "typedarray-to-buffer": "^3.1.5", + "utf-8-validate": "^5.0.2", + "yaeti": "^0.0.6" + }, + "engines": { + "node": ">=4.0.0" + } + }, "node_modules/websocket-driver": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz", @@ -16394,6 +16554,19 @@ "node": ">=0.8.0" } }, + "node_modules/websocket/node_modules/debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "dependencies": { + "ms": "2.0.0" + } + }, + "node_modules/websocket/node_modules/ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" + }, "node_modules/whatwg-encoding": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz", @@ -16875,6 +17048,14 @@ "node": ">=10" } }, + "node_modules/yaeti": { + "version": "0.0.6", + "resolved": "https://registry.npmjs.org/yaeti/-/yaeti-0.0.6.tgz", + "integrity": "sha1-8m9ITXJoTPQr7ft2lwqhYI+/lXc=", + "engines": { + "node": ">=0.10.32" + } + }, "node_modules/yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", @@ -19464,6 +19645,14 @@ "@types/react": "*" } }, + "@types/react-scroll": { + "version": "1.8.3", + "resolved": "https://registry.npmjs.org/@types/react-scroll/-/react-scroll-1.8.3.tgz", + "integrity": "sha512-Xt0+Y58pwrIv+vRFxcyKDoo0gBWBR2eNMJ4XRMhQpZdGUtmjnszPi/wFEJSAY+5r83ypJsSA+hOpSc3hRpYlWw==", + "requires": { + "@types/react": "*" + } + }, "@types/resolve": { "version": "1.17.1", "resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-1.17.1.tgz", @@ -20539,8 +20728,6 @@ "version": "4.0.6", "resolved": "https://registry.npmjs.org/bufferutil/-/bufferutil-4.0.6.tgz", "integrity": "sha512-jduaYOYtnio4aIAyc6UbvPCVcgq7nYpVnucyxr6eCYg/Woad9Hf/oxxBRDnGGjPfjUm6j5O/uBWhIu4iLebFaw==", - "optional": true, - "peer": true, "requires": { "node-gyp-build": "^4.3.0" } @@ -21215,6 +21402,15 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" }, + "d": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz", + "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==", + "requires": { + "es5-ext": "^0.10.50", + "type": "^1.0.1" + } + }, "damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -21639,6 +21835,35 @@ "is-symbol": "^1.0.2" } }, + "es5-ext": { + "version": "0.10.60", + "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.60.tgz", + "integrity": "sha512-jpKNXIt60htYG59/9FGf2PYT3pwMpnEbNKysU+k/4FGwyGtMotOvcZOuW+EmXXYASRqYSXQfGL5cVIthOTgbkg==", + "requires": { + "es6-iterator": "^2.0.3", + "es6-symbol": "^3.1.3", + "next-tick": "^1.1.0" + } + }, + "es6-iterator": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz", + "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=", + "requires": { + "d": "1", + "es5-ext": "^0.10.35", + "es6-symbol": "^3.1.1" + } + }, + "es6-symbol": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz", + "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==", + "requires": { + "d": "^1.0.1", + "ext": "^1.1.2" + } + }, "escalade": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", @@ -22263,6 +22488,21 @@ } } }, + "ext": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/ext/-/ext-1.6.0.tgz", + "integrity": "sha512-sdBImtzkq2HpkdRLtlLWDa6w4DX22ijZLKx8BMPUuKe1c5lbN6xwQDQCxSfxBQnHZ13ls/FH0MQZx/q/gr6FQg==", + "requires": { + "type": "^2.5.0" + }, + "dependencies": { + "type": { + "version": "2.6.0", + "resolved": "https://registry.npmjs.org/type/-/type-2.6.0.tgz", + "integrity": "sha512-eiDBDOmkih5pMbo9OqsqPRGMljLodLcwd5XD5JbtNB0o89xZAwynY9EdCDsJU7LtcVCClu9DvM7/0Ep1hYX3EQ==" + } + } + }, "fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", @@ -24796,6 +25036,11 @@ "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==" }, + "lodash-es": { + "version": "4.17.21", + "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", + "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" + }, "lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", @@ -24816,6 +25061,11 @@ "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz", "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=" }, + "lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=" + }, "lodash.uniq": { "version": "4.5.0", "resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz", @@ -25076,6 +25326,19 @@ "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.2.tgz", "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==" }, + "next-tick": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz", + "integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ==" + }, + "nextjs-websocket": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/nextjs-websocket/-/nextjs-websocket-1.0.7.tgz", + "integrity": "sha512-fVqLhTQGj7DEXtAESqRJck+vY1Dn53YEQ1hgQS/M+eIVfP54hyU62nhwgTLOBkmDAzSbxAY2VSa4OlnhCrHgRQ==", + "requires": { + "websocket": "^1.0.33" + } + }, "no-case": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz", @@ -25093,9 +25356,7 @@ "node-gyp-build": { "version": "4.4.0", "resolved": "https://registry.npmjs.org/node-gyp-build/-/node-gyp-build-4.4.0.tgz", - "integrity": "sha512-amJnQCcgtRVw9SvoebO3BKGESClrfXGCUTX9hSn1OuGQTQBOZmVd0Z0OlecpuRksKvbsUqALE8jls/ErClAPuQ==", - "optional": true, - "peer": true + "integrity": "sha512-amJnQCcgtRVw9SvoebO3BKGESClrfXGCUTX9hSn1OuGQTQBOZmVd0Z0OlecpuRksKvbsUqALE8jls/ErClAPuQ==" }, "node-int64": { "version": "0.4.0", @@ -26755,6 +27016,30 @@ "whatwg-fetch": "^3.6.2" } }, + "react-chat-engine-advanced": { + "version": "0.1.7", + "resolved": "https://registry.npmjs.org/react-chat-engine-advanced/-/react-chat-engine-advanced-0.1.7.tgz", + "integrity": "sha512-J7MfoPU8kn76inNLgDuKH/koxPng4POE+FsYWyBAA2L0wgzkOW0RMPtOy0Slzi6L5lKYMgFjdiZgRuopZlxMXA==", + "requires": { + "@types/react-scroll": "^1.8.3", + "axios": "^0.24.0", + "lodash": "^4.17.21", + "lodash-es": "^4.17.21", + "nextjs-websocket": "^1.0.7", + "react-grid-system": "^7.3.2", + "react-scroll": "^1.8.4" + }, + "dependencies": { + "axios": { + "version": "0.24.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-0.24.0.tgz", + "integrity": "sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA==", + "requires": { + "follow-redirects": "^1.14.4" + } + } + } + }, "react-dev-utils": { "version": "12.0.0", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.0.tgz", @@ -26856,6 +27141,14 @@ "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.10.tgz", "integrity": "sha512-mKR90fX7Pm5seCOfz8q9F+66VCc1PGsWSBxKbITjfKVQHMNF2zudxHnMdJiB1fRCb+XsbQV9sO9DCkgsMQgBIA==" }, + "react-grid-system": { + "version": "7.3.2", + "resolved": "https://registry.npmjs.org/react-grid-system/-/react-grid-system-7.3.2.tgz", + "integrity": "sha512-SR5FKJvvN+Sl/OqSpyhLaesfc2cHKxFlP5xL53jUp3m+vF40OYiJbCuW+U43YeNEZQUfR38K3Ec+dVxl9y6MUg==", + "requires": { + "prop-types": "^15.7.2" + } + }, "react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -26921,6 +27214,15 @@ "workbox-webpack-plugin": "^6.4.1" } }, + "react-scroll": { + "version": "1.8.6", + "resolved": "https://registry.npmjs.org/react-scroll/-/react-scroll-1.8.6.tgz", + "integrity": "sha512-VbbvjzLXvCjr2kiiG/lpLFim6mHpkXMdvOXQqwoSnUKyQPNmAo72r46x9C5PTLPSJq/dBd0gwrlZnnxqj5Yz1Q==", + "requires": { + "lodash.throttle": "^4.1.1", + "prop-types": "^15.7.2" + } + }, "readable-stream": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz", @@ -28138,6 +28440,11 @@ } } }, + "type": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz", + "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg==" + }, "type-check": { "version": "0.4.0", "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", @@ -28254,8 +28561,6 @@ "version": "5.0.9", "resolved": "https://registry.npmjs.org/utf-8-validate/-/utf-8-validate-5.0.9.tgz", "integrity": "sha512-Yek7dAy0v3Kl0orwMlvi7TPtiCNrdfHNd7Gcc/pLq4BLXqfAmd0J7OWMizUQnTTJsyjKn02mU7anqwfmUP4J8Q==", - "optional": true, - "peer": true, "requires": { "node-gyp-build": "^4.3.0" } @@ -28588,6 +28893,34 @@ "resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-3.2.3.tgz", "integrity": "sha512-/DyMEOrDgLKKIG0fmvtz+4dUX/3Ghozwgm6iPp8KRhvn+eQf9+Q7GWxVNMk3+uCPWfdXYC4ExGBckIXdFEfH1w==" }, + "websocket": { + "version": "1.0.34", + "resolved": "https://registry.npmjs.org/websocket/-/websocket-1.0.34.tgz", + "integrity": "sha512-PRDso2sGwF6kM75QykIesBijKSVceR6jL2G8NGYyq2XrItNC2P5/qL5XeR056GhA+Ly7JMFvJb9I312mJfmqnQ==", + "requires": { + "bufferutil": "^4.0.1", + "debug": "^2.2.0", + "es5-ext": "^0.10.50", + "typedarray-to-buffer": "^3.1.5", + "utf-8-validate": "^5.0.2", + "yaeti": "^0.0.6" + }, + "dependencies": { + "debug": { + "version": "2.6.9", + "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", + "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==", + "requires": { + "ms": "2.0.0" + } + }, + "ms": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=" + } + } + }, "websocket-driver": { "version": "0.7.4", "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz", @@ -29011,6 +29344,11 @@ "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz", "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==" }, + "yaeti": { + "version": "0.0.6", + "resolved": "https://registry.npmjs.org/yaeti/-/yaeti-0.0.6.tgz", + "integrity": "sha1-8m9ITXJoTPQr7ft2lwqhYI+/lXc=" + }, "yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 1f40957..6359635 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -9,6 +9,7 @@ "antd": "^4.19.5", "axios": "^0.26.1", "react": "^17.0.2", + "react-chat-engine-advanced": "^0.1.7", "react-dom": "^17.0.2", "react-scripts": "5.0.0", "web-vitals": "^2.1.4" diff --git a/frontend/src/App.css b/frontend/src/App.css index fd1cfe8..7ade3fa 100644 --- a/frontend/src/App.css +++ b/frontend/src/App.css @@ -4,15 +4,205 @@ font-family: Avenir; } +.bubble-1 { + position: absolute; + top: 84px; + left: -84px; + width: 324px; + height: 324px; + border-radius: 50%; + background-color: #f0aa86; +} + +.bubble-2 { + position: absolute; + top: 84px; + left: 184px; + width: 24px; + height: 24px; + border-radius: 50%; + background-color: #f0aa86; +} + +.bubble-3 { + position: absolute; + top: 124px; + left: 224px; + width: 94px; + height: 94px; + border-radius: 50%; + background-color: #f0aa86; +} + +.bubble-4 { + position: absolute; + bottom: 30px; + right: 70px; + width: 94px; + height: 94px; + border-radius: 50%; + background-color: #f0aa86; +} + +/* Components */ + .ce-avatar-status { width: 12px !important; height: 12px !important; } +.ce-avatar { + color: #f0f0f0 !important; +} + +.ce-default-button { + background-color: #f0aa86 !important; + border: none !important; + color: #f0f0f0 !important; +} +.ce-danger-button { + background-color: #f0aa86 !important; + border: none !important; + color: #f0f0f0 !important; +} +.ce-autocomplete-input { + background-color: #5c4e80 !important; + border: none !important; + color: #f0f0f0 !important; +} +.ce-autocomplete-input::placeholder { + color: #f0f0f0 !important; +} -.ce-message-form { - width: 105% !important; +/* Chat List */ + +.search-bar { + background-color: #5c4e80; + color: white; + border: none; + margin: 6px 12px 6px 12px; + outline: none; +} +.search-bar::placeholder { + color: white; +} +.ce-chat-list-column { + border: none !important; +} +.ce-chat-list { + background-color: #4e426d !important; +} +.ce-chat-form { + background-color: #4e426d !important; + color: #f0f0f0 !important; +} +.ce-chat-form-input { + border: none !important; + background-color: #5c4e80 !important; + color: #f0f0f0 !important; +} +.ce-chat-form-input::placeholder { + color: #bfbfbf !important; +} +.ce-chat-card { + background-color: #5c4e80 !important; +} +.ce-active-chat-card { + border: 1px solid #3ec7b6 !important; +} +.ce-chat-card-title { + color: #f0f0f0 !important; +} +.ce-chat-card-unread { + background-color: #3ec7b6 !important; +} +.ce-chat-card-subtitle { + color: #bfbfbf !important; + font-weight: 500 !important; +} +.ce-chat-card-time-stamp { + color: #bfbfbf !important; + font-weight: 500 !important; } +/* Chat Feed */ + +.ch-chat-feed { + background-color: #4e426d !important; +} +.ce-chat-header { + background-color: #4e426d !important; + color: #f0f0f0 !important; +} +.ce-spinner { + filter: invert(); +} +#ce-ice-breaker-gif { + max-width: 120px !important; + margin-top: 54px !important; +} +.ce-message-list { + background-color: #5c4e80 !important; + margin: 12px !important; + height: calc(100% - 156px) !important; + border-radius: 24px !important; +} +.ce-attachment-icon { + border: none !important; +} #msg-textarea { top: 4px !important; + left: 14px !important; + height: 32px !important; + padding: 5px 42px 4px 18px !important; + border-radius: 16px !important; + width: calc((100% - 24px) - 70px) !important; + font-size: 14px !important; +} +.ce-attachment-input { + left: -24px !important; +} +#ce-send-message-button { + left: -14px !important; + top: -8px !important; + background-color: #3ec7b6 !important; +} +.ce-message-date-text { + color: #f0f0f0 !important; +} +.ce-my-message-body { + background-color: #f0aa86 !important; +} +.ce-my-message-timestamp { + color: #f0aa86 !important; +} +.ce-their-message-body { + background-color: #4e426d !important; + color: #f0f0f0 !important; +} +.ce-their-message-timestamp { + color: #f0f0f0 !important; +} +.ce-their-message-sender-username { + color: #f0f0f0 !important; +} + +/* Chat Settings */ + +.ce-chat-settings-column { + border: none !important; +} + +.ce-chat-settings { + background-color: #4e426d !important; +} + +.ce-chat-settings-title { + color: #f0f0f0 !important; +} +.ce-dropdown { + border: none !important; + color: #f0f0f0 !important; +} +.ce-dropdown-label { + background-color: #4e426d !important; } diff --git a/frontend/src/context.js b/frontend/src/context.js index a9ac358..fde52bb 100644 --- a/frontend/src/context.js +++ b/frontend/src/context.js @@ -4,7 +4,9 @@ export const Context = createContext(); export const ContextProvider = (props) => { const [user, setUser] = useState(undefined); - const value = { user, setUser }; + const [userList, setUserList] = useState([]); + + const value = { user, setUser, userList, setUserList }; return {props.children}; }; diff --git a/frontend/src/pages/chats/ChatList/fetchUserList.js b/frontend/src/pages/chats/ChatList/fetchUserList.js new file mode 100644 index 0000000..e56587f --- /dev/null +++ b/frontend/src/pages/chats/ChatList/fetchUserList.js @@ -0,0 +1,8 @@ +import axios from "axios"; + +export const fetchUserList = (onSuccess, onError) => { + axios + .get("http://127.0.0.1:8000/users/", {}) + .then((r) => onSuccess(r)) + .catch((e) => onError(e.response.data)); +}; diff --git a/frontend/src/pages/chats/ChatList/getOrCreateChat.js b/frontend/src/pages/chats/ChatList/getOrCreateChat.js new file mode 100644 index 0000000..0e2d6f2 --- /dev/null +++ b/frontend/src/pages/chats/ChatList/getOrCreateChat.js @@ -0,0 +1,26 @@ +import axios from "axios"; + +export const getOrCreateChat = (user, otherUsername, onSuccess, onError) => { + console.log({ + "Project-Id": "70049943-b572-4372-9f3c-fbdeca940e0f", + "User-Name": user.username, + "User-Secret": user.hashed_password, + }); + axios + .put( + "https://api.chatengine.io/chats/", + { + usernames: [user.username, otherUsername], + is_direct_chat: true, + }, + { + headers: { + "Project-Id": "70049943-b572-4372-9f3c-fbdeca940e0f", + "User-Name": user.username, + "User-Secret": user.hashed_password, + }, + } + ) + .then((r) => onSuccess(r)) + .catch((e) => onError(e.response.data)); +}; diff --git a/frontend/src/pages/chats/ChatList/index.js b/frontend/src/pages/chats/ChatList/index.js new file mode 100644 index 0000000..9458b8a --- /dev/null +++ b/frontend/src/pages/chats/ChatList/index.js @@ -0,0 +1,114 @@ +import { useContext, useState, useEffect, useRef } from "react"; + +import { fetchUserList } from "./fetchUserList"; +import { getOrCreateChat } from "./getOrCreateChat"; + +import { Context } from "../../../context"; +import { Input, ChatCard } from "react-chat-engine-advanced"; + +const ChatList = (props) => { + const didMountRef = useRef(false); + const { user, userList, setUserList } = useContext(Context); + const [search, setSearch] = useState(""); + + useEffect(() => { + if (!didMountRef.current) { + didMountRef.current = true; + fetchUserList( + (r) => { + console.log(r.data.results); + setUserList(r.data.results); + }, + (e) => console.log(e) + ); + } + }); + + const getOtherUser = (chat) => { + let username = ""; + chat.people.map((person) => { + if (person.person.username !== user.username) { + username = person.person.first_name + " " + person.person.last_name; + } + }); + return username; + }; + + const renderChats = () => { + return props.chats.map((chat, index) => { + return ( + props.onChatCardClick(chat.id)} + /> + ); + }); + }; + + const renderSearch = () => { + return userList.map((otherUser, index) => { + const userStr = `${otherUser.username} ${otherUser.email} ${otherUser.first_name} ${otherUser.last_name}`; + + if ( + userStr.indexOf(search) !== -1 && + otherUser.username !== user.username && + otherUser.username !== "admin" + ) { + return ( + + getOrCreateChat( + user, + otherUser.username, + (r) => { + setSearch(""); + props.onChatCardClick(r.data.id); + }, + (e) => console.log(e) + ) + } + /> + ); + } else { + return
; + } + }); + }; + + return ( +
+ setSearch(e.target.value)} + className="search-bar" + /> + + {search.length > 0 ? renderSearch() : renderChats()} +
+ ); +}; + +export default ChatList; diff --git a/frontend/src/pages/chats/Header/index.js b/frontend/src/pages/chats/Header/index.js index 9e365c8..f66c14f 100644 --- a/frontend/src/pages/chats/Header/index.js +++ b/frontend/src/pages/chats/Header/index.js @@ -19,7 +19,13 @@ const Header = () => { }; return ( -
+
{ const { user } = useContext(Context); + const chatProps = useMultiChatLogic( + projectId, + user.username, + user.hashed_password + ); + if (!user) { return
; } else { return ( -
+
- {user.first_name}'s chats... + +
+
+
+
+
+ + + ( + + )} + style={{ + position: "absolute", + top: "calc(10vh + 64px)", + left: "10vw", + height: "calc(80vh - 64px)", + width: "80vw", + border: "1px solid black", + boxShadow: + "rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset", + }} + /> +
); }