lots of user models

daxaxelrod · Dec 16, 2023 · fecd0c9 · fecd0c9
1 parent 46f3e46
commit fecd0c9
Show file tree

Hide file tree

Showing 10 changed files with 623 additions and 308 deletions.
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/package.json b/frontend/package.json
@@ -15,7 +15,7 @@
         "@types/node": "^17.0.45",
         "@types/styled-components": "^5.1.26",
         "@types/three": "^0.152.1",
-        "antd": "^5.0.0",
+        "antd": "^5.12.2",
         "axios": "^0.27.2",
         "axios-jwt": "^1.8.0",
         "chart.js": "^3.8.2",

diff --git a/frontend/src/app/components/users/profile/UserHeader.tsx b/frontend/src/app/components/users/profile/UserHeader.tsx
@@ -20,12 +20,24 @@ export default function UserHeader({ user }: { user: User }) {
                     marginBottom: ".25rem",
                 }}
             >
-                {user?.linkedin_url && (
-                    <LinkedinOutlined style={{ color: colors.linkColor }} />
-                )}
-                {user?.twitter_url && (
-                    <TwitterOutlined style={{ color: colors.linkColor }} />
-                )}
+                {user?.linkedin_url ? (
+                    <a
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        href={user.linkedin_url}
+                    >
+                        <LinkedinOutlined style={{ color: colors.linkColor }} />
+                    </a>
+                ) : null}
+                {user?.twitter_url ? (
+                    <a
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        href={user.twitter_url}
+                    >
+                        <TwitterOutlined style={{ color: colors.linkColor }} />
+                    </a>
+                ) : null}
             </Flex>
             <Paragraph
                 style={{

diff --git a/frontend/src/app/components/users/profile/UserOpenInsureRating.tsx b/frontend/src/app/components/users/profile/UserOpenInsureRating.tsx
@@ -6,6 +6,8 @@ import { Typography } from "antd";
 import { ReloadOutlined } from "@ant-design/icons";
 import { useAppDispatch, useAppSelector } from "../../../../redux/hooks";
 import { getUserRepuation } from "../../../../redux/actions/users";
+import { Collapse } from "antd";
+import RatingDetails from "./ratings/RatingDetails";
 
 const { Title, Paragraph } = Typography;
 
@@ -19,6 +21,8 @@ export default function UserOpenInsureRating({ user }: { user: User }) {
 
     const hasScore = !!total_score;
 
+    console.log("reputation", reputation);
+
     const scoreLeaderText = useMemo(() => {
         if (total_score) {
             if (total_score >= 80) {
@@ -40,76 +44,92 @@ export default function UserOpenInsureRating({ user }: { user: User }) {
         dispatch(getUserRepuation(user.id));
     };
 
-    return (
-        <>
-            <Flex>
+    const reputationHeader = (
+        <Flex>
+            <div
+                style={{
+                    position: "absolute",
+                    top: 0,
+                    right: 0,
+                    zIndex: 1,
+                }}
+            >
                 <div
+                    onClick={getReputation}
                     style={{
-                        position: "absolute",
-                        top: 0,
-                        right: 0,
-                        zIndex: 1,
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        flexDirection: "row",
                     }}
                 >
-                    <div
-                        onClick={getReputation}
+                    {getReputationPending ? (
+                        <Spin />
+                    ) : (
+                        <ReloadOutlined style={{ color: colors.gray7 }} />
+                    )}
+                    <Paragraph
                         style={{
-                            cursor: "pointer",
-                            display: "flex",
-                            alignItems: "center",
-                            justifyContent: "center",
-                            flexDirection: "row",
+                            marginLeft: 6,
+                            marginBottom: 0,
+                            color: colors.gray9,
                         }}
                     >
-                        {getReputationPending ? (
-                            <Spin />
-                        ) : (
-                            <ReloadOutlined style={{ color: colors.gray7 }} />
-                        )}
-                        <Paragraph
+                        Refresh
+                    </Paragraph>
+                </div>
+            </div>
+            <Progress
+                type="dashboard"
+                percent={total_score || 0}
+                strokeColor={{
+                    "0%": colors.good,
+                    "100%": colors.lightGood,
+                }}
+                format={(percent) => (
+                    <div>
+                        {percent}
+                        <div
                             style={{
-                                marginLeft: 6,
-                                marginBottom: 0,
-                                color: colors.gray9,
+                                color: colors.gray8,
+                                fontSize: 12,
+                                marginTop: 4,
                             }}
                         >
-                            Refresh
-                        </Paragraph>
-                    </div>
-                </div>
-                <Progress
-                    type="dashboard"
-                    percent={total_score || 0}
-                    strokeColor={{
-                        "0%": colors.good,
-                        "100%": colors.lightGood,
-                    }}
-                    format={(percent) => (
-                        <div>
-                            {percent}
-                            <div
-                                style={{
-                                    color: colors.gray8,
-                                    fontSize: 12,
-                                    marginTop: 4,
-                                }}
-                            >
-                                Score
-                            </div>
+                            Score
                         </div>
-                    )}
-                />
-                <Col sm={{ offset: 2 }}>
-                    <Title level={4}>{scoreLeaderText}</Title>
-                    {hasScore ? (
-                        <Paragraph style={{ color: colors.gray8 }}></Paragraph>
-                    ) : (
-                        <Paragraph style={{ color: colors.gray8 }}>
-                            Seems like you dont have a score yet
-                        </Paragraph>
-                    )}
-                </Col>
-            </Flex>
-        </>
+                    </div>
+                )}
+            />
+            <Col sm={{ offset: 2 }}>
+                <Title level={4}>{scoreLeaderText}</Title>
+                {hasScore ? (
+                    <Paragraph style={{ color: colors.gray8 }}></Paragraph>
+                ) : (
+                    <Paragraph style={{ color: colors.gray8 }}>
+                        Seems like you dont have a score yet
+                    </Paragraph>
+                )}
+            </Col>
+        </Flex>
+    );
+
+    if (!reputation) {
+        return reputationHeader;
+    }
+
+    return (
+        <Collapse
+            ghost
+            items={[
+                {
+                    key: "1",
+                    showArrow: false,
+                    label: reputationHeader,
+                    children: <RatingDetails reputation={reputation} />,
+                },
+            ]}
+        />
     );
 }
diff --git a/frontend/src/app/components/users/profile/ratings/RatingDetails.tsx b/frontend/src/app/components/users/profile/ratings/RatingDetails.tsx
@@ -0,0 +1,22 @@
+import React from "react";
+import { ReputationDetails } from "../../../../../redux/reducers/types/commonTypes";
+
+export default function RatingDetails({
+    reputation,
+}: {
+    reputation: ReputationDetails | undefined;
+}) {
+    if (!reputation) return null;
+
+    return (
+        <div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+            <div>RatingDetails</div>
+        </div>
+    );
+}
diff --git a/pods/admin.py b/pods/admin.py
@@ -3,7 +3,7 @@
 from django.utils.html import format_html
 
 
-from pods.models import Pod, PodInvite, User, WaitlistMember, UserPod, Badge, UserBadge
+from pods.models import Education, Experience, Interest, Pod, PodInvite, RegionInfo, ReputationDetails, User, WaitlistMember, UserPod, Badge, UserBadge
 
 
 class MembershipInline(admin.TabularInline):
@@ -14,8 +14,28 @@ class PodModelAdmin(admin.ModelAdmin):
     inlines = [MembershipInline]
 
 
+class ExperienceInline(admin.StackedInline):
+    model = Experience
+    extra = 1
+
+
+class EducationInline(admin.StackedInline):
+    model = Education
+    extra = 1
+
+
+class InterestInline(admin.StackedInline):
+    model = Interest
+    extra = 1
+
+class RegionInfoInline(admin.StackedInline):
+    model = RegionInfo
+    extra = 1
+
 class UserAdmin(UserAdmin):
     model = User
+    inlines = [ExperienceInline, EducationInline, InterestInline, RegionInfoInline]
+
 
     fieldsets = UserAdmin.fieldsets + (
         (
@@ -41,6 +61,9 @@ def image_tag(self, obj):
     ]
 
 
+admin.site.register(ReputationDetails)
+
+
 admin.site.register(User, UserAdmin)
 admin.site.register(Pod, PodModelAdmin)
 admin.site.register(UserPod)