fix(requests): remove unnecessary margin between avatar and username

Signed-off-by: Ludovic Ortega <ludovic.ortega@adminafk.fr>

charts/jellyseerr-chart/Chart.yaml

@@ -3,8 +3,8 @@ kubeVersion: ">=1.23.0-0"
 name: jellyseerr-chart
 description: Jellyseerr helm chart for Kubernetes
 type: application
-version: 2.5.0
-appVersion: "2.6.0"
+version: 2.6.0
+appVersion: "2.7.0"
 maintainers:
   - name: Jellyseerr
     url: https://github.com/Fallenbagel/jellyseerr

charts/jellyseerr-chart/README.md

@@ -1,6 +1,6 @@
 # jellyseerr-chart
 
-![Version: 2.5.0](https://img.shields.io/badge/Version-2.5.0-informational?style=flat-square) ![Type: application](https://img.shields.io/badge/Type-application-informational?style=flat-square) ![AppVersion: 2.6.0](https://img.shields.io/badge/AppVersion-2.6.0-informational?style=flat-square)
+![Version: 2.6.0](https://img.shields.io/badge/Version-2.6.0-informational?style=flat-square) ![Type: application](https://img.shields.io/badge/Type-application-informational?style=flat-square) ![AppVersion: 2.7.0](https://img.shields.io/badge/AppVersion-2.7.0-informational?style=flat-square)
 
 Jellyseerr helm chart for Kubernetes
 

docs/troubleshooting.mdx

@@ -105,6 +105,12 @@ In some places (like China), the ISP blocks not only the DNS resolution but also
 
 You can configure Jellyseerr to use a proxy with the [HTTP(S) Proxy](/using-jellyseerr/settings/general#https-proxy) setting.
 
+### Option 3: Force IPV4 resolution first
+
+Sometimes there are configuration issues with IPV6 that prevent the hostname resolution from working correctly.
+
+You can try to force the resolution to use IPV4 first by going to `Settings > Networking > Advanced Networking` and enabling `Force IPv4 Resolution First` setting and restarting Jellyseerr.
+
 ### Option 4: Check that your server can reach TMDB API
 
 Make sure that your server can reach the TMDB API by running the following command:

pnpm-lock.yaml

@@ -15811,7 +15811,7 @@ snapshots:
       debug: 4.3.5
       enhanced-resolve: 5.17.0
       eslint: 8.35.0
-      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.35.0)
+      eslint-module-utils: 2.8.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.35.0))(eslint@8.35.0)
       eslint-plugin-import: 2.29.1(@typescript-eslint/parser@5.54.0(eslint@8.35.0)(typescript@4.9.5))(eslint@8.35.0)
       fast-glob: 3.3.2
       get-tsconfig: 4.7.5
@@ -15833,7 +15833,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  eslint-module-utils@2.8.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1)(eslint@8.35.0):
+  eslint-module-utils@2.8.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.1(@typescript-eslint/parser@7.2.0(eslint@8.35.0)(typescript@4.9.5))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.29.1)(eslint@8.35.0))(eslint@8.35.0):
     dependencies:
       debug: 3.2.7(supports-color@8.1.1)
     optionalDependencies:

server/api/externalapi.ts

@@ -37,6 +37,8 @@ class ExternalAPI {
         ...options.headers,
       },
     });
