Merge branch 'master' into 1470-interview-notes-on-recruitmentpositio…

…noverviewpage

backend/samfundet/serializers.py

@@ -345,6 +345,12 @@ class Meta:
         fields = '__all__'
 
 
+class PermissionSerializer(serializers.ModelSerializer):
+    class Meta:
+        model = Permission
+        fields = '__all__'
+
+
 class ProfileSerializer(serializers.ModelSerializer):
     class Meta:
         model = Profile

backend/samfundet/urls.py

@@ -24,6 +24,7 @@
 router.register('user-preference', views.UserPreferenceView, 'user_preference')
 router.register('saksdokument', views.SaksdokumentView, 'saksdokument')
 router.register('profile', views.ProfileView, 'profile')
+router.register('permissions', views.PermissionView, 'permissions')
 router.register('menu', views.MenuView, 'menu')
 router.register('menu-items', views.MenuItemView, 'menu_items')
 router.register('food-preference', views.FoodPreferenceView, 'food_preference')

backend/samfundet/views.py

@@ -28,7 +28,7 @@
 from django.utils.encoding import force_bytes
 from django.middleware.csrf import get_token
 from django.utils.decorators import method_decorator
-from django.contrib.auth.models import Group
+from django.contrib.auth.models import Group, Permission
 from django.views.decorators.csrf import csrf_protect, ensure_csrf_cookie
 
 from root.constants import (
@@ -65,6 +65,7 @@
     TextItemSerializer,
     InterviewSerializer,
     EventGroupSerializer,
+    PermissionSerializer,
     RecruitmentSerializer,
     ClosedPeriodSerializer,
     FoodCategorySerializer,
@@ -507,6 +508,11 @@ class ProfileView(ModelViewSet):
     queryset = Profile.objects.all()
 
 
+class PermissionView(ModelViewSet):
+    serializer_class = PermissionSerializer
+    queryset = Permission.objects.all()
+
+
 class WebhookView(APIView):
     """
     https://docs.github.com/en/webhooks/using-webhooks/validating-webhook-deliveries

biome.jsonc

@@ -33,7 +33,8 @@
   },
   "formatter": {
     "indentStyle": "space",
-    "lineWidth": 120
+    "lineWidth": 120,
+    "lineEnding": "lf"
   },
   "javascript": {
     "formatter": {

frontend/src/Components/ImageCard/ImageCard.module.scss

@@ -5,7 +5,13 @@
 $mobile-width: $primary-content-width-mobile;
 $card-border-radius: 0.5rem;
 $subtitle-max-height: 1rem;
-$card-gradient-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 30%, rgba(0, 0, 0, 0.54) 80%, rgba(0, 0, 0, 0.6) 100%);
+$card-gradient-overlay: linear-gradient(
+  180deg,
+  rgba(0, 0, 0, 0) 0%,
+  rgba(0, 0, 0, 0.05) 30%,
+  rgba(0, 0, 0, 0.54) 80%,
+  rgba(0, 0, 0, 0.6) 100%
+);
 $card-text-shadow: 1px 1px 8px rgba(0, 0, 0, 0.5);
 
 $card-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
@@ -62,12 +68,12 @@ $card-box-shadow-hover: 0 3px 8px 0 rgba(0, 0, 0, 0.4);
   font-weight: 700;
   font-size: 1.25rem;
   word-break: break-word;
-  transition: .2s;
+  transition: 0.2s;
   color: $white;
 }
 
 .subtitle {
-  transition: .1s;
+  transition: 0.1s;
   color: $grey-5;
   display: flex;
   justify-content: space-between;
@@ -78,7 +84,7 @@ $card-box-shadow-hover: 0 3px 8px 0 rgba(0, 0, 0, 0.4);
 }
 
 .date_label {
-  font-weight: 400;
+  font-weight: 700;
   color: $grey-4;
 }
 
@@ -127,6 +133,15 @@ $card-box-shadow-hover: 0 3px 8px 0 rgba(0, 0, 0, 0.4);
   visibility: hidden;
 }
 
+.ticket_type {
+  font-size: 0.7rem;
+  background-color: #ff9800;
+  color: black;
+  border-radius: 4px;
+  padding: 0.5px 6px;
+  text-align: center;
+}
+
 // Styling to container and children when it is hovered.
 .container:hover {
   .edit_button {

frontend/src/Components/ImageCard/ImageCard.tsx

@@ -1,6 +1,8 @@
 import classNames from 'classnames';
+import { t } from 'i18next';
 import type { ReactNode } from 'react';
 import { Skeleton } from '~/Components';
+import { KEY } from '~/i18n/constants';
 import type { Children } from '~/types';
 import { backgroundImageFromUrl } from '~/utils';
 import { Link } from '../Link';
@@ -19,6 +21,7 @@ type ImageCardProps = {
   compact?: boolean;
   isSkeleton?: boolean;
   children?: Children;
+  ticket_type?: string;
 };
 
 export function ImageCard({
@@ -32,6 +35,7 @@ export function ImageCard({
   compact,
   isSkeleton,
   children,
+  ticket_type,
 }: ImageCardProps) {
   const containerStyle = classNames(styles.container, compact && styles.compact, className);
   const cardStyle = classNames(styles.card);
@@ -45,6 +49,17 @@ export function ImageCard({
     );
   }
 
+  let displayTicketType = '';
+  if (ticket_type === 'billig' || ticket_type === 'custom') {
+    displayTicketType = t(KEY.common_ticket_type_billig);
+  }
+  if (ticket_type === 'free' || ticket_type === 'registration') {
+    displayTicketType = t(KEY.common_ticket_type_free);
+  }
+  if (ticket_type === 'included') {
+    displayTicketType = t(KEY.common_ticket_type_included);
+  }
+
   return (
     <div className={containerStyle}>
       <Link url={url} className={classNames(cardStyle, styles.image)} style={backgroundImageFromUrl(imageUrl)}>
@@ -59,6 +74,7 @@ export function ImageCard({
               <div className={styles.date_label}>
                 {date && <TimeDisplay timestamp={date} displayType="event-datetime" />}
               </div>
+              <div className={styles.ticket_type}>{displayTicketType}</div>
             </div>
 
             <div className={bottomDescriptionStyle}>{description}</div>

frontend/src/Components/Input/Input.tsx

@@ -2,19 +2,23 @@ import classNames from 'classnames';
 import * as React from 'react';
 import styles from './Input.module.scss';
 
-export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
-  onChange: (...event: unknown[]) => void;
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'onChange'> {
+  onChange: (value: string | number | readonly string[] | null) => void;
+  value: string | number | readonly string[] | null | undefined;
 }
 
-export const Input = React.forwardRef<HTMLInputElement, InputProps>(({ className, type, onChange, ...props }, ref) => {
-  return (
-    <input
-      type={type}
-      className={classNames(styles.input_field, type === 'number' && styles.number_input, className)}
-      onChange={(event) => (type === 'number' ? onChange?.(+event.target.value) : onChange?.(event.target.value))}
-      ref={ref}
-      {...props}
-    />
-  );
-});
+export const Input = React.forwardRef<HTMLInputElement, InputProps>(
+  ({ className, type, onChange, value, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={classNames(styles.input_field, type === 'number' && styles.number_input, className)}
+        onChange={(event) => (type === 'number' ? onChange?.(+event.target.value) : onChange?.(event.target.value))}
+        ref={ref}
+        value={value === null ? '' : value}
+        {...props}
+      />
+    );
+  },
+);
 Input.displayName = 'Input';