Umuzi-org / Tilde

Open source agile, collaborative learning platform.
52 stars 34 forks source link

Make a widget that displays the Premissions that a single user has #101

Closed sheenarbw closed 3 years ago

sheenarbw commented 3 years ago

This widget just needs to be demonstrated as a Story in Storybook. It doesn't need to be incorperated into the main app just yet.

The widget needs to look neat and tidy and be fit for human consuption.

The widget should show all the teams that a user has permission for. For each of those teams you need to display:

  1. The team name
  2. Whether the team is active or not
  3. a list of permissions

Here are some MaterialUi widgets that could be useful:

Remember KISS. We just need to see the data.

sheenarbw commented 3 years ago

Here is some sample data you can use in your story:

{'teams': {2: {'active': False,
               'id': 2,
               'name': 'Cohort 18 java',
               'permissions': ['VIEW_ALL']},
           4: {'active': False,
               'id': 4,
               'name': 'Cohort 21 web dev',
               'permissions': ['VIEW_ALL']},
           5: {'active': False,
               'id': 5,
               'name': 'Cohort 21 web dev BBD',
               'permissions': ['VIEW_ALL']},
           9: {'active': False,
               'id': 9,
               'name': 'Cohort 21 data sci',
               'permissions': ['VIEW_ALL']},
           10: {'active': True,
                'id': 10,
                'name': 'Cohort 23 data sci',
                'permissions': ['VIEW_ALL']},
           16: {'active': True,
                'id': 16,
                'name': 'Data Science Recruits',
                'permissions': ['VIEW_ALL']},
           18: {'active': True,
                'id': 18,
                'name': 'Tech seniors',
                'permissions': ['VIEW_ALL']},
           19: {'active': True,
                'id': 19,
                'name': 'Staff Data Sci',
                'permissions': ['VIEW_ALL']},
           23: {'active': False,
                'id': 23,
                'name': 'B2C intro to web dev',
                'permissions': ['VIEW_ALL']},
           24: {'active': True,
                'id': 24,
                'name': 'Cohort 24 data eng',
                'permissions': ['VIEW_ALL']},
           28: {'active': True,
                'id': 28,
                'name': 'Cohort 22 web dev',
                'permissions': ['VIEW_ALL']},
           29: {'active': True,
                'id': 29,
                'name': 'Tech Junior Staff',
                'permissions': ['VIEW_ALL']},
           36: {'active': False,
                'id': 36,
                'name': 'External Demos',
                'permissions': ['VIEW_ALL']},
           40: {'active': True,
                'id': 40,
                'name': 'Staff Web Dev',
                'permissions': ['VIEW_ALL']},
           41: {'active': True,
                'id': 41,
                'name': 'Cohort 24 data sci',
                'permissions': ['VIEW_ALL']},
           44: {'active': True,
                'id': 44,
                'name': 'Non Staff JTL',
                'permissions': ['VIEW_ALL']},
           53: {'active': False,
                'id': 53,
                'name': 'Cohort 1000 tilde intro student',
                'permissions': ['VIEW_ALL']},
           54: {'active': False,
                'id': 54,
                'name': 'Cohort 21 web: A',
                'permissions': ['VIEW_ALL', 'TRUSTED_REVIEWER']},
           56: {'active': True,
                'id': 56,
                'name': 'Cohort 24 web dev',
                'permissions': ['VIEW_ALL']},
           57: {'active': False,
                'id': 57,
                'name': 'Cohort 21+19 web dev - BLUE',
                'permissions': ['VIEW_ALL', 'TRUSTED_REVIEWER']},
           60: {'active': True,
                'id': 60,
                'name': 'Cohort 19 IT Support',
                'permissions': ['VIEW_ALL']},
           62: {'active': False,
                'id': 62,
                'name': 'Cohort 21 web: B',
                'permissions': ['VIEW_ALL', 'TRUSTED_REVIEWER']},
           64: {'active': False,
                'id': 64,
                'name': 'Boot Java 11 Jan 2021',
                'permissions': ['MANAGE_CARDS',
                                'VIEW_ALL',
                                'REVIEW_CARDS',
                                'TRUSTED_REVIEWER']},
           67: {'active': False,
                'id': 67,
                'name': 'Cohort 21+19 web dev - RED',
                'permissions': ['VIEW_ALL', 'TRUSTED_REVIEWER']},
           68: {'active': False,
                'id': 68,
                'name': 'Cohort 19 & 21 web',
                'permissions': ['VIEW_ALL', 'TRUSTED_REVIEWER']},
           87: {'active': False,
                'id': 87,
                'name': 'alumni react specialisation',
                'permissions': ['VIEW_ALL']},
           93: {'active': False,
                'id': 93,
                'name': 'C19-web-on-track',
                'permissions': ['VIEW_ALL']},
           99: {'active': False,
                'id': 99,
                'name': 'Code Club NG',
                'permissions': ['VIEW_ALL']},
           102: {'active': True,
                 'id': 102,
                 'name': 'Staff Scrum masters',
                 'permissions': ['VIEW_ALL']},
           105: {'active': False,
                 'id': 105,
                 'name': 'Boot alumni web dev 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           106: {'active': False,
                 'id': 106,
                 'name': 'Boot alumni data eng 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           107: {'active': False,
                 'id': 107,
                 'name': 'Boot alumni java 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           108: {'active': False,
                 'id': 108,
                 'name': 'Boot web dev 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           109: {'active': False,
                 'id': 109,
                 'name': 'Boot data eng 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           110: {'active': False,
                 'id': 110,
                 'name': 'Boot java 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           111: {'active': False,
                 'id': 111,
                 'name': 'Boot it support 1 Feb 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           112: {'active': True,
                 'id': 112,
                 'name': 'Problem Solving Foundation 1',
                 'permissions': ['REVIEW_CARDS']},
           113: {'active': True,
                 'id': 113,
                 'name': 'Problem Solving Foundation 2',
                 'permissions': ['MANAGE_CARDS']},
           122: {'active': True,
                 'id': 122,
                 'name': 'Cohort 26 java',
                 'permissions': ['REVIEW_CARDS']},
           123: {'active': False,
                 'id': 123,
                 'name': 'Boot data sci 1 March 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           124: {'active': False,
                 'id': 124,
                 'name': 'Boot web dev 1 March 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           126: {'active': True,
                 'id': 126,
                 'name': 'Cohort 25 data eng',
                 'permissions': ['REVIEW_CARDS']},
           127: {'active': True,
                 'id': 127,
                 'name': 'Cohort 25 data sci',
                 'permissions': ['REVIEW_CARDS']},
           128: {'active': True,
                 'id': 128,
                 'name': 'Cohort 25 java',
                 'permissions': ['REVIEW_CARDS']},
           129: {'active': True,
                 'id': 129,
                 'name': 'Cohort 25 web dev',
                 'permissions': ['REVIEW_CARDS']},
           131: {'active': False,
                 'id': 131,
                 'name': 'Boot data eng 6 April 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           132: {'active': False,
                 'id': 132,
                 'name': 'Boot web dev 6 April 2021',
                 'permissions': ['TRUSTED_REVIEWER']},
           133: {'active': True,
                 'id': 133,
                 'name': 'Cohort 27 web dev',
                 'permissions': ['REVIEW_CARDS']},
           134: {'active': True,
                 'id': 134,
                 'name': 'Provisionally accepted data sci',
                 'permissions': ['REVIEW_CARDS']},
           135: {'active': True,
                 'id': 135,
                 'name': 'Provisionally accepted web dev',
                 'permissions': ['REVIEW_CARDS']},
           136: {'active': True,
                 'id': 136,
                 'name': 'Provisionally accepted data eng',
                 'permissions': ['REVIEW_CARDS']},
           137: {'active': True,
                 'id': 137,
                 'name': 'Provisionally accepted java',
                 'permissions': ['REVIEW_CARDS']},
           139: {'active': True,
                 'id': 139,
                 'name': 'Cohort 25 web dev alumni',
                 'permissions': ['REVIEW_CARDS']},
           140: {'active': True,
                 'id': 140,
                 'name': 'Cohort 25 java alumni',
                 'permissions': ['REVIEW_CARDS']},
           141: {'active': True,
                 'id': 141,
                 'name': 'Cohort 25 data eng alumni',
                 'permissions': ['REVIEW_CARDS']},
           142: {'active': True,
                 'id': 142,
                 'name': 'Cohort 25 web dev 1',
                 'permissions': ['REVIEW_CARDS']},
           143: {'active': True,
                 'id': 143,
                 'name': 'Cohort 25 web dev 2',
                 'permissions': ['REVIEW_CARDS']},
           144: {'active': True,
                 'id': 144,
                 'name': 'Boot web dev 3 May 2021',
                 'permissions': ['TRUSTED_REVIEWER']}}}
Babalwa01 commented 3 years ago

Goal: Create a Story that displays User permissions. Plan:

  1. Make a file at frontend/src/components/regions/UserDetails/PermissionsTable/Presentation.js.
  2. Make a Component in the file, that renders a permissions table.
  3. Make a story for the component in the folder frontend/src/stories.
  4. Make a PR by 14th June 5pm.