+    this.axios.interceptors.request = axios.interceptors.request;
+    this.axios.interceptors.response = axios.interceptors.response;
 
     if (options.rateLimit) {
       this.axios = rateLimit(this.axios, {

server/api/tautulli.ts

@@ -123,6 +123,8 @@ class TautulliAPI {
       }${settings.urlBase ?? ''}`,
       params: { apikey: settings.apiKey },
     });
+    this.axios.interceptors.request = axios.interceptors.request;
+    this.axios.interceptors.response = axios.interceptors.response;
   }
 
   public async getInfo(): Promise<TautulliInfo> {

server/index.ts

@@ -28,6 +28,7 @@ import { getAppVersion } from '@server/utils/appVersion';
 import createCustomProxyAgent from '@server/utils/customProxyAgent';
 import restartFlag from '@server/utils/restartFlag';
 import { getClientIp } from '@supercharge/request-ip';
+import axios from 'axios';
 import { TypeormStore } from 'connect-typeorm/out';
 import cookieParser from 'cookie-parser';
 import type { NextFunction, Request, Response } from 'express';
@@ -35,6 +36,8 @@ import express from 'express';
 import * as OpenApiValidator from 'express-openapi-validator';
 import type { Store } from 'express-session';
 import session from 'express-session';
+import http from 'http';
+import https from 'https';
 import next from 'next';
 import path from 'path';
 import swaggerUi from 'swagger-ui-express';
@@ -73,6 +76,11 @@ app
     const settings = await getSettings().load();
     restartFlag.initializeSettings(settings);
 
+    if (settings.network.forceIpv4First) {
+      axios.defaults.httpAgent = new http.Agent({ family: 4 });
+      axios.defaults.httpsAgent = new https.Agent({ family: 4 });
+    }
+
     // Register HTTP proxy
     if (settings.network.proxy.enabled) {
       await createCustomProxyAgent(settings.network.proxy);

server/lib/imageproxy.ts

@@ -150,6 +150,8 @@ class ImageProxy {
       baseURL: baseUrl,
       headers: options.headers,
     });
+    this.axios.interceptors.request = axios.interceptors.request;
+    this.axios.interceptors.response = axios.interceptors.response;
 
     if (options.rateLimitOptions) {
       this.axios = rateLimit(this.axios, options.rateLimitOptions);

server/lib/settings/index.ts

@@ -140,6 +140,7 @@ export interface MainSettings {
 
 export interface NetworkSettings {
   csrfProtection: boolean;
+  forceIpv4First: boolean;
   trustProxy: boolean;
   proxy: ProxySettings;
 }
@@ -544,6 +545,7 @@ class Settings {
       },
       network: {
         csrfProtection: false,
+        forceIpv4First: false,
         trustProxy: false,
         proxy: {
           enabled: false,

server/utils/customProxyAgent.ts

@@ -56,12 +56,9 @@ export default async function createCustomProxyAgent(
       : undefined;
 
   try {
-    const proxyUrl =
-      (proxySettings.useSsl ? 'https://' : 'http://') +
-      proxySettings.hostname +
-      ':' +
-      proxySettings.port;
-
+    const proxyUrl = `${proxySettings.useSsl ? 'https' : 'http'}://${
+      proxySettings.hostname
+    }:${proxySettings.port}`;
     const proxyAgent = new ProxyAgent({
       uri: proxyUrl,
       token,
@@ -70,10 +67,17 @@ export default async function createCustomProxyAgent(
 
     setGlobalDispatcher(proxyAgent.compose(noProxyInterceptor));
 
-    axios.defaults.httpAgent = new HttpProxyAgent(proxyUrl);
-    axios.defaults.httpsAgent = new HttpsProxyAgent(proxyUrl);
+    axios.defaults.httpAgent = new HttpProxyAgent(proxyUrl, {
+      headers: token ? { 'proxy-authorization': token } : undefined,
+    });
+    axios.defaults.httpsAgent = new HttpsProxyAgent(proxyUrl, {
+      headers: token ? { 'proxy-authorization': token } : undefined,
+    });
     axios.interceptors.request.use((config) => {
-      if (config.url && skipUrl(config.url)) {
+      const url = config.baseURL
+        ? new URL(config.baseURL + (config.url || ''))
+        : config.url;
+      if (url && skipUrl(url)) {
         config.httpAgent = false;
         config.httpsAgent = false;
       }

src/components/Layout/UserDropdown/index.tsx

@@ -1,6 +1,6 @@
 import CachedImage from '@app/components/Common/CachedImage';
 import MiniQuotaDisplay from '@app/components/Layout/UserDropdown/MiniQuotaDisplay';
-import { useUser } from '@app/hooks/useUser';
+import { Permission, useUser } from '@app/hooks/useUser';
 import defineMessages from '@app/utils/defineMessages';
 import { Menu, Transition } from '@headlessui/react';
 import {
@@ -36,7 +36,7 @@ ForwardedLink.displayName = 'ForwardedLink';
 
 const UserDropdown = () => {
   const intl = useIntl();
-  const { user, revalidate } = useUser();
+  const { user, revalidate, hasPermission } = useUser();
 
   const logout = async () => {
     const response = await axios.post('/api/v1/auth/logout');
@@ -118,7 +118,14 @@ const UserDropdown = () => {
               <Menu.Item>
                 {({ active }) => (
                   <ForwardedLink
-                    href={`/users/${user?.id}/requests?filter=all`}
+                    href={
+                      hasPermission(
+                        [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
+                        { type: 'or' }
+                      )
+                        ? `/users/${user?.id}/requests?filter=all`
+                        : '/requests'
+                    }
                     className={`flex items-center rounded px-4 py-2 text-sm font-medium text-gray-200 transition duration-150 ease-in-out ${
                       active
                         ? 'bg-gradient-to-br from-indigo-600 to-purple-600 text-white'

src/components/RequestBlock/index.tsx

@@ -1,5 +1,6 @@
 import Badge from '@app/components/Common/Badge';
 import Button from '@app/components/Common/Button';
+import CachedImage from '@app/components/Common/CachedImage';
 import Tooltip from '@app/components/Common/Tooltip';
 import RequestModal from '@app/components/RequestModal';
 import useRequestOverride from '@app/hooks/useRequestOverride';
@@ -95,36 +96,58 @@ const RequestBlock = ({ request, onUpdate }: RequestBlockProps) => {
         <div className="flex items-center justify-between">
           <div className="mr-6 min-w-0 flex-1 flex-col items-center text-sm leading-5">
             <div className="white mb-1 flex flex-nowrap">
-              <Tooltip content={intl.formatMessage(messages.requestedby)}>
-                <UserIcon className="mr-1.5 h-5 w-5 min-w-0 flex-shrink-0" />
-              </Tooltip>
-              <span className="w-40 truncate md:w-auto">
+              <span className="flex w-40 items-center truncate md:w-auto">
+                <Tooltip content={intl.formatMessage(messages.requestedby)}>
+                  <UserIcon className="mr-1.5 h-5 w-5 min-w-0 flex-shrink-0" />
+                </Tooltip>
                 <Link
                   href={
                     request.requestedBy.id === user?.id
                       ? '/profile'
                       : `/users/${request.requestedBy.id}`
                   }
-                  className="font-semibold text-gray-100 transition duration-300 hover:text-white hover:underline"
+                  className="flex items-center font-semibold text-gray-100 transition duration-300 hover:text-white hover:underline"
                 >
+                  <span className="avatar-sm">
+                    <CachedImage
+                      type="avatar"
+                      src={request.requestedBy.avatar}
+                      alt=""
+                      className="avatar-sm object-cover"
+                      width={20}
+                      height={20}
+                    />
+                  </span>
                   {request.requestedBy.displayName}
                 </Link>
               </span>
             </div>
             {request.modifiedBy && (
               <div className="flex flex-nowrap">
-                <Tooltip content={intl.formatMessage(messages.lastmodifiedby)}>
-                  <EyeIcon className="mr-1.5 h-5 w-5 flex-shrink-0" />
-                </Tooltip>
-                <span className="w-40 truncate md:w-auto">
+                <span className="flex w-40 items-center truncate md:w-auto">
+                  <Tooltip
+                    content={intl.formatMessage(messages.lastmodifiedby)}
+                  >
+                    <EyeIcon className="mr-1.5 h-5 w-5 flex-shrink-0" />
+                  </Tooltip>
                   <Link
                     href={
                       request.modifiedBy.id === user?.id
                         ? '/profile'
                         : `/users/${request.modifiedBy.id}`
                     }
-                    className="font-semibold text-gray-100 transition duration-300 hover:text-white hover:underline"
+                    className="flex items-center font-semibold text-gray-100 transition duration-300 hover:text-white hover:underline"
                   >
+                    <span className="avatar-sm">
+                      <CachedImage
+                        type="avatar"
+                        src={request.modifiedBy.avatar}
+                        alt=""
+                        className="avatar-sm object-cover"
+                        width={20}
+                        height={20}
+                      />
+                    </span>
                     {request.modifiedBy.displayName}
                   </Link>
                 </span>

src/components/Settings/SettingsNetwork/index.tsx

@@ -42,6 +42,9 @@ const messages = defineMessages('components.Settings.SettingsNetwork', {
   networkDisclaimer:
     'Network parameters from your container/system should be used instead of these settings. See the {docs} for more information.',
   docs: 'documentation',
+  forceIpv4First: 'Force IPv4 Resolution First',
+  forceIpv4FirstTip:
+    'Force Jellyseerr to resolve IPv4 addresses first instead of IPv6',
 });
 
 const SettingsNetwork = () => {
@@ -86,6 +89,7 @@ const SettingsNetwork = () => {
         <Formik
           initialValues={{
             csrfProtection: data?.csrfProtection,
+            forceIpv4First: data?.forceIpv4First,
             trustProxy: data?.trustProxy,
             proxyEnabled: data?.proxy?.enabled,
             proxyHostname: data?.proxy?.hostname,
@@ -102,6 +106,7 @@ const SettingsNetwork = () => {
             try {
               await axios.post('/api/v1/settings/network', {
                 csrfProtection: values.csrfProtection,
+                forceIpv4First: values.forceIpv4First,
                 trustProxy: values.trustProxy,
                 proxy: {
                   enabled: values.proxyEnabled,
@@ -193,6 +198,29 @@ const SettingsNetwork = () => {
                     </Tooltip>
                   </div>
                 </div>
+                <div className="form-row">
+                  <label htmlFor="forceIpv4First" className="checkbox-label">
+                    <span className="mr-2">
+                      {intl.formatMessage(messages.forceIpv4First)}
+                    </span>
+                    <SettingsBadge badgeType="advanced" className="mr-2" />
+                    <SettingsBadge badgeType="restartRequired" />
+                    <SettingsBadge badgeType="experimental" />
+                    <span className="label-tip">
+                      {intl.formatMessage(messages.forceIpv4FirstTip)}
+                    </span>
+                  </label>
+                  <div className="form-input-area">
+                    <Field
+                      type="checkbox"
+                      id="forceIpv4First"
+                      name="forceIpv4First"
+                      onChange={() => {
+                        setFieldValue('forceIpv4First', !values.forceIpv4First);
+                      }}
+                    />
+                  </div>
+                </div>
                 <div className="form-row">
                   <label htmlFor="proxyEnabled" className="checkbox-label">
                     <span className="mr-2">

src/components/UserProfile/index.tsx

@@ -160,9 +160,12 @@ const UserProfile = () => {
                 <dd className="mt-1 text-3xl font-semibold text-white">
                   <Link
                     href={
-                      user.id === currentUser?.id
-                        ? '/profile/requests?filter=all'
-                        : `/users/${user?.id}/requests?filter=all`
+                      currentHasPermission(
+                        [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
+                        { type: 'or' }
+                      )
+                        ? `/users/${user?.id}/requests?filter=all`
+                        : '/requests'
                     }
                   >
                     {intl.formatNumber(user.requestCount)}
@@ -293,9 +296,12 @@ const UserProfile = () => {
             <div className="slider-header">
               <Link
                 href={
-                  user.id === currentUser?.id
-                    ? '/profile/requests?filter=all'
-                    : `/users/${user?.id}/requests?filter=all`
+                  currentHasPermission(
+                    [Permission.MANAGE_REQUESTS, Permission.REQUEST_VIEW],
+                    { type: 'or' }
+                  )
+                    ? `/users/${user?.id}/requests?filter=all`
+                    : '/requests'
                 }
                 className="slider-title"
               >

src/i18n/locale/en.json

@@ -978,10 +978,13 @@
   "components.Settings.SettingsMain.validationUrl": "You must provide a valid URL",
   "components.Settings.SettingsMain.validationUrlTrailingSlash": "URL must not end in a trailing slash",
   "components.Settings.SettingsMain.youtubeUrl": "YouTube URL",
+  "components.Settings.SettingsMain.youtubeUrlTip": "Base URL for YouTube videos if a self-hosted YouTube instance is used.",
   "components.Settings.SettingsNetwork.csrfProtection": "Enable CSRF Protection",
   "components.Settings.SettingsNetwork.csrfProtectionHoverTip": "Do NOT enable this setting unless you understand what you are doing!",
   "components.Settings.SettingsNetwork.csrfProtectionTip": "Set external API access to read-only (requires HTTPS)",
   "components.Settings.SettingsNetwork.docs": "documentation",
+  "components.Settings.SettingsNetwork.forceIpv4First": "Force IPv4 Resolution First",
+  "components.Settings.SettingsNetwork.forceIpv4FirstTip": "Force Jellyseerr to resolve IPv4 addresses first instead of IPv6",
   "components.Settings.SettingsNetwork.network": "Network",
   "components.Settings.SettingsNetwork.networkDisclaimer": "Network parameters from your container/system should be used instead of these settings. See the {docs} for more information.",
   "components.Settings.SettingsNetwork.networksettings": "Network Settings",
@@ -1213,7 +1216,7 @@
   "components.Setup.librarieserror": "Validation failed. Please toggle the libraries again to continue.",
   "components.Setup.servertype": "Choose Server Type",
   "components.Setup.setup": "Setup",
-  "components.Setup.signin": "Sign in to your account",
+  "components.Setup.signin": "Sign In",
   "components.Setup.signinMessage": "Get started by signing in",
   "components.Setup.signinWithEmby": "Enter your Emby details",
   "components.Setup.signinWithJellyfin": "Enter your Jellyfin details",

src/pages/profile/requests.tsx

@@ -1,8 +0,0 @@
-import RequestList from '@app/components/RequestList';
-import type { NextPage } from 'next';
-
-const UserRequestsPage: NextPage = () => {
-  return <RequestList />;
-};
-
-export default UserRequestsPage